06. November 2008

Bildergalerie mit reinem TS

in Tutorial, TYPO3, TypoScript

In meinem ersten Beitrag möchte ich einfache Galerie vorstellen, die rein mit TypoScript erstellt werden kann und doch flexibel ist. Die Bilder werden in den Seiteneigenschaften eingepflegt und der Besucher bekommt ein Bild in groß und die weiteren als Thumbnail. Eine Demo gibt es hier

lib.imageswap = COA
lib.imageswap {
	# BIG IMAGE
	1 = IMAGE
	1 {
		file {
			maxW = 400
			maxH = 300

			import= uploads/media/
			import.data = levelmedia: -1,slide
			import.listNum = 0
			import.override.field = media
		}
		params = name="image_big" class="bigimg"
	}

	# SMALL THUMBS
	10 <.1
	10 {
		file {
			maxW = 100
			maxH = 50
		}
	params = onclick="swap('image_big', this)" class="smallimg"
		
		longdescURL.cObject = IMG_RESOURCE
		longdescURL.cObject.file {
			import.data = TSFE:lastImageInfo|origFile
			maxW = 400
			maxH = 300
		}
	}
	
	20 <.10
	20.file.import.listNum = 1
	30 <.10
	30.file.import.listNum = 2
	40 <.10
	40.file.import.listNum = 3
	50 <.10
	50.file.import.listNum = 4
	
	# JS
	100 = TEXT
	100.value (
		<script type="text/javascript">
		  <!--
		  function swap(imgname,image) {
		     document.images[imgname].src =
		     image.getAttribute('longdesc');
		  }
		  //-->
		</script>	
	)
}

Zur Erklärung des TS

  • An Stelle 1 des COA wird das große Bild erstellt, wobei der name-Tag wichtig für den späteren JS-Austausch ist.
  • Positionen 10-50 sind für die Thumbnails zuständig, wobei im longdesc-Tag der Pfad zur großen Variante gespeichert ist. Wichtig ist, dass die Größe mit der des großen Bildes übereinstimmt.
  • An letzter Stelle (100) wird eine simple JavaScript-Funktion eingebunden, die für den Austausch verantwortlich ist

Das Ende meines 1. Beitrags würde ich noch für ein Danke an Tim nützen, der es mir ermöglicht hat, hier zu bloggen.

6 Reaktionen zu “Bildergalerie mit reinem TS”

Kommentare abonnieren (RSS) oder TrackBack URL

Vielen Dank,
sowas kann man immer mal gebrauchen.

Henrik Ziegenhain am 06. November 2008 um 16:05

Das werde ich ganz sicher mal gebrauchen, danke für diesen Post!

Alex am 07. November 2008 um 09:13

… vielen Dank!
Sehr hilfreich…

Thorsten am 07. November 2008 um 11:05

Und wie bekomme ich wo meine fotos rein??

Fee am 23. Dezember 2008 um 01:09

in dem fall über die seiteneigenschaften, aber kann viele möglichkeiten geben, könntest text mit bild soweit umbauen usw

georg

Georg Ringer am 23. Dezember 2008 um 10:41

Hi,
wie kann ich den die Galerie nutzen, ohne die Thumbnails. Ich will nur 2 Pfeile haben (einen nach rechts und einen nach links) die dann das nächste/vorherige Bild wählen. Kriegt man das hin? Die Pfeile sollen aber nicht auf den Bildern sein! Sondern unabhängig davon.

Ulrike am 15. Mai 2011 um 11:56

Kategorien

Archiv