Links der aktiven Seite hervorheben

[Jen]

Hallo Leute,

meine Seite ist mit einem Css-Layout via Include-Dateien aufgebaut.
Ich hätte jetzt gerne das der Link der jeweils aktiven Seite hervorgehoben wird.
Vor kurzen hab ich erst folgenden Tipp bekommen:

Navigation:

  
<ol id="menu">  
<?php  
  if ($thisPage=="home")  
    echo "<li>Home</li>";  
  else  
    echo "<li><a href=\"index.php?verweis=home\">Home</a></li>";  
  
  if ($thisPage=="seite1")  
    echo "<li>Seite 1</li>";  
  else  
    echo "<li><a href=\"index.php?verweis=seite1\">Seite 1</a></li>";  
?>  
</ol>  

Home.txt:

  
<?php $thisPage="home"; ?>  
<div  id="menue">  
HOME  
</div>  

In meiner css-datei ist dann mit #menu lo {} angegeben, wie der Link der aktiven Seite aussehen soll.

Das ganze funktioniert aber irgendwie nicht richtig. Ich glaube es liegt daran, das der Inhalt der Variable $thisPage in einer anderen Datei liegt, z. B. home.txt.

Kannn ich irgendwie angeben, das er die Variable in dieser Datei sucht? Wenn ja, wie?

Ich hoffe man versteht was ich meine und ihr könnt mir irgendwie weiterhelfen.

Vielen Dank

Jen

[suit]

Ich hoffe man versteht was ich meine und ihr könnt mir irgendwie weiterhelfen.

du willst #menu ol li und #menu ol li a unterschiedlich gestalten, sofern der php-interpreter in meinem gehirn richtig funktioniert

sollte das nicht der fall sein, poste bitte fertig generiertes html - php ist in diesem fall nicht not wendig

der aktive link (bitte zwischen "active" und "current" unterscheiden, die css-pseudo-klasse :active hilft dir in dem fall nicht weiter, solltest du es mit der versucht haben) ist in deinem fall kein link sondern ein nicht verlinkter eintrag im menü und somit unterscheidbar

[Jen]

du willst #menu ol li und #menu ol li a unterschiedlich gestalten, sofern der php-interpreter in meinem gehirn richtig funktioniert

Oh nein, da hatte ich wohl in meinem Code was vergessen.
Es liegt auf jeden Fall bei der IF-Anweisung.

Also nochmal diesmal ohne css:
Wenn z.B. der Wert der Variable = home ist so soll in meiner Navigation Home fett markiert werden. Ist die Seite nicht aktiv so soll der Link gnaz normal da stehn (also der Else-Fall).
Mein Problem ist glaube ich, das der zu suchende Wert, also der Inhalt von $thisPage in einer anderen Datei lieget (z.B. home.txt oder seite1.txt)

  
<ol>  
<?php  
  if ($thisPage=="home")  
    echo "<li><b>Home<b></li>";  
  else  
    echo "<li><a href=\"index.php?verweis=home\">Home</a></li>";  
  
  if ($thisPage=="seite1")  
    echo "<li><b>Seite 1<b></li>";  
  else  
    echo "<li><a href=\"index.php?verweis=seite1\">Seite 1</a></li>";  
?>  
</ol>

der aktive link (bitte zwischen "active" und "current" unterscheiden, die css-pseudo-klasse :active hilft dir in dem fall nicht weiter, solltest du es mit der versucht haben) ist in deinem fall kein link sondern ein nicht verlinkter eintrag im menü und somit unterscheidbar

Das mit active hab ich schon versucht. Aber das ist ja nur beim drüber fahren mit der Maus!

[Tom]

Hello,

ich würde das anders machen.
Dein Script hat doch bestimmt einen script-lokalen CSS-Bereich, den es mit ausgibt, oder?

Und jeder Link hat entweder einen Namen oder eine ID oder sonst etwas, was in allen aktuellen Browsern als CSS-unterscheidungsfähiges Kriterim gilt.

Nehmen wir eine Eindeutige ID für jeden Link des Menus, für unseren Aktiven die ID="page27".
Dann brauchst Du nur in deinem generierten CSS für diesen Link die besondere Farbe einzuusetzen

Lass dieses Stück CSS mit ausgeben.

#page27
   {
       color:#red;
       font-weight:bold;
   }

Die Pseudo-Klassen für Links sind hier i.d.R. nicht zu gebrauchen, da die Seite bei dynamischen Ausgaben jedes Mal _neu_ aufgebaut wird.

Liebe Grüße aus Syburg bei Dortmund

Tom vom Berg

[jen]

ich würde das anders machen.
Dein Script hat doch bestimmt einen script-lokalen CSS-Bereich, den es mit ausgibt, oder?

Ja

Und jeder Link hat entweder einen Namen oder eine ID oder sonst etwas, was in allen aktuellen Browsern als CSS-unterscheidungsfähiges Kriterim gilt.

Nehmen wir eine Eindeutige ID für jeden Link des Menus, für unseren Aktiven die ID="page27".
Dann brauchst Du nur in deinem generierten CSS für diesen Link die besondere Farbe einzuusetzen

Lass dieses Stück CSS mit ausgeben.

#page27
   {
       color:#red;
       font-weight:bold;
   }

Soweit klar, denke ich. Aber ich glaub damit kann ich ja nur die Links unterschiedlich formatieren. Oder?

Ich will das meine Links nur hervorgehoben (z. B. fett markiert) werden, wenn ich mich auf der dazugehörigen aktuellen Seite befinde.

Oder hab ich dich da falsch verstanden?

[Tom]

Hello,

#page27
   {
       color:#red;
       font-weight:bold;
   }
Oder hab ich dich da falsch verstanden?

Seite 2 gibt aus:

#page2
   {
       color:#red;
       font-weight:bold;
   }

Seite 14 gibt aus:

#page14
   {
       color:#red;
       font-weight:bold;
   }

Alle Seiten geben aus:

<ul>
       <li id="page1">link zur seite 1</li>
       <li id="page2">link zur seite 2</li>
       <li id="page3">link zur seite 3</li>

...

</ul>

Das muss jetzt noch nicht wirklich passen. Ob <a> von seinem umhüllenden <li> etwas erbt. musst Du bitte mal selber ausprobieren. Sonst musst Du eben die <a>-Elemente mit den zugehörigen IDs versehen, oder aber einen Nachfahren-Selector benutzen

Liebe Grüße aus Syburg bei Dortmund

Tom vom Berg

[jen]

Hello,

#page27
   {
       color:#red;
       font-weight:bold;
   }
Oder hab ich dich da falsch verstanden?

Seite 2 gibt aus:

#page2
   {
       color:#red;
       font-weight:bold;
   }

Seite 14 gibt aus:

#page14
   {
       color:#red;
       font-weight:bold;
   }

Alle Seiten geben aus:

<ul>
       <li id="page1">link zur seite 1</li>
       <li id="page2">link zur seite 2</li>
       <li id="page3">link zur seite 3</li>

...

</ul>

Das muss jetzt noch nicht wirklich passen. Ob <a> von seinem umhüllenden <li> etwas erbt. musst Du bitte mal selber ausprobieren. Sonst musst Du eben die <a>-Elemente mit den zugehörigen IDs versehen, oder aber einen Nachfahren-Selector benutzen

Aber ich will ja nicht die verschiedenen Links unterschiedlich gestalten, sondern den der gerade aktiv ist hervorheben

[Tom]

Hello,

Aber ich will ja nicht die verschiedenen Links unterschiedlich gestalten, sondern den der gerade aktiv ist hervorheben

Hast Du es denn ausprobiert?

Welchen PHP-Code müsstest Du denn schreiben, damit Seite 333 dieses CSS mit ausgibt?

#page333
    {
        color:#red;
        font-weight:bold;
    }

Und was müsstest Du tun, damit Dein Menu von allen Seiten in gleicher Form ausgegeben wird:

<ul>
        <li id="page1">link zur seite 1</li>
        <li id="page2">link zur seite 2</li>
        <li id="page3">link zur seite 3</li>

...
        <li id="page333">link zur seite 333</li>
    </ul>

Könntest Du Dir einen PHP-Code vorstellen, der eine deratige Ausgabe aud einer Datei oder einem Array heraus produziert?

Liebe Grüße aus Syburg bei Dortmund

Tom vom Berg

[Malcolm Beck´s]

hi,

Welchen PHP-Code müsstest Du denn schreiben, damit Seite 333 dieses CSS mit ausgibt?

#page333
    {
        color:#red;
        font-weight:bold;
    }

Das ist ja soweit schön und gut, aber so müsste in jede einzelne Seite ein stück CSS hingekritzelt werden.
Besser ist, jedem body eine eigene ID

<body id="startseite"> <!-- Mit Klassen funzt[TM] es nicht im IE -->  
oder  
<body id="seiteZwei">

der Link dazu heisst dann

  
<ul>  
  <li><a id="startseite_link" href="#">Index</a></li>  
  <li><a id="seiteZwei_link" href="#">Index</a></li>  
</ul>

Dann kann man über CSS wunderbar formatieren,

body#startseite a#startseite_link,  
body#seiteZwei a#seiteZwei_link {  
  font:bold 115% Wingdings;  
}

Und so kann man das für alle Seiten des Projektes machen, das gute ist, mit der bodyID kann man jeder Seite noch andere Styles zuweisen, die nur auf der betreffenden Seite greift.

holla holla

[Tom]

Hello,

Das ist ja soweit schön und gut, aber so müsste in jede einzelne Seite ein stück CSS hingekritzelt werden.
Besser ist, jedem body eine eigene ID

Deine Methode ist zwar elegant, macht aber das CSS nachher sehr langsam, weil es sehr groß wird.
Jeder Link benötigt so eine normale Formatierung und diejenige für den Fall, dass er in der aktiven Seite liegt, die die narmale dann wieder überschreibt.

Deshalb bevorzuge ich an dieser Stelle die Hammermethode...
Nicht mehr CSS als notwendig.

Liebe Grüße aus Syburg bei Dortmund

Tom vom Berg

[Malcolm Beck´s]

hi,

Deine Methode ist zwar elegant, macht aber das CSS nachher sehr langsam, weil es sehr groß wird.

Naja, ich hab auf meiner Aktuellen Seite knappe 500 Zeilen, 100 Zeilen mehr würde aber auch nicht schaden denke ich.

Deshalb bevorzuge ich an dieser Stelle die Hammermethode...

Da muss man aber wieder für jede Seite das CSS generieren, also wenigstens eine Funktion, die das erledigt.
Diese Funktion müsste in jeder Seite aufgerufen werden und der Funktion muss dann noch jedesmal ein Wert übergeben werden, damit PHP weiss, wo es gerade ist ...
Nee, viel zu Umständlich.

Nicht mehr CSS als notwendig.

Daher hatte ich ja ein bsp. gepostet, wie man das ganze zusammenfassen kann ;

body#startseite a#startseite_link,  
body#seiteZwei a#seiteZwei_link,  
body#seiteDrei a#seiteDrei_link {  
  font:bold 115% Wingdings;  
  border: 15px solid #F00  
}

Besser ist natürlich, einfach den Link der Aktuellen Seite entlinken, dann hat man gar kein gefuchtel damit.

holla holla

[Ingo Turski]

Hi,

Also nochmal diesmal ohne css:

besser wäre ohne PHP, d.h. den generierten HTML-Code.

echo "<li><b>Home<b></li>";

praktisch, dass Du jetzt ein zusätzliches Element einsetzt - ich würde allerdings em bevorzugen.

Das mit active hab ich schon versucht. Aber das ist ja nur beim drüber fahren mit der Maus!

nö, Du verwechselst das mit :hover.

Aber zurück zu Deinem Problem:
<?php $thisPage="home"; ?> wird erst wirksam, nachdem die Datei includiert wurde.
Aber was soll das Ganze, wenn nachfolgend nur:

<div  id="menue">  
HOME  
</div>

in dieser Datei steht?

Du solltest Dir besser ein sinnvolles Script zur Generierun der Navigation schreiben.

freundliche Grüße
Ingo

[jen]

Also nochmal diesmal ohne css:
besser wäre ohne PHP, d.h. den generierten HTML-Code.

echo "<li><b>Home<b></li>";
praktisch, dass Du jetzt ein zusätzliches Element einsetzt - ich würde allerdings em bevorzugen.

Das war nur ein Beispiel um zu verdeutlichen das es mir nur um die IF-Anweisung geht. Normalerweise wird dies mit CSS gemacht.

Das mit active hab ich schon versucht. Aber das ist ja nur beim drüber fahren mit der Maus!
nö, Du verwechselst das mit :hover.

Sorry hab ich wohl wirklich verwechselt. Aber auch :active bewirkt nicht das, was ich wirklich will. :active wir nur aktiv so lange man mit der Maus den Link bedrückt hällt. Ich bitte um belehrung, wenn ich immernoch falsch liegen sollte. Bei mir wirkt es sich jedenfalls so aus.

Aber zurück zu Deinem Problem:
<?php $thisPage="home"; ?> wird erst wirksam, nachdem die Datei includiert wurde.
Aber was soll das Ganze, wenn nachfolgend nur:

<div  id="menue">

HOME
</div>

> in dieser Datei steht?  
  
Das mit dem Div habbst du dir auch wegdenken. Was das id="menue" soll ist einfach nur die Formatierung des Inhaltes der Seite home.txt  

[vaudi]

Hallöchen,

Also nochmal diesmal ohne css:
Wenn z.B. der Wert der Variable = home ist so soll in meiner Navigation Home fett markiert werden. Ist die Seite nicht aktiv so soll der Link gnaz normal da stehn (also der Else-Fall).
Mein Problem ist glaube ich, das der zu suchende Wert, also der Inhalt von $thisPage in einer anderen Datei lieget (z.B. home.txt oder seite1.txt)

Dann musst du die Definition eben vor die Erzeugung der Navigation verlegen:

  
// Definition für die einzelnen Dateien. Hat auch noch den Vorteil, dass ein manipulierter GET-Parameter abgefangen werden kann  
$dateien = array(  
  array('verweis'=>'home',   'linktext'=>'Home',    'datei'=>'home.txt');  
  array('verweis'=>'seite1', 'linktext'=>'Seite 1', 'datei'=>'seite1.txt');  
  array('verweis'=>'seite2', 'linktext'=>'Seite 2', 'datei'=>'seite2.txt');  
  // Navigation erweitern: neue Zeile  
  // Links anpassen, Linktext anpassen: auch hier  
);  
  
  
<ol><?php  
foreach($dateien as $v) {  
  if($v['ident'] == $_GET['verweis']) {  
     echo '<li><span id="aktiveSeite">'.$v['linktext'].'</span></li>';  
     $includeDatei=$v['datei'];  // diese Variable verwendest du später für den Include  
  }  
  else  
     echo '<li><a href="index.php?verweis='.$v['verweis'].'">'.$v['linktext'].'</a></li>';  
}  
?></ol>  
  
if(!strlen($includeDatei)) {  
  // Fehlerbehandlung, tritt nur bei ungültigem GET-Parameter auf...  
}  

Mit css formatierst du dann über den Selektor #aktiveSeite das Aussehen des Navigationseintrags für die aktive Seite.

MfG
vaudi

[vaudi]

Hallöchen,

... ups, Schreibfehler :(

Die if-Bedingung muss natürlich so lauten:

  
   if($v['verweis'] == $_GET['verweis']) {  

MfG
vaudi

[jen]

Hallöchen,

Also nochmal diesmal ohne css:
Wenn z.B. der Wert der Variable = home ist so soll in meiner Navigation Home fett markiert werden. Ist die Seite nicht aktiv so soll der Link gnaz normal da stehn (also der Else-Fall).
Mein Problem ist glaube ich, das der zu suchende Wert, also der Inhalt von $thisPage in einer anderen Datei lieget (z.B. home.txt oder seite1.txt)

Dann musst du die Definition eben vor die Erzeugung der Navigation verlegen:

// Definition für die einzelnen Dateien. Hat auch noch den Vorteil, dass ein manipulierter GET-Parameter abgefangen werden kann
$dateien = array(
  array('verweis'=>'home',   'linktext'=>'Home',    'datei'=>'home.txt');
  array('verweis'=>'seite1', 'linktext'=>'Seite 1', 'datei'=>'seite1.txt');
  array('verweis'=>'seite2', 'linktext'=>'Seite 2', 'datei'=>'seite2.txt');
  // Navigation erweitern: neue Zeile
  // Links anpassen, Linktext anpassen: auch hier
);

<ol><?php
foreach($dateien as $v) {
  if($v['ident'] == $_GET['verweis']) {
     echo '<li><span id="aktiveSeite">'.$v['linktext'].'</span></li>';
     $includeDatei=$v['datei'];  // diese Variable verwendest du später für den Include
  }
  else
     echo '<li><a href="index.php?verweis='.$v['verweis'].'">'.$v['linktext'].'</a></li>';
}
?></ol>

if(!strlen($includeDatei)) {
  // Fehlerbehandlung, tritt nur bei ungültigem GET-Parameter auf...
}

>   
> Mit css formatierst du dann über den Selektor #aktiveSeite das Aussehen des Navigationseintrags für die aktive Seite.  
>   
  
vielen Dank, liest sich echt gut. Aber leider funktioniert das bei mir nicht. Ich bekomme angezeigt, das ich in dieser Zeile `array('verweis'=>'home',   'linktext'=>'Home',    'datei'=>'home.txt');`{:.language-php} einen Fehler hätte.

[vaudi]

Hallöchen,

vielen Dank, liest sich echt gut. Aber leider funktioniert das bei mir nicht. Ich bekomme angezeigt, das ich in dieser Zeile array('verweis'=>'home', 'linktext'=>'Home', 'datei'=>'home.txt'); einen Fehler hätte.

... der dich auf einen Syntax-Feher hinweisen dürfte, nämlich dass nach der schließenden Klammer ein Komma statt ein Semikolon stehen muss ...

if(copy+paste && schreibfehler)
  php-Parser_meckert

MfG
vaudi

[dedlfix]

echo $begrüßung;

Kannn ich irgendwie angeben, das er die Variable in dieser Datei sucht? Wenn ja, wie?

Es gibt letztlich nur einen Code, auch wenn du ihn per include/require aus mehreren Dateien zusmmenstückelst. Du musst dir vorstellen, dass im Hauptscript an der Stelle der include/Require-Anweisung der zu inkludierende Code eingefügt wird. Variablen werden auch nicht gesucht, sondern in der Reihenfolge der Abarbeitung des Codes behandelt. Möchtest du an einer bestimmten Stelle auf eine Variable zugreifen, musst du dafür sorgen, dass im vorher abgearbeiteten Code die gewünschte Zuweisung erfolgt.

echo "$verabschiedung $name";

[jen]

echo $begrüßung;

Kannn ich irgendwie angeben, das er die Variable in dieser Datei sucht? Wenn ja, wie?

Es gibt letztlich nur einen Code, auch wenn du ihn per include/require aus mehreren Dateien zusmmenstückelst. Du musst dir vorstellen, dass im Hauptscript an der Stelle der include/Require-Anweisung der zu inkludierende Code eingefügt wird. Variablen werden auch nicht gesucht, sondern in der Reihenfolge der Abarbeitung des Codes behandelt. Möchtest du an einer bestimmten Stelle auf eine Variable zugreifen, musst du dafür sorgen, dass im vorher abgearbeiteten Code die gewünschte Zuweisung erfolgt.

echo "$verabschiedung $name";

Ich gebe doch auf der Seite home.txt an, das der Variable $thispage der Wert home zugewiesen wird.

<?php $thisPage="home"; ?>

Und in der If-Anweisung wird doch Abgefragt, ob der Wert der Variablen $thispage= home ist. Was mache ich falsch????

[dedlfix]

echo $begrüßung;

Ich gebe doch auf der Seite home.txt an, das der Variable $thispage der Wert home zugewiesen wird.
<?php $thisPage="home"; ?>
Und in der If-Anweisung wird doch Abgefragt, ob der Wert der Variablen $thispage= home ist. Was mache ich falsch????

Es geht aus deiner Schilderung nicht hervor, wann was passiert. Möglicherweise hast du eine falsche Reihenfolge.

echo "$verabschiedung $name";