bh_touch
Galerie-Element für die Touch-Erweiterung
HTML-Template: el-touchgallery.html
HTML
{namespace bh=TYPO3\Bh\ViewHelpers}
<bh:tmpl.element object="{cObj}">
<bh:swiper class="lightboxgroup" settings="{cObj.allSettings.swiper}">
<div class="el-gallery-wrapper">
<f:for each="{cObj.allSettings.pictures}" as="picture">
<bh:repository.load repository="TYPO3\Bh\Domain\Repository\FileRepository" method="findByUid"
options="{picture}" as="file">
<f:if condition="{file.isPicture}">
<a class="el-gallery-item" {f:if(condition: '{cObj.allSettings.enableLightbox}' ,
then: 'href="/{file.relativeFile}" target="lightbox"' )}>
<bh:image.background file="{file}">
<div class="el-touchgallery-element-inner"> </div>
</bh:image.background>
</a>
</f:if>
</bh:repository.load>
</f:for>
</div>
</bh:swiper>
</bh:tmpl.element>
Typoscript: el-touchgallery.typoscript
TYPOSCRIPT
## el-touchgallery
plugin.tx_bh.settings.contentElements{
el-touchgallery < abstract.bhElement
el-touchgallery {
name = Swipe Bildgalerie
description = Ein Element mit super Eigenschaften
templateFile = el-touchgallery.html
templatePath = EXT:bh_touch/Resources/Public/Elements/el-touchgallery/
iconFile = typo3conf/ext/bh/Resources/Public/Icons/Elemente/picture.svg
settingsForm = EXT:bh_touch/Resources/Public/Elements/el-touchgallery/el-touchgallery-settings.html
bheListgroup = 90
options{
translate = 0
edit = 0
}
swiper{
pagination = 1
navigation = 1
}
}
}
page.includeCSS.el-touchgallery = EXT:bh_touch/Resources/Public/Elements/el-touchgallery/el-touchgallery.css
Settings-HTML: el-touchgallery-settings.html
HTML
{namespace bh=TYPO3\Bh\ViewHelpers}
<bh:form.settingsform content="{cObj}">
<!-- Mini MediaCake -->
<div class="bhe-formsettings-option bhe-form-field-type-mediacake">
<label data-tooltip="Hier werden die Bilder ausgewählt die Gallerie angezeigt werden."
data-tooltip-view="extended">Bild-MediaCake</label>
<f:if condition="{cObj.allSettings.pictures}">
<f:then>
<bh:repository.load repository="TYPO3\Bh\Domain\Repository\FileRepository" method="findByUids"
options="{cObj.allSettings.pictures}" as="pictures">
<bh:form.mediacake name="pictures" value="{pictures}" />
</bh:repository.load>
</f:then>
<f:else>
<bh:form.mediacake name="pictures" value="{pictures}" />
</f:else>
</f:if>
</div>
<f:if condition="{cObj.allSettings.styleOptions.classes}">
<div class="bhe-formsettings-option">
<label>Styles</label>
<f:form.select multiple="true" name="style[options]" value="{cObj.allSettings.style.options}"
options="{cObj.allSettings.styleOptions.classes}" />
</div>
</f:if>
<f:form.submit value="Speichern" />
</bh:form.settingsform>