Unterschiedliche Hintergrundbilder pro Seite

**Michael V83** · 26.11.2007, 08:32

Hi !

wie bekomme ich das hin, das ich pro seite oder pro "knotenpunkt" unterschiedliche hintergrundbilder angezeigt werden.
mit der extension "rf_dynamiccss" und das ADDON wiederrum dazu, bekomm ich das irgendwie nicht hin.
müsste doch ne leichte möglichkeit dazu geben oder ?
mh evtl stimmen bei mir auch einfach die pfadangaben nicht.

was ich auch noch ausprobiert habe:
css Datei erstellt mit neuem Hintergrundbildanweisung.
+ext also eine externes template für ein spezielle Seite erstellt
dort in der setupbereich:

page.stylesheet = fileadmin/meinecssdatei.css

so klappts schon mal nicht

bitte um antwort. tausend danke im vorraus !!!

**Wool** · 26.11.2007, 12:02

Ein Beispiel:

im Template-File:

Code:

<div style="background-image:url('fileadmin/pfad/###HINTERGRUND###.jpg');">
  <!-- inhalt der Seite -->
</div>

in den Constants:

Code:

[PIDinRootline = erste_seiten_ID]
  mySeite = home
[PIDinRootline = zweite_seiten_ID]
  mySeite = impressum
[etc...]
  etct...
[global]

und dann im Setup den Marker:

Code:

  HINTERGRUND = TEXT
  HINTERGRUND.value = {$mySeite}

**Michael V83** · 27.11.2007, 07:29

Also , ich benutze yaml.
Und versuche dein Antwort mal umzusetzen.
Ich möchte in meiner dritten spalte #col3 jeweils das Hintergrundbild auswechseln.
Ich wollte also die template-html-vorlage nicht anrühren, somit bleibt mir nur noch css.

hab jetzt in "meiner css-file"
bei
#col3 {
....
background-image:url('fileadmin/css/images/###HINTERGRUND###.jpg');
...
}

geschrieben,
###HINTERGRUND###.jpg soll bestimmt pro seite immer bestimmt werden.

Also hab ich jetzt im Template der Rootsite das mit den PIDs (testhalber nur die beiden Seiten).

[PIDinRootline = 2]
mySeite = Home
[PIDinRootline = 208]
mySeite = Produkte

und den Marker-Code hab ich auch eingegeben.
Wo muss jetzt die Zuweisung für den jeweiligen Hintergrund ?

meine css file wird als letztes eingebunden ... und überschreibt also andere usw. .

weitere Anweisungen bitte Idiotensicher ;-)

**Wool** · 27.11.2007, 09:12

aha... also mit Yaml kenn ich mich jetzt nicht so ganz so gut aus... aber das mit dem Marker im CSS funktioniert so nicht. Der Marker wird im Template-File ersetzt.

wenn du das Template-File nicht ändern willst dann bleibt, denke ich, nur noch die Möglichkeit das CSS je nach Seite einzubinden... d.h. setze eine class im CSS für deinen HEADER (für Standard) und mach für jede seite ein eigenes CSS-File in das du dann nur diese class schreibst (damit überschreibst du dann die bestehende Standard-Class), das du dann für jede Seite eigens lädst... ob und inwieweit das dann Cache-Probleme mit sich führt weiß ich natürlich jetzt nicht genau...

MfG
Wool

**Kurt51** · 27.11.2007, 09:36

Zitat von Michael V83

Hi !

wie bekomme ich das hin, das ich pro seite oder pro "knotenpunkt" unterschiedliche hintergrundbilder angezeigt werden.
mit der extension "rf_dynamiccss" und das ADDON wiederrum dazu, bekomm ich das irgendwie nicht hin.
müsste doch ne leichte möglichkeit dazu geben oder ?
mh evtl stimmen bei mir auch einfach die pfadangaben nicht.

was ich auch noch ausprobiert habe:
css Datei erstellt mit neuem Hintergrundbildanweisung.
+ext also eine externes template für ein spezielle Seite erstellt
dort in der setupbereich:

page.stylesheet = fileadmin/meinecssdatei.css

so klappts schon mal nicht

bitte um antwort. tausend danke im vorraus !!!

Doch, so ähnlich aber!
Du darfst nur nicht "page.stylesheet = fileadmin/meinecssdatei.css" in das +ext-Template hinein schreiben sondern:
page.includeCSS.file10 = fileadmin/css/cssxyz.css
page.includeCSS.file10.screen = media

Im Haupttemplate nimmst Du:
page.includeCSS.file1 = fileadmin/css/standard.css
page.includeCSS.file1.screen = media

Und dieses ...file10... überschreibst Du bei jedem "Knoten" und das enthält dann immer den Container mit dem anderen "background: white url(...) ..."

**Michael V83** · 27.11.2007, 11:33

Hi,

danke für euere Antworten, aber ich bin unfähig.
Bekomms irgendwie nicht hin.

Also:

im +ext Produkte für die Seite "Produkte" (ID=208)
hab ich jetzt reingeschrieben (im Setup-Bereich)
fghh Die Hintergrund1.css:

HTML-Code:

@media all
{

#page_margins {
background:#fff; 
min-width: 740px; max-width: 80em; 
margin: 0 auto; 
} 
#page{ background: #fff; 
border: 1px #667 solid; }

   #col3 {
   background: #ffffff; 
   background-image:  url(images/MVTLOGOalt.gif); 
   background-repeat: no-repeat; 
   background-position: bottom right; 
   min-height: 800px;
   
   }
  #col3_content {
  background: transparent;
  min-height: 1px;
  }
}

(extra mehr als nur die Background-Anweisung, weil ich ggf. noch mehr Änderungen als nur das Hintergrundbild ändern wollte)

Die Hintergrund2.css (Inhalt so wie oben nur anderes Bild:sad:

HTML-Code:

@media all
{

#page_margins {
background:#fff; 
min-width: 740px; max-width: 80em; 
margin: 0 auto; 
} 
#page{ background: #fff; 
border: 1px #667 solid; }

   #col3 {
   background: #ffffff; 
   background-image:  url(images/Hintergrundbild3.jpg); 
   background-repeat: no-repeat; 
   background-position: bottom right; 
   min-height: 800px;
   
   }
  #col3_content {
  background: transparent;
  min-height: 1px;
  }
}

In der Rootseite dann auf Template hab ich im Setupbereich (nicht im Constants)

page.includeCSS.file1 = fileadmin/css/Hintergrund2.css

page.includeCSS.file1.screen = media

was genau macht die letzte anweisung ?
mano man schwere geburt ;-) .

**Kurt51** · 27.11.2007, 11:58

gib doch mal einen Link zu dieser Seite an, dass man sich das mal anscheuen kann im Quelltext!

**Michael V83** · 27.11.2007, 12:30

sorry noch alles lokal ....
wollte es auch erst online stellen, wenns soweit ready ist.

wenn fragen hast , ich sag dir alles ;-).

Nachtrag im Quelltext auf der Seite Produkte (ID208 das von oben) einzusehen bei (Ansicht-Quelltextanzeigen) steht jetzt u.a.:

Hintergrund1.css und Hintergrund2.css stehen vor myOwnStyles im Quelltext

<link rel="stylesheet" type="text/css" href="typo3temp/stylesheet_e0e5d20748.css" />
<link rel="stylesheet" type="text/css" href="fileadmin/css/Hintergrund2.css" />
<link rel="stylesheet" type="text/css" href="fileadmin/css/Hintergrund1.css" />
<link rel="stylesheet" type="text/css" href="fileadmin/css/myOwnStyles.css" />
<link href="fileadmin/css/03_layouts_3col/css/layout_1-3-2.css" rel="stylesheet" type="text/css" />

in my OwnStyles stehen jetzt keine Background-Anweisungen mehr für Col3 und er nimmt die aus layout_1-3-2-css

Wahrscheinlich normal ? mh sowies jetzt steht, kann ja nicht klappen, aber ich hab kein Plan

**zefix** · 27.11.2007, 13:29

Hi,

mach es doch so:
In deinem YAML-Template wo col3 definiert wird:

Dann definierst du das in deinem Setup:

fghh

Und nun musst du nur noch an jedem Knotenpunkt deiner Seite in den erweiterten Seiteneinstellungen eine Datei hochladen (unter Dateien - siehe Screenshot).

Nachdem der Screenshot irgendwie nicht geht:

Damit wird im Verzeichnisbaum jeweils das nächstgelegene Bild in der Hierarchie eingebunden.

**Michael V83** · 29.11.2007, 07:17

hi !
naja weit weg kann ich jetzt nicht sein ... glaub ich.
aber es klappt immer noch nicht.
html template geändert von yaml.
dann festgestellt das es noch nicht übernommen wurde.
update map gemacht , eigentlich dort nur nochmal gespeichert.
siehe da das neue html template ist übernommen worden (im quelltext ist jetzt auch der marker).
anschließend auf rootseite template dort im setup-bereich deinen quelltext eingefügt - gespeichtert.
anschließend auf home , produkte und eine unterseite , typ von standard auf erweitert geändert (denke das meinstet du ?) . somit konnte ich jetzt ein bild der seite zuordnen, das gemacht und gespeichert.

doch es funzt nicht.

im Quelltext im Browser sieht das nun so aus:

HTML-Code:

<div id="col3" style="background-image:url('###HINTERGRUND###')">
                <div id="col3_content" class="clearfix">
                    <div class="floatbox"><!--TYPO3SEARCH_begin-->

was hab ich jetzt falsch verstanden ? man das das nicht einfach klappt :-(