• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

ID Tag automatisch vergeben

S

stenz

Mitglied
Hallo,
ich habe auf meiner Seite eine Navigation eingebaut.
Siehe Bild bitte. :)
Imageshack - navip.png
Auf jeden Fall wenn ich von B zb nach A wechsel, soll A in Gelb markiert sein.
Das klappt auch wunderbar, jedoch mit sehr vielen einzelnen Dateien.
Muss für extra alle Buchstaben extra eine Datei anlegen und den id="current" verschieben, da die Seite täglich aktualisiert werden soll, seh ich da einen enormen Aufwand zu mich kommen, falls das nicht anders zu lösen ist.
Das "current" erzeugt diesen Effekt.
Wie kann ich es bewerkstelligen, das dieses ID von alleine auf das jeweilige wechselt? Muss ich evtll. ganz was anderes versuchen?!
Hab den PHP Code mit include einfach in die HTML Datei eingefügt und deswegen nicht mitreinkopiert. :=)
PHP: 
<li><a href="start.php">Anasayfa</a></li>
<li><a href="start_a.php">A</a></li>
<li><a href="start_b.php" id="current">B</a></li>
<li><a href="start_c.php">C</a></li>
<li><a href="start_e.php">E</a></li>
<li><a href="start_g.php">G</a></li>
<li><a href="start_h.php">H</a></li>
<li><a href="start_i.php">I</a></li>
<li><a href="start_k.php">K</a></li>
<li><a href="start_p.php">P</a></li>
<li><a href="start_s.php">S</a></li>
<li><a href="start_u.php">U</a></li>
<li><a href="start_y.php">Y</a></li>
Code: 
.navi            {
                height:            20px;
                width:            800px;
                margin:            auto;
                font-family:         Helvetica;
                border-bottom:         1px solid #FFFFFF;
            }

    .navi ul        {
                    margin-left:        40px;
                    margin-top:        10px;
                    padding-left:         0px;
                }

        .navi li        {    
                        padding:         0;
                        margin:         0;
                        display:         inline;
                    }

        .navi li a        {    
                        letter-spacing:     -1px;
                        text-decoration:     none;
                        color:             #ccc;
                        font-size:         16px;
                        padding:         0 2px;
                        border-left:         2px solid #FFFFFF;
                    }

        .navi li a:hover
                    {    
                        color:             #6fc;
                        text-shadow:        0em 0em 0.05em #000000;
                        border-left:         2px solid #6fc;
                    }

        .navi a#current     {     
                        color:             #fc6;
                        border-left:         2px solid #fc6; 
                    }
gruß stenz
 
Das kannst Du mit einer serverseitigen Scriptsprache lösen.
Die prüft, welche Seite aktuell angezeigt wird und setzt dann die ID dementsprechend.
 
"serverseitige Scriptsprache" = PHP?
Wenn ja, wie den genau? Hab echt keine Vorstellungen wie ich dieses Problem realisieren kann.
Muss ja nicht alles vorgekaut werden, mir würde auch nur ein Anhaltspunkt reichen. :)
 
PHP ist eine von vielen serverseitigen Sprachen, ja.
Dein Script muss wissen, welche Seite gerade angezeigt wird, das geht entweder über so Dinge wie $_SERVER["SCRIPT_NAME"] oder per Übergabeparameter (je nachdem, wie Deine Seiten aufgebaut sind), z.B. wenn Du Deine Seiten so aufrufst: "page.php?page=foobar", dann wäre "foobar" der Name der Seite.
Dann prüfst Du beim Aufbau Deines Menüs einfach, ob der aktuelle Menüpunkt zum Seitenname passt und gibst dann die ID aus.
 
Würde das Ganze übrigens eher über eine Klasse als über eine ID lösen. Denn nehmen wir mal an, du willst Untermenüs haben. So müsstest du für jedes Untermenü eine neue Id vergeben.
Und wie du das Menü dann setzt hat Efchen ja schon geschrieben :)
 
Also ich blick da echt null durch bei PHP, bin in diesem Feld echt noch ein Anfänger. :( Einfache Sachen gehen ja noch, aber wenn es weiter in die Materie geht, fehlt irgendwie der Zusammenhang bei mir...
Deshalb post ich mal die ganzen Codes, weiß eben nicht wie ich das mit dem $_SERVER("NAME") gebacken kriegen soll.
Also das ist der Code meiner Seite bei B:
PHP: 
<html xmlns="http://www.w3.org/1999/xhtml">
        <head>
                <title>Anasayfa</title>
                <link rel="stylesheet" type="text/css" href="form_start.css" />
        </head>

        <body>
                <div class="navi">
                        <ul>
                                <?php include("start_b_navi.php");?>
                        <ul>
                </div>

                <div class="subnavi">
                        <ul class="subnavi ul">
                                <?php include("start_b_subnavi.php");?>
                        <ul>
                </div>

                <div class="kopf">
                </div>

                <div class="content">
                        <div class="reklam1">
                        </div>

                        <div class="reklam2">
                        </div>

                        <div class="video">
                                <?php include("newdizi_start_c.php");?>
                        </div>

                        <div class="reklam3">
                        </div>

                        <div class="reklam4">
                        </div>
                </div>

                <div class="fuss">
                        <?php include("fuss.php"); ?>
                </div>
        </body>
</html>
Den CSS Code für die Navi:
Code: 
.navi            {
                height:            20px;
                width:            800px;
                margin:            auto;
                font-family:         Helvetica;
                border-bottom:         1px solid #FFFFFF;
            }

    .navi ul        {
                    margin-left:        40px;
                    margin-top:        10px;
                    padding-left:         0px;
                }

        .navi li        {    
                        padding:         0;
                        margin:         0;
                        display:         inline;
                    }

        .navi li a        {    
                        letter-spacing:     -1px;
                        text-decoration:     none;
                        color:             #ccc;
                        font-size:         16px;
                        padding:         0 2px;
                        border-left:         2px solid #FFFFFF;
                    }

        .navi li a:hover
                    {    
                        color:             #6fc;
                        text-shadow:        0em 0em 0.05em #000000;
                        border-left:         2px solid #6fc;
                    }

        .navi a#current     {     
                        color:             #fc6;
                        border-left:         2px solid #fc6; 
                    }

.subnavi        {    
                height:            20px;
                width:            800px;
                margin:            auto;
                font-family:         Helvetica;
            }

    .subnavi ul        {
                    margin-left:        40px;
                    margin-top:        0;
                    padding:         0;
                }

        .subnavi li        {    
                        padding:         0;
                        margin:         5 0 0 0;
                        display:         inline;
                    }

        .subnavi li a        {    
                        letter-spacing:     -1px;
                        text-decoration:     none;
                        color:             #ccc;
                        font-size:         13px;
                        padding:         0 2px;
                        border-left:         1em solid #FFFFFF;
                    }

        .subnavi li a:hover
                    {    
                        color:             #f6a;
                        text-shadow:        0em 0em .1em #000000;
                        border-left:         1em solid #f6a;
                    }

        .subnavi a#currentsub     {     
                        color:             #fb9;
                        border-left:         1em solid #fb9; 
                    }
Und die beiden includeten PHP Dateien:
PHP: 
                                <li><a href="start.php">Anasayfa</a></li>
                                <li><a href="start_a.php">A</a></li>
                                <li><a href="start_b.php" id="current">B</a></li>
                                <li><a href="start_c.php">C</a></li>
                                <li><a href="start_e.php">E</a></li>
                                <li><a href="start_g.php">G</a></li>
                                <li><a href="start_h.php">H</a></li>
                                <li><a href="start_i.php">I</a></li>
                                <li><a href="start_k.php">K</a></li>
                                <li><a href="start_p.php">P</a></li>
                                <li><a href="start_s.php">S</a></li>
                                <li><a href="start_u.php">U</a></li>
                                <li><a href="start_y.php">Y</a></li>
PHP: 
<li><a href="#">Benim Annem Bir Melek</a></li>
<li><a href="#">Beyaz Show</a></li>
<li><a href="#">BKM Mutfak</a></li>

Glaube das man sich da nicht so großartig einbearbeiten muss, da es ja nichts komplexes ist. :) Würde mich echt freuen, wenn mir jemand aus der Misere helfen kann. Denn den dritten Code müsste ich sonst wie ich es jetzt habe 13Mal für alle Buchstaben erstellen und es schaut halt nicht gut aus wenn ich jedesmal eine neue Datei namens start_xyz_navi.php habe, ist halt ziemlich durcheinander. :)

Gruß Stenz
 
erstellst die ganzen Listenpunkte am besten auch mit ner Schleife
Nur mal ein Beispiel für den Listen Part.

PHP: 
<?php

$liste = "";

// Ich mach mal nur bis g
$listenElemente = array("a","b","c","d","e","f","g");

for($i =0; $i < count($listenElemente); $i++) {
   // letzten Buchstaben zurückgeben (gibt etwas zwischen a und z wieder)
   $buchstabe = substr($_SERVER['PHP_SELF'], -5, -4);
   // Prüfen ob Ausgewählte Seite diesen Link entspricht
   $currentSite = ($buchstabe == $listenElemente[$i]) ? "currentSite" : "site";
   $liste .= "<li class='".$currentSite."'><a href='seite_".$listenElement[$i]."'>".$listenElement[$i]."</a></li>";
}

  echo "<ul>".$liste."</ul>";
?>
 
stenz schrieb:
Also ich blick da echt null durch bei PHP, bin in diesem Feld echt noch ein Anfänger. :(
Zum Vergrößern anklicken....
Dann jammer nicht rum, sondern ändere diesen Zustand! :-) Es gibt massenweise PHP-Tutorials und sicher auch Tutorials fürs Programmieren. Ist schon klar, dass das Verständnis nicht von heute auf morgen kommt. Aber das darfst auch Du nicht erwarten!

Glaube das man sich da nicht so großartig einbearbeiten muss, da es ja nichts komplexes ist.
Zum Vergrößern anklicken....
Na, da glaubst Du aber falsch. Wenn Du nichtmal programmieren kannst, dann sieht es düster aus für Dich. Dann kannst Du PHP auch nicht wirklich in den Griff kriegen. Programmierung ist sehr wohl ein komplexes Kapitel, ganz anders als HTML oder CSS, was keine Programmiersprachen sind, und die wirklich vergleichsweise simpel sind.
Auch ich habe Programmieren nicht ein einem Monat gelernt. Das ist ein Prozess, der ständig weitergeht, bei mir auch noch nach 25 Jahren.
Aber ändern wird sich das bei Dir eben nur, wenn Du Dich auf den Hosenboden setzt und lernst :-)
 
Efchen schrieb:
Na, da glaubst Du aber falsch. Wenn Du nichtmal programmieren kannst, dann sieht es düster aus für Dich. Dann kannst Du PHP auch nicht wirklich in den Griff kriegen. Programmierung ist sehr wohl ein komplexes Kapitel, ganz anders als HTML oder CSS, was keine Programmiersprachen sind, und die wirklich vergleichsweise simpel sind.
Auch ich habe Programmieren nicht ein einem Monat gelernt. Das ist ein Prozess, der ständig weitergeht, bei mir auch noch nach 25 Jahren.
Aber ändern wird sich das bei Dir eben nur, wenn Du Dich auf den Hosenboden setzt und lernst :-)
Zum Vergrößern anklicken....

Hatte damit nicht PHP gemeint, sondern meinen Code :D Wie du ja sagtest diese zwei Sprachen CSS HTML sind sehr simpel. :)

Danke Gilles, das du dir die Mühe gemacht hast. :) Werde es auf jeden Fall heute noch versuchen es einzubauen. Bin noch in der Try&Error Phase. :)

Gruß Stenz
 
stenz schrieb:
Wie du ja sagtest diese zwei Sprachen CSS HTML sind sehr simpel.
Zum Vergrößern anklicken....
Und trotzdem verhaut sie mindestens jeder zweite.
So wie auch Du in Deinem Code lauter <div>s drin hast, ohne damit mehrere Elemente zu gruppieren. Klassischer Modefehler, als wäre <div> irgendwas besonderes, was erhöhte Aufmerksamkeit benötigt.
 
@Efchen hab es eben so gelernt das man, wenn man per CSS das Design machen will das mit <div> einfügt. Gibt es da evtll. eine geschicktere Variante. :)?

Hab den Code von Gilles bisschen angeschaut und versucht zu verstehen, wäre nett wenn ihr mich korrigieren könntet.
PHP: 
 <?php

$liste = "";

// Ich mach mal nur bis g
$listenElemente = array("a","b","c","d","e","f","g");

for($i =0; $i < count($listenElemente); $i++) {
   // letzten Buchstaben zurückgeben (gibt etwas zwischen a und z wieder)
   $buchstabe = substr($_SERVER['PHP_SELF'], -5, -4);
   // Prüfen ob Ausgewählte Seite diesen Link entspricht
   $currentSite = ($buchstabe == $listenElemente[$i]) ? "currentSite" : "site";
   $liste .= "<li class='".$currentSite."'><a href='seite_".$listenElement[$i]."'>".$listenElement[$i]."</a></li>";
}

  echo "<ul>".$liste."</ul>";
?>
$liste = ""
bedeutet, das für $liste kein Wert zugeschrieben wird.

$listenElemente = array("a","b","c","d","e","f","g");
hier wird durch array für $listenElemente mehrere Variablenamen zugewiesen (a bis g).

for($i =0; $i < count($listenElemente); $i++) {
Eine for-Schleife wird eingesetzt mit dem Startwert von $i =0, die Schleife soll beginnen zu arbeiten, falls $i kleiner ist als (a bis g) und wenn sie arbeiten tut wird $i immer mit eins erweitert.
So jetzt beginnt es bei mir bisschen zu happern. :) Aber hoffe das ich es ansatzweise verstanden habe.

$buchstabe = substr($_SERVER['PHP_SELF'], -5, -4);
$buchstabe wird der Wert substr($_SERVER['PHP_SELF'], -5, -4); zugeschrieben, aber was wird da zugeschrieben? Substr gibt doch etwas aus in diesem Fall $_SERVER['PHP_SELF', wo es bei -5 anfängt und bei -4 endet, wenn ich das bei ("a","b","c","d","e","f","g") anwenden würde, wäre doch der Wert dann "c" oder?
Was ich eben hier nicht verstehe was für eine Funktion $_SERVER['PHP_SELF' ist. :)

Würde mal gerne wissen, ob meine Überlegungen bis hierher stimmen, danach würde ich versuchen den restlichen Code zu verstehen.

Eine Frage noch, den Code von Gilles müsste ich doch dann in eine PHP-Datei speichern, wie aber muss ich dann das in meinem Code (s.o) einfügen per include? Wenn ja, da wo die Navi bei mir steht?
 
stenz schrieb:
@Efchen hab es eben so gelernt das man, wenn man per CSS das Design machen will das mit <div> einfügt. Gibt es da evtll. eine geschicktere Variante. :)?
Zum Vergrößern anklicken....
Naja, sorry, aber das hast Du prinzipiell erstmal falsch gelernt. <div> ist ein HTML-Element, mit HTML legt man die Semantik fest, und nicht das Aussehen.
Wenn Du Layout/Design mit CSS machen willst, dann nimmst Du die HTML-Elemente, die Du *vorher* festgelegt hast, und zwar aufgrund der Bedeutung Deines Inhalts.
Jedes (gültige) HTML-Tag hat eine semantische Bedeutung. Die Bedeutung von <div> ist "Gruppe mehrerer Elemente". Das heißt, wenn Du keine logische Gruppe auszeichnest und nicht mindestens 2 Elemente in dem <div> stehen, dann hast Du mit großer Wahrscheinlichkeit was falsch gemacht. Und sei es nur, dass Du Layout/Design machen willst, bevor Du den Inhalt niedergeschrieben und ausgezeichnet hast.
 
Hi,
habe heute mal den Code von Gilles eingebaut. So sieht dann die Navi aus. Hab die alte Navi nicht entfernt.
http://img684.imageshack.us/img684/879/gilles.png
Was muss ich an Gilles Code ändern, damit die Listenpunkte auch Inhalte haben und ggf. auch richtig verlinkt werden?
Wenn ich jetzt auf den die Listenpunkte klicke werde ich auf start_ verlinkt, also Error.
PHP: 
<?php

$liste =     "";

$listenElemente = array("Anasayfa","A","B","C","E","G","H");

for($i =0; $i < count($listenElemente); $i++) {
   // letzten Buchstaben zurückgeben (gibt etwas zwischen a und z wieder)
    $buchstabe = substr($_SERVER['PHP_SELF'], -5, -4);

   // Prüfen ob Ausgewählte Seite diesen Link entspricht
    $currentSite = ($buchstabe == $listenElemente[$i]) ? "currentSite" : "site";
    $liste .= "<li class='".$currentSite."'><a href='start_".$listenElement[$i]."'>".$listenElement[$i]."</a></li>";
}

  echo "<ul>".$liste."</ul>";
?>
 
So habe es gelöst, durch einen glücklichen Zufall hab ich in den Foren von HTML-Editor Phase 5 (Portal) eine ähnliche Problemstellung gefunden. :)
Ich revidiere kurz mal mein Problem für Neue die es erst jetzt lesen.
Mein Problem war es das ich für jede Seite eine neue Navigation machen musste, da ich die aktuell gewählte Seite mit "id" hervorheben wollte.
So zur Lösung. :)
Hab an dem Code nur eine Zeile geändert, in dem ursprünglichen Code wurde die aktuelle Seite nicht als Link dargestellt.

Gruß
Stenz
PHP: 
<?php
$url = array(
"index.php"=>"Anasayfa",
"start_a.php"=>"A");

echo '<ul>';
while(list($key,$val)=each($url))
         {
         echo '<li>';
         if(strstr($_SERVER['SCRIPT_NAME'],$key))
                 {
                 echo '<a href id="current">'.$val.'</a>';
                 }
         else
                 {
                 echo '<a href="'.$key.'">'.$val.'</a>';
                 }
         echo '</li>'."\n";
         }
echo '</ul>';
?>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben