Zum Inhalt springen

Bilder nur als Image ausgeben

Erstellt am 18. Januar 2011 · 1 Antwort · letzte Antwort am 18. Januar 2011

Tags: Inhaltselemente, Bilder, Frage

Senekha ·

Hallo Community

Bei meinem Projekt möchte ich gerne mehrere Bilder, die je nach Seite, in der Spalte "Rand" definiert habe, als normale Auflistung ohne UL/LI und sonstige HTML/CSS drumherum ausgeben.

<div id="bild">
        		<!-- ###NIVO_SLIDER### start -->
        		<div id="slider" class="nivoSlider">
	        		        <img src="fileadmin/user_upload/900_300/1.jpg" alt="" />
					<img src="fileadmin/user_upload/900_300/2.jpg" alt="" />
					<img src="fileadmin/user_upload/900_300/3.jpg" alt="" />
					<img src="fileadmin/user_upload/900_300/4.jpg" alt="" />
			</div>
			<!-- ###NIVO_SLIDER### stop -->
</div>

Die Bilder sollen für den Image-SLider Nivo-SLider (http://nivo.dev7studios.com/) bereit gestellt werden.
Bis jetzt ist es mir nicht gelungen die Bilder in dieser Form ohne umgebendes HTML auszugeben.
Ständig die verschachtelten DIV´s mit class="csc-default" usw, oder eine leere Ausgabe im Subpart ###NIVO_SLIDER###.

Habe dazu ein Sub-Template angelegt mit folgenden Anweisungen. Wobei mir klar ist das der 2. Teil ziemlich falsch ist.

#Slider erstellen
temp.slider = TEXT
temp.slider {
  table = tt_content
  select.orderBy = sorting
  select.where = colPos = 3
  
}
temp.slider.wrap = <div id="slider" class="nivoSlider">|</div>

#Bild auslesen
tt_content = COA
tt_content {
  10 = IMAGE
  10 {
    field = file
    wrap = |
  }
}

Später wird das ganze über Subpart eingebunden was keine Probleme macht.

....
subparts {
      HAUPT_NAVI < temp.menu
    
      INHALT_MITTE < temp.inhalt_mitte
      INHALT_RECHTS < temp.inhalt_rechts
      NIVO_SLIDER < temp.slider
    
      FOOTER < temp.footer_menu
    }
....

Ein Tip wie diese Ausgabe erzeugt werden kann wäre ziemlich Hilfreich.

mort ·

Hi Senekha,

du kannst zwischen drei vordefinierten renderMethods für Bilder wählen:
dl, ul, div

Standard ist dl, was dann eine definition-list um das Bild erzeugt.
Diese Dinger sind notwendig um die Text/Bild-Positionierung abbilden zu können.

Wenn du wirklich kein HTML drumrum haben willst, dann könntest du eine neue renderMethod erzeugen und dann alle Bilder so rendern lassen. Dann gehen dir natürlich die Text-/Bild-Positionierungoptionen verloren!

Da dieses Problem schon öfter jemand hatte, ist glaube ich irgendwann in Version 4 eine neue renderMethod names "simple" eingeführt worden. Die könnte möglicherweise das machen, was du vorhast.

Probier mal das hier:

tt_content.image.20.renderMethod = simple

Alternativ kannst du dir selbst eine renderMethod mit leeren Wraps schreiben:

tt_content.image.20 {
  rendering {
    foobar {
      imageRowStdWrap.dataWrap = |
      noRowsStdWrap.wrap = |
      oneImageStdWrap.dataWrap = |
      imgTagStdWrap.wrap = |
      editIconsStdWrap.wrap = |
      caption.wrap = |
    }
  }
  renderMethod = foobar
}

Soooo. Ich habe ganz oft den Fall, dass ein Kunde einen Slider auf der Startseite hat und da dann auch die Bilder selber einpflegen will.
Hier mal meine Version, mit dem gleichen Ansatz, den du auch nutzt:

##### SLIDER #####
temp.slider = COA
temp.slider {
  wrap = <div class="slide"> | </div>
  10 = TEXT
  10 {
    field = header
    wrap = <div class="description"><h2> | </h2>
  }
  20 = TEXT
  20 {
    field = bodytext
    wrap = <p> | </p></div>
    parseFunc < lib.parseFunc_RTE
  }
  30 = IMAGE
  30 {
    file.import.field = image
    file.import = uploads/pics/
    wrap = <div class="photo"> | </div>
  }
}

page.10.marks.SLIDER = CONTENT
page.10.marks.SLIDER {
  table = tt_content
  select {
    pidInList = 6
    orderBy = sorting
    where = colPos=1
  }
  renderObj < temp.slider
}
###

Die slider-Inhalte werden direkt auf der Startseite (id=6) in der rechten Spalte als "Text mit Bild" angelegt.
Im COA bastel ich dann die Elemente "Header", "Bodytext" und "Image" wieder inklusive der vom Slider benötigten wraps zusammen.

Du könntest das fast do übernehmen, müsstest nur die DOM-Struktur des Nivo-Sliders nachbauen.
Diese Variante ist weniger mit Kanonen auf Spatzen geschossen als die gesamte renderMethod umzustellen.

Gruß,
mort`