Anpassungsproblem mit der Navigation

[Roentgen]

Hallo Zusammen,

Ich habe seit einiger Zeit folgendes Problem:

Ich mir Contenido mir die Version 4.4.5-r1 gesaugt. Bei dieser Version ist standardmäßig ein Template dabei. Dieses habe ich verändert wie man es unter http://www.waldorftalk.de/lsrnrw/cms/ sehen kann. Jetzt habe ich mich dran gesetzt und wollte die Navigation anpassen. Ich habe dazu die Templates aus dem Order "cms/templates" genommen. Doch bei jedem Hochladen hat er die Navigation fehlerhaft angezeigt.

Gewollt ist, das der Hintergrund der Navigation weis ist wenn der jeweilige Punkt ausgewählt wird grau ist. Das habe ich mehr oder weniger auch schon hinbekommen, aber nur durch Farben. Ich würde den Hintergrund gerne durch Bilder definieren!

Ich hoffe das mir jemand bei meinem Problem helfen kann.

MfG Jonas Röntgen

[mvf]

4.4.5 ?? da kann ich nicht viel zu sagen weil ich auch recht neu bin

wenn ich es aber recht verstehe, dann wird in der 4.6.2 das mit 3 templates pro ebene gehandhabt, _on _off _open

wenn man da hinien schaut stösst man auf die verwendeten css klassen

und um ein bg pic einzufügen:

Code: Alles auswählen

	background: url("../upload/bilder/xxx.jpg") no-repeat top right;

das bild xxx wird dann nur einmal oben rechts angezeigt, mehr dazu in der selfhtml

[Halchteranerin]

Doch bei jedem Hochladen hat er die Navigation fehlerhaft angezeigt.

Was heisst das genau? Wie sehen deine Template-Dateien aus?

[Halchteranerin]

4.4.5 ?? da kann ich nicht viel zu sagen weil ich auch recht neu bin

Oh Gott, muss ich mich jetzt alt fuehlen, weil ich teilweise noch die Version 4.4.4 im Einsatz habe?

[Roentgen]

Hallo Halchteranerin,
meinst Du den Quellcode, wenn ja, sieht der folgendermaßen aus:

navfirst_on.html

<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FCF2D5; padding-left:10px">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

navfirst_off.html

<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FFFFFF; padding-left:10px">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

navsecond_on.html

<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FCF2D5; padding-left:20px">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

navsecond_off.html

<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FFFFFF; padding-left:20px">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

navthird_on.html

<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FCF2D5; padding-left:30px">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

navthird_off.html

<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FFFFFF; padding-left:30px">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

Und jetzt sollen die Linien zwischen den Navigationsteilen grau sein und den "unangeklickten" Punkte als Hintergrund ein Bild namens "white.gif" haben und die "angeklickten" Punkte ein Bild namens "gray.gif".

Vielen Dank im Voraus für die Antworten!

MfG Jonas Röntgen

[mvf]

die bilder kannst du wie oben beschrieben einfügen mit

Code: Alles auswählen

background: url("../upload/bilder/xxx.jpg") no-repeat top right;

allerdings geht das meines erachtens nicht wenn man dies direkt über

Code: Alles auswählen

style="background: url("../upload/bilder/xxx.jpg") no-repeat top right;"

definiert es muss IMHO in der css stehen also klasse definieren und all deine styleangaben dort deponieren und nicht direkt im template

[Roentgen]

Hallo MVF,

Leider ist es so wie du es vorherprophezeit hast! Unter: http://www.waldorftalk.de/lsrnrw/cms/fr ... hp?idcat=3 kann man nun den Hintergrund im Template sehen aber leider nicht den Hintergrund der Navigation.

Kannst Du mir sagen, was ich im CSS-File und jeweiligen Template angeben muss, das er mir den Hintergrund aus dem Navigations-Templates anzeigt?

Gruß Jonas Röntgen

[Halchteranerin]

Du hast nicht geantwortet, was mit "Navigation fehlerhaft angezeigt" gemeint war.

Kannst Du mir sagen, was ich im CSS-File und jeweiligen Template angeben muss, das er mir den Hintergrund aus dem Navigations-Templates anzeigt?

Du musst in den Templates eine Klasse angeben, die du in der css-Datei mit den gewuenschten Angaben, z.B. Hintergrundbild, formatierst. Z.B. so etwas:

Code: Alles auswählen

<!-- BEGIN:BLOCK -->
    <li class="hauptnavi"><a href="{HREF}" class="e1p">{NAME} </a></li>
<!-- END:BLOCK -->

Das ist jetzt mein Template fuer die erste Ebene, wobei ich aber eine tabellenlose Navi benutze. Aber so aehnlich musst du bei dir auch die Klasse angeben und diese dann in der css-Datei definieren.

[mvf]

weiss ned ob ich dich recht verstehe

Code: Alles auswählen

navfirst_on.html
<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FCF2D5; padding-left:10px">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK --> 

sollte dann

Code: Alles auswählen

navfirst_on.html
<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" class="yrclass">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK --> 

und in der css dann

Code: Alles auswählen

.yrclass {
                  border: 0px; 
                  border-bottom:1px; 
                  border-color: #F7C473; 
                  border-style: dashed; 
                  background: url("../upload/bilder/xxx.jpg") no-repeat top right;          
                  padding-left:10px;

}

aber wie gesagt dass steht noch viel genauer hier: http://de.selfhtml.org/css/index.htm

[Roentgen]

Hallo MVF,

ich glaube da liegst du ganz richtig! Ich habe es jetzt noch nciht ausprobiert weil sich noch eine Frage stellt. Diese ist, ob ich für jedes Template am Besten einen eigene Klasse in der CSS eingebe?

MfG Jonas Röntgen

[Halchteranerin]

musst du wohl, weil sich der padding-left-Wert bei den verschiedenen Ebenen unterscheidet.

[Roentgen]

Hallo,

die Einträge in meinem CSS File sehen wir folgt aus:

.navfirston {
border: 0px;
border-bottom:1px;
border-color: #808080;
border-style: dashed;
background: url("gray.gif") no-repeat top right;
padding-left:10px;
}

.navfirstoff {
border: 0px;
border-bottom:1px;
border-color: #808080;
border-style: dashed;
background: url("white.gif") no-repeat top right;
padding-left:10px;
}

.navsecondon {
border: 0px;
border-bottom:1px;
border-color: #808080;
border-style: dashed;
background: url("gray.gif") no-repeat top right;
padding-left:20px;
}

.navsecondoff {
border: 0px;
border-bottom:1px;
border-color: #808080;
border-style: dashed;
background: url("white") no-repeat top right;
padding-left:20px;
}

.navthirdon {
border: 0px;
border-bottom:1px;
border-color: #808080;
border-style: dashed;
background: url("gray.gif") no-repeat top right;
padding-left:30px;
}

.navthirdoff {
border: 0px;
border-bottom:1px;
border-color: #808080;
border-style: dashed;
background: url("white.gif") no-repeat top right;
padding-left:30px;
}

Der Text in den jeweiligen Seiten ist wie gesagt:

navifirst_on.html

<!-- BEGIN:BLOCK -->
<tr><td width="165" colspan="2" height="22" class="navfirston">
<a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

Aber das scheint immer noch nicht zu funktionieren!

MfG Jonas Röntgen

[mvf]

schau dir mal die pfade zu den images im css an

wenn du die images mit contenido hochgeladen hast, dann musst du auch den relativen pfad angeben

wir befinden uns in der front_content.php beim aufruf, das heisst du musst auch den pfad relativ dazu angeben.

liegen die bilder in cms/upload/bilder dann muss es z.b. heissen

Code: Alles auswählen

.navfirston {
border: 0px;
border-bottom:1px;
border-color: #808080;
border-style: dashed;
background: url("upload/bilder/gray.gif") no-repeat top right;
padding-left:10px;
} 

[Roentgen]

Hallo Guido,

im Grunde liegen die Bilder zwei mal auf dem Server. Einmal im Order "CMS" und einmal unter "CMS/Images".

Groß Jonas

[Halchteranerin]

was genau funktioniert jetzt nicht?