TemplaVoila Cheat-Sheet

Freitag, 09. März 2012

Einzelnes Bild mit Zoom-Ansicht verlinken

Bild im FCE mit Link zu Zoom-Ansicht wrappen, damit das Bild z.B. in einer Lightbox geöffnet werden kann:

10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxH = 120
 
10.imageLinkWrap = 1
10.imageLinkWrap {
   enable = 1
   typolink {
      parameter.override.cObject = IMG_RESOURCE
      parameter.override.cObject {
         file.import.data = TSFE:lastImageInfo|origFile
         file.maxW = 900
         file.maxH = 600
      }
      ATagParams = class="fce-singlepic-zoom"
   }
}

Pfad zu mehreren Bildern im Quelltext ausgeben

Pfad zu mehreren hochgeladenen Bildern eines FCE ausgeben, z.B. um sie in einer Lightbox zu öffnen:

10 = COA
10 {
  10 = HTML
  10 {
    value.field = field_images
    value.split {
      token = ,
      cObjNum = 1
      1 {
        10 = IMG_RESOURCE
        10.stdWrap.wrap = <span>|</span>
        10 {
          file {
            import.current = 1
            import = uploads/tx_templavoila/
            format = jpg
            width = 950c
            height = 700c
          }
        }
      }
    }
  }
}

Link zu alternativem Bild für Zoom-Ansicht

In einem FCE können in einem Bild-Feld zwei Bilder hochgeladen werden. Das erste Bild ist die Ansicht als Verkleinerung (Thumbnail), das zweite Bild soll verlinkt werden. Falls kein zweites Bild angegeben wurde, wird das erste Bild als Zoom verwendet.

10 = IMAGE
10 {
  file {
    import = uploads/tx_templavoila/
    import.current = 1
    import.listNum = 0
    width = 185
    height = 120c
  }
  imageLinkWrap = 1
  imageLinkWrap {
    enable = 1
    typolink {
       parameter {
          cObject = IMG_RESOURCE
          cObject.file {
            import = uploads/tx_templavoila/
            import.current = 1
            import.listNum = 0
            maxW = 900
            maxH = 680
 
            import.override {
              listNum = 1
              current = 1
            }
          }
       }
       ATagParams = class="fce-singlepic-zoom"
    }
  }
}

Typoscript aus einem FCE komplett auslagern

TypoScript kann bei jedem Daten-Typ in TemplaVoilà ausgelagert werden. Man muss nicht zwangsläufig “TypoScript Objekt-Pfad” oder “reines TypoScript” verwenden. In diesem Beispiel wird z.B. die Verarbeitung des hochgeladenen Bildes durch ein externes TypoScript geregelt. Dazu habe ich in dem DataStructure XML das Tag “TypoScriptObjPath” verwendet:

...
<field_bike_image type="array">
   <tx_templavoila type="array">
      <title>Bild vom Fahrrad</title>
      <sample_data type="array">
         <numIndex index="0"></numIndex>
      </sample_data>
 
      <eType>image</eType>
 
      <TypoScriptObjPath>lib.fce_bike_images</TypoScriptObjPath>
 
      <proc type="array">
         <int>0</int>
         <HSC>0</HSC>
         <stdWrap></stdWrap>
      </proc>
      <preview></preview>
   </tx_templavoila>
   <TCEforms type="array">
      <label>Bild vom Fahrrad</label>
      <config type="array">
         <type>group</type>
         <internal_type>file</internal_type>
         <allowed>gif,png,jpg,jpeg</allowed>
         <max_size>5000</max_size>
         <uploadfolder>uploads/tx_templavoila</uploadfolder>
         <show_thumbs>1</show_thumbs>
         <size>2</size>
         <maxitems>10</maxitems>
         <minitems>0</minitems>
      </config>
   </TCEforms>
</field_bike_image>
...