Seitenhintergrund (Bild) je nach Menüpunkt ändern

[ATROXX]

Hallo,

wie und wo muss ich was "rumpfuschen"  damit ich das Hintergrundbild ändern kann?
Habe das Simple-Navigation verwendet und hätte gerne je einen anderen Hintergrund für 1. Level und 2. , 3. uws. Level Seiten.
Wäre um eine unkomplizierte, schnelle Lösung dankbar.

[NaN]

Meine Güte, das sind ja wirklich immer wieder dieselben Fragen... 
Schau mal in die Stylesheets (im Backend Layout->Stylesheets).
Dort gibt es ein Stylesheet das nur für die Navigation zuständig ist.
Da musst Du Dich mal durcharbeiten.
"ul" steht für eine Liste mit Menüpunkten. "li" für den Menüpunkt selbst. Und "a" logischerweise für den Link in diesem Menüpunkt.
Die Stylesheets sind auch recht gut kommentiert, sodass Du mit ein wenig CSS Erfahrung das Menü anpassen kannst wie Du willst.
Falls Du auf diesem Gebiet noch nicht so bewandert bist, hier findest Du einige Quellen zum nachlesen: http://forum.cmsmadesimple.org/index.ph ... 812.0.html.
Falls es dann immer noch Probleme gibt, liest man sich hier bestimmt wieder 

[ATROXX]

Ich will ja nicht den Hintergrund des Menüs ändern, sondern den der ganzen Seite bzw. nur des Inhaltsbereichs.

Link 1 , Link 2 , Link 3 => hintergrund-1.jpg

Link 1.1 , Link 1.2 , Link 1.3 , Link 2.1 usw.  -> hintergrund-2.jpg

Link 1.1.1 , Link 1.1.2 , Link 1.1.2 , Link 2.2.1 usw.  -> hintergrund-2.jpg

Naja und so weiter halt. 1st lvl = bg1.jpg / 2nd lvl = bg2.jpg / 3rd lvl=bg3.jpg





In meinem Fall hiesse das, der Hintergrund von 

soll je nach link geändert werden.

Dies ist die dazugehörige Style-Definition:
div#content {
  height: 500px;
  width: 780px;
  scrolling: auto;
  background: #ffffcc url(images/blatt.png) no-repeat 0 0px;
  font-size: 12px;
  }

Bei den Links der obersten Hierarchie (1 , 2 , 3 usw.) soll der background: #ffffcc; sein
Bei den Links der first-level Hierarchie (1.1 , 1.2 , 2.1 usw.) soll der background: #ffffcc url(images/blatt.png) no-repeat 0 0px; sein
Bei den Links der second-level Hierarchie (1.1.1 , 1.2.1 , 2.2.3 usw.) soll der background: #ffffcc url(images/Seite.png) no-repeat 200 150px; sein

Was ich suche ist ein passabler, barrierefreier Lösungsansatz (oder Gedankenanstoss), um dies umzusetzen.


*edit sagt* Besten Dank für die Links aus dem genannten Thread. Sind einzwei (allgemein) Nützliche dabei.

[cyberman]

Ist in diesem Fall nicht hganz so einfach - würde hierfür

Code: Select all

<div id="content" style="background: #ffffcc url(images/background_level{$node->hierarchy|substr:0,1}.png) no-repeat 0 0px;">

Du musst die Bilder dann nur noch in background_level1.png, und so weiter umbenennen.

[ATROXX]

Leider tut dieser schön einfache Ansatz das nicht. Ergebnis = gar kein background-image

[NaN]

Ich will ja nicht den Hintergrund des Menüs ändern, sondern den der ganzen Seite bzw. nur des Inhaltsbereichs.

Link 1 , Link 2 , Link 3 => hintergrund-1.jpg

Link 1.1 , Link 1.2 , Link 1.3 , Link 2.1 usw.  -> hintergrund-2.jpg

Link 1.1.1 , Link 1.1.2 , Link 1.1.2 , Link 2.2.1 usw.  -> hintergrund-2.jpg

Naja und so weiter halt. 1st lvl = bg1.jpg / 2nd lvl = bg2.jpg / 3rd lvl=bg3.jpg

Aha.
Dann hab ich das falsch verstanden. Sorry.
Also willst Du den Hintergrund je nachdem in welcher "Ebene" man sich befindet ändern?
Schau mal hier nach: http://forum.cmsmadesimple.org/index.ph ... 870.0.html.
Da wird sowas ähnliches zwar nur für die Header-Grafik gemacht, ließe sich aber ebenso auch für den Content verwenden.
Wenn mich nicht alles täuscht, dann liefert der Menümanager auch die nötige variable mit der Ebene der aktuellen Seite.
Da ran zu kommen ist aber nicht ganz so einfach.
Versuch mal folgendes im Template:

Code: Select all

{foreach from=$nodelist item=node}
   {if $node->id==$content_id}
      {$node->depth}
   {/if}
{/foreach}

Damit kann man sich die Ebene des aktuellen Menüpunktes ausgeben lassen. (kenne gerade keine einfachere Methode)
Wenn Du jetzt dem Inhaltsbereich mit der id="content" noch die Klasse class="level_{$node->depth}" gibst kannst Du im Stylesheet für jede Ebene den Hintergrund des Inhalts ändern.

Du müsstest das Template dann folgendermaßen ändern:

Code: Select all

<div id="content" class="level_{foreach from=$nodelist item=node}{if $node->id==$content_id}{$node->depth}{/if}{/foreach}"> 
         Inhalt
</div>

Und im Stylesheet dann für jede Ebene folgendes einfügen:

Code: Select all

#content.level_1 {background: Dein Hintergrund;}
#content.level_2 {background: ...}
#content.level_3 {background: ...}

Sag Bescheid ob's funktioniert. Habs noch nicht getestet.

[ATROXX]

Auf die Schnelle ausprobiert hats nicht funktioniert.
Ich probiers aber nacher nochmal gründlich und gucke ob ich was finde (unter zurate ziehen des genannten threads)

[NaN]

Hab gerade festgestellt, dass es nicht immer funktioniert, da in dem Array $nodelist die $content_id der aktuellen Seite komischerweise nicht immer drin steht.
Somit ist die Bedingung {if $node->id==$content_id} nicht immer erfüllt und man hat am Ende manchmal die Stylesheetklasse class="level_".

[ATROXX]

Also dieser Link bringt mich leider nicht viel weiter... =(
http://forum.cmsmadesimple.org/index.ph ... 870.0.html.

Aber sonst ne tolle Idee, die ich vielleicht am Schluss bei mir auch einbinde.

[cyberman]

OK, dann eben anders - hatte da mal was im englischen Bereich geschrieben

http://forum.cmsmadesimple.org/index.ph ... l#msg52841

[ATROXX]

Also dies funktioniert mit ein bissl Rumschlagen und Anpassen (minimalst).
Ist zwar nicht die eleganteste Lösung, weil es sich ja anhand des Pade-Alias orientiert und daher für jede Seite eine neue Grafik benötigt wird (Muss man bei eventuell späteren Seiten beachten.) , und nicht nach der Seitentiefe bzw. Hierachie orientiert, aber es funzt immerhin zuverlässig.

Ich danke jetzt schonmal allen, die sich hier beteiligt haben und mit Lösungsansätzen oder Ideen dazu beigetragen haben.
Wenn sich hier natürlich noch etwas bessere oder völlig andere Lösungsansätze finden lassen, werde ich da sein und auch diese weiterverfolgen.

[cyberman]

daher für jede Seite eine neue Grafik benötigt wird

Nur für jeden Parent - war es nicht das, was du wolltest?