Schnellnavigation:

Kategorien

Schlagwortwolke

api typoscript seo rte extension backend css templavoila facebook sprachen extensions gifbuilder datenbank google fce redaktion php menü hyphen ie6 formular security constants slide webfonts silbentrennung twitter typo3-camp tceform t3c tca tag t3blog sql sprachmenü tcadefaults suchmaschine suchtipps typo3camp
« Februar 2012»
S M T W T F S
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29      

Kopieren Sie diesen Link in Ihren RSS-Reader

RSS 0.91Nachrichten
Kommentare
RSS 2.0Nachrichten
Kommentare

In eigener Sache

Peter Linzenkirchner, Lisardo Multimedia in Augsburg. Freelance und Partner für Design- und Webagenturen in Augsburg und München. Pixelgenaue Templates, valides HTML, barrierearm. TYPO3-Projekte, Extension-Programmierung und mehr ... 

11Januar2011

Lightbox im RTE: möglich mit rtelightbox und ein bisschen Tuning mit Typoscript

Prinzipiell ist es möglich, mit Hife der Extension rtelightbox eine Lightbox im RTE umzusetzen – in der Regel reicht es einfach, eine gängige Lightbox zu installieren und danach im Template folgende statische Typoscript-Templates einzubinden: 

  • das Template der jeweiligen Lightbox
  • Clickenlarge Rendering (rtehtmlarea)
  • RTE Lightbox (rtelightbox)

und zwar muss das Template von RTE Lightbox an letzter Stelle stehen. 

Leider hat die Extension aber einen kleinen Fehler: sie bindet das unbearbeitete Originalbild in die Lightbox ein, heisst, man erhält unter Umständen ein viel zu großes Bild in der Lightbox. 

Um das auszubessern ist ein bisschen Typoscript erforderlich. Zunächst zwei Variablen in die Constants schreiben, das wird später für die maximale Breite und Höhe verwendet: 

  1. lightbox.width = 800m
  2. lightbox.height = 800m

Danach ins Setup diesen Code: 

  1. lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink{
  2.   parameter.dataWrap >
  3.   parameter.cObject = IMG_RESOURCE
  4.   parameter.cObject.file.import.data = parameters:origFile
  5.   parameter.cObject.file.maxW = {$lightbox.width}
  6.   parameter.cObject.file.maxH = {$lightbox.height}
  7.   ATagParams >
  8.   ATagParams = rel="lightbox[lb{field:uid}]"
  9.   ATagParams.insertData = 1
  10.  }

(Der Tipp stammt aus einem Forenbeitrag von Thomas Kowtsch. Damit funktioniert es allerdings erst in perfectlightbox. Damit es auch in den anderen funktioniert, muss das hier noch im Setup ergänzt werden: 

  1. [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|wsclicklightbox|type = /(.+)/]
  2.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox[c{field:uid}]"
  3.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|pmkslimbox|type = /(.+)/]
  4.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox[sb{field:uid}]"
  5.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|jq_fancybox|type = /(.+)/]
  6.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = class="jqfancybox" rel="fancybox{field:uid}"
  7.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|jquery_thickbox|type = /(.+)/]
  8.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = class="thickbox" rel="gallery{field:uid}"
  9.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|jq_lightbox|type = /(.+)/]
  10.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = class="lightbox" rel="lightbox[{field:uid}]"
  11.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|perfectlightbox|type = /(.+)/]
  12.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox[lb{field:uid}]"
  13.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|perfectlightboxjquery|type = /(.+)/]
  14.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox[lb{field:uid}]"
  15.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|kj_imagelightbox2|type = /(.+)/]
  16.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox[presentation{field:uid}]"
  17.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|pmkshadowbox|type = /(.+)/]
  18.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="shadowbox[sb{field:uid}]"
  19.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|slimbox|type = /(.+)/]
  20.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox[lb{field:uid}]"
  21.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|jquerylightbox|type = /(.+)/]
  22.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox"
  23.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|rzcolorbox|type = /(.+)/]
  24.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = class="rzcolorbox" rel="rzcolorbox[cb{field:uid}]"
  25.  [globalVar = LIT:{$plugin.rtelightbox.automaticDetection} = 1] && [globalString = TYPO3_LOADED_EXT|rzlightbox|type = /(.+)/]
  26.  lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink.ATagParams = rel="lightbox-{field:uid}"
  27.  [global]

Das sollte jetzt für alle Lightboxen funktionieren. 

Kategorien: Extensions/Typoscript  
Links:
Trackback-Link  (Bitte kopieren)
 
| Mehr
  •  
  • Kommentare
  •  
Gravatar: Andy
Andy am
18Mai2011

Super, danke für diesen nützlichen Post :)

Gravatar: Robman
Robman am
03Oktober2011

Vielen Dank auch von mir für die hilfreiche Info!

Gravatar: Sven Burkert
Sven Burkert am
09Dezember2011

Super, das baue ich in rtelightbox ein. Es genügen übrigens die ersten paar Zeilen TypoScript: lib.parseFunc_RTE.tags.img.postUserFunc.imageLinkWrap.typolink{ parameter.dataWrap > parameter.cObject = IMG_RESOURCE parameter.cObject.file.import.data = parameters:origFile parameter.cObject.file.maxW = {$styles.content.imgtext.linkWrap.width} parameter.cObject.file.maxH = {$styles.content.imgtext.linkWrap.height} } Der ATagParams muss nicht ersetzt werden!

Gravatar: Stefan Krapf
Stefan Krapf am
01Februar2012

Hallo zusammen Falls Ihr das noch nicht gesehen habt, ich habe den Autor der Extension "rtelightbox" auf den Code und die Lösung hier auf der Seite aufmerksam gemacht und er hat das inzwischen eingebaut resp. korrigiert! Nun funktionieren endlich alle Lightboxen im RTE wie gewünscht und verkleinern die Bilder! Besten Dank nochmals :D

Mein Kommentar

Benachrichtige mich, wenn jemand einen Kommentar zu dieser Nachricht schreibt.