DEPRECATION WARNING
This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.
TypoScript Reference¶
GalleryView¶
All parameters of galleryView can be set via Typoscript. They are named like the javscript properties.
For a detailed description see: http://spaceforaname.com/galleryview .
These are the default settings:
plugin.tx\_yag.settings.themes.galleryView { ## Configuration for gallery view transition\_interval = 0 transition\_speed = 1000 easing = 0 pause\_on\_hover = false show\_panels = true panel\_width = 800 panel\_height = 500 panel\_animation = crossfade overlay\_opacity = 0.7 overlay\_position = bottom panel\_scale = crop show\_panel\_nav = true show\_overlays = true show\_filmstrip = true frame\_width = 120 frame\_height = 80 start\_frame = 1 filmstrip\_size = 3 frame\_opacity = 0.5 filmstrip\_style = scroll filmstrip\_position = bottom show\_filmstrip\_nav = true frame\_gap = 15 frame\_scale = crop show\_captions = false pointer\_size = 0 animate\_pointer = true }
crossSlide¶
plugin.tx_yag.settings.themes.crossSlide.gallery
Configuration that affects the whole gallery.
Property: | Data type: | Description: | Default: |
---|---|---|---|
canvasWidth | int | Width of the div container holding the slideshow | 600 |
canvasHeight | int | Height of the div container holding the slideshow | 300 |
fade | int | Crossfade between images | 1 |
sleep | int | Time in sconds to wait between the crossfades. If you aset a value for sleep, the image remain static between the crossfades. | Not used |
plugin.tx_yag.settings.themes.crossSlide.image
Configuration that affects a single image.
Property: | Data type: | Description: | Default: |
---|---|---|---|
pan.startX | int | Horizontal start position of the image in percent. | 40 |
pan.stopX | int | Horizontal end position of the image in percent. | 60 |
pan.startY | int | Vertical start position of the image in percent. | 30 |
pan.stopY | int | Vertical end position of the image in percent. | 50 |
pan.variance | int | For every image, starX/Y and stopX/Y is adjusted by a random value in the range of +/- variance | 20 |
pan.alternate | int | Alternate the direction of the panning with each image. | 1 |
zoom.start | float | Start value of the magnification. | 1.0 |
zoom.stop | float | End value of the magnification. | 1.3 |
zoom.variance | float | For every image the start/stop magnification is adjusted by a random value in the range of +/- variance. | 0.3 |
alternate | int | Alternate the direction of the zoomwith each image. | 1 |
time | int | Duration of a pan/zoom/fade period in seconds. | 3 |
Isotope¶
Block size weighting configures the probability in which size an image is rendered. Set the probability to zero if you do not want an image be rendered in that size.
You can define the size and dimension of each resolution name in the resolution configuration of this theme.
plugin.tx_yag.settings.themes.isotope.blockSizeWeighting
Property: | Data type: | Description: | Default: |
---|---|---|---|
smallSquare | int | Small square image | 40 |
bigSquare | int | Big square image | 20 |
verticalLong | int | Vertical image | 20 |
horizontalLong | int | Horizontal image | 20 |
Supersized¶
The settings are directly named after the javascript settings of the supersized plugin. Please have a look at http://buildinternet.com/project/supersized/docs.html for a full documentation.
superSizedSettings { // General slideshow = 1 autoplay = 1 start\_slide = 1 stop\_loop = 0 random = 0 slide\_interval = 3000 transition = 1 transition\_speed = 1000 new\_window = 1 pause\_hover = 0 keyboard\_nav = 1 performance = 2 image\_protect = 1 image\_path = EXT:yag\_themepack\_jquery/Resources/Public/GallerySourc e/SuperSized/slideshow/img/ //Size & Position min\_width = 1024 min\_height = 768 vertical\_center = 1 horizontal\_center = 1 fit\_portrait = 1 fit\_landscape = 0 fit\_always = 0 //Components slide\_links = blank thumb\_links = 1 navigation = 1 thumbnail\_navigation = 0 slide\_counter = 1 slide\_captions = 1 progress\_bar = 1 mouse\_scrub = 0 }
NivoSlider¶
The NivoSlider is a tiny imageSlider with many different slide animations and and an optional thumbnail navigation.
plugin.tx_yag.settings.themes.nivoSlider.nivoSliderSettings
Property: | Data type: | Description: | Default: |
---|---|---|---|
effect | string | One of these: sliceDown,sliceDownLeft,sliceUp,sliceUpLeft,sliceUpDown, sliceUpDownLeft,fold,fade,random,slideInRight,slideInLeft,boxRandom,bo xRain,boxRainReverse,boxRainGrow,boxRainGrowReverse | random |
slices | int | For slice animations | 15 |
boxCols | int | For box animations | 15 |
boxRows | int | For box animations | 4 |
animSpeed | int | Slide transition speed | 500 |
pauseTime | int | How long each slide will show | 3000 |
startSlide | int | Set starting Slide (0 index) | 0 |
directionNav | boolean | Next & Prev navigation | true |
directionNavHide | boolean | Only show on hover | true |
controlNav | boolean | 1,2,3... navigation | true |
controlNavThumbs | boolean | Use thumbnails for Control Nav | false |
keyboardNav | boolean | Use left & right arrows | true |
pauseOnHover | boolean | Stop animation while hovering | true |
manualAdvance | boolean | Force manual transitions | true |
captionOpacity | float | Universal caption opacity | 0.8 |
randomStart | boolean | Start on a random slide | false |
jQuery Rondell¶
All configuration values for the frontend theme are set within the typoscript key javaScriptSettings.rondell.
plugin.tx_yag.settings.themes.rondell.javaScriptSettings.
Property: | Data type: | Description: | Default: |
---|---|---|---|
preset | string | Gallery Preset. In this version also available are:
|
carousel |
jQuery RondellGallery¶
All configuration values for the frontend theme are set within the typoscript key javaScriptSettings.rondellGallery.
Property: | Data type: | Description: | Default: |
---|---|---|---|
preset | string | Gallery Preset. In this version also available are:
|
thumbGallery |
Galleria.io¶
The galeria script comes with its own theming system. The default theme “classic” is free of charge and included into the the extension. You can also purchase more advanced themes on their website (http://www.galleria.io).
plugin.tx_yag.settings.themes.galleria.galleriaSettings
Property: | Data type: | Description: | Default: |
---|---|---|---|
themeBasePath | string | Basepath to the gallery theme directory. If you have purchased one of the more advanced themes of galleria.io, upload this theme to a theme directory on your sever and point the themeBasePath to this directory. | typo3conf/ext/yag_themepack_jquery/Resources/Public/GallerySource/Ga lleria/src/themes/ |
theme | string | Select a theme from the directory configured with themeBasePath | Classic |
width | String | Width of the galleria frame | 800 |
height | String | Height of the galleria frame | 370 |
jsonMode | Integer | If set to 1, the image data is rendered as JSON array | 0 |
Wookmark¶
All configuration values for the frontend theme are set within the typoscript key javaScriptSettings.wookmark.
Available Options:
javaScriptSettings { theme = wookmark wookmark { align = center offset = 2 autoResize = true itemWidth = 0 flexibleWidth = 0 resizeDelay = 50 filterMode = or } lightbox { enabled = 1 mainClass = mfp-with-zoom mfp-fade zoom { enabled = true duration = 200 easing = ease-in-out } } }
Google Maps¶
All configuration values for the frontend theme are set within the typoscript key javaScriptSettings.gmaps.
Property: | Data type: | Description: | Default: |
---|---|---|---|
width | string | The width of the map. Can be set relative or by pixel. | 100% |
height | string | The width of the map. Can be set relative or by pixel. | 600 |
showRouteToLink | Boolean | false | |
dropAnimation | Boolean | true | |
cluster | Booelean | Cluster the images when zoomed out | true |
lightbox | Boolean | Show a lightbox when clicked on a marker | true |
mapOptions | array | Further google maps ooptions | mapOptions {
zoom = 14
streetViewControl = false
mapTypeControl = false
}
|