Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

--- typo3:images [2014/02/05 22:08] – admin
+++ typo3:images [2018/11/01 13:04] (aktuell) – [Vorschaubilder beschneiden, aber Lightbox im Original] admin
@@ Zeile 1: / Zeile 1: @@
-===== Maximale Bildbreite nach Spalte (und BackendLayout) festlegen =====
+====== Images ======
+===== Snippets =====
+==== Konstanten für Bildgrößen und Lightbox ====
+<code typoscript>
+styles.content.textmedia {
+    linkWrap.lightboxEnabled = 1
+    # linkWrap.height = 800
+    linkWrap.width = 1200
+    maxW = 860
+    maxWInText = 400
+    linkWrap.lightboxCssClass = lightbox
+    linkWrap.lightboxRelAttribute = lightbox[{field:uid}]
+}
+</code>
+----
+==== Bildbeschreibung in Lightbox ausgeben ====
+<code typoscript>
+lib.contentElement.settings.media.popup.linkParams.title.data = file:current:description // file:current:title //file:current:alternative
+</code>
+----
+==== ClickEnlarge Rendering/Lightbox für RTE ====
+Um Bilder innerhalb des RTE in einer Lightbox vergrößern zu können, muss zuerst einmal das Static Template //ClickEnlarge Rendering (rtehtmlarea)// hinzugefügt werden.
+<WRAP center round important 100%>
+Das Static Template erweitert ''lib.parseFunc_RTE'' muss daher __nach__ der grundsätzlichen Konfiguration eingefügt werden!
+</WRAP>
+Anschließend ergänzen wir ''lib.parseFunc_RTE'' um die für die Lightbox benötigten Attribute:
+**TypoScript:**
+<code typoscript>
+lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap {
+    JSwindow = 0
+    directImageLink = 1
+    linkParams.ATagParams.dataWrap = class="lightbox" rel="lightbox"
+}
+</code>
+----
+==== Maximale Bildbreite nach Spalte (und BackendLayout) festlegen ====
 Mit verschachtelten ''CASE''-Abfragen lässt sich die max. Bildbreite sowohl spaltenabhängig als auch nach gewähltem BackendLayout einstellen. Somit kann ein Redakteur ruhig mal eine Größenangabe im Inhaltselement vergessen, ohne dass direkt das Aussehen der Seite leidet.
@@ Zeile 34: / Zeile 83: @@
 ----
-===== Header-Image: last =====
+==== Header-Image aus Seiteneigenschaften ====
-Das jeweils letzte Bild nutzen, das unter Seite / Ressourcen eingebettet wurde. (TYPO3 < 6.x)
+<wrap caution>bis TYPO3 6.x</wrap> Das erste Bild nutzen, das unter Seite / Ressourcen eingebettet wurde.
 <code typoscript>
-lib.headerimg = TEXT
+lib.headerimage = TEXT
-lib.headerimg {
+lib.headerimage {
 	data = levelmedia:-1, slide
-	listNum = last
+	listNum = 0
 	wrap = <img src="/uploads/media/|" alt="header"/>
 }
 </code>
+<wrap caution>ab TYPO3 6.1</wrap> Durch den FAL (File Abstraction Layer) wird nur die ID einer Filereferenz gespeichert. Durch ''treatIdAsReference = 1'' wird diese aufgelöst.
+<code typoscript>
+lib.headerimage = IMAGE
+lib.headerimage {
+  file {
+    import = uploads/media/
+    import {
+      data = levelmedia: -1, slide
+      listNum = 0
+    }
+    treatIdAsReference = 1
+    required = 1
+  }
+  altText.data = page : title
+}
+</code>
+----
+==== Background-Image aus Seiteneigenschaften ====
+Prinzipiell ähnlich wie das obere Beispiel, nur als IMG_RESOURCE. Dieses cObject gibt nur den Bildpfad aus, kein komplettes ''img''-Tag.
+**TypoScript:**
+<code typoscript>
+lib.pageBackgroundImage = IMG_RESOURCE
+lib.pageBackgroundImage {
+  file {
+    import = uploads/media/
+    import.data = levelmedia:-1, slide
+    import.listNum = 0
+    treatIdAsReference = 1
+    required = 1
+  }
+}
+</code>
+**Fluid-Template:**
+<code html>
+<div class="bg-image" style="background-image: url(<f:cObject typoscriptObjectPath="lib.pageBackgroundImage" />)">
+</code>
+----
+==== Vorschaubilder beschneiden, aber Lightbox im Original ====
+Hierfür muss nichts in den Templates geändert werden, es genügt die folgende Zeile TypoScript (TYPO3 v8 oder höher):
+<code typoscript>
+lib.contentElement.settings.media.popup.crop.data = file:current:size
+</code>
+Dies überschreibt die Default-Einstellung ''file:current:crop'', welche sonst die beschnittene Version des Fotos auslesen würde.
+----
+===== Troubleshooting =====
+==== TYPO3 6.x zeigt keine Bilder im Frontend an ====
+Im Install Tool prüfen ob, unter ''[compat_version]'' noch 3.8 eingetragen ist. Dann muss zuerst der Upgrade Wizard verwendet werden. Entscheidend ist hier der Punkt //Migrate all file relations from tt_content.image and pages.media//.\\
+Ein weiteres Indiz für eine alte ''[compat_version]'' ist eine für TYPO3 6.x ungewohnte Ansicht der Seiteneigenschaften.
+Quelle: https://www.web-vision.de/support/Knowledgebase/Article/View/473/0/typo3-6x-zeigt-nach-der-installation-keine-bilder-im-frontend

Snippets + Wiki

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Unterschiede

Seiten-Werkzeuge