Spalter  

    bh_newsletter
    Spalten-Element für den Newsletter

    Genauere Informationen zur Einbindung, Konfiguration und Anpassung findest du hier.

    HTML-Template: nl-columns.html
    HTML
    {namespace bh=TYPO3\Bh\ViewHelpers} {namespace nl=TYPO3\BhNewsletter\ViewHelpers} <bh:tmpl.element object="{cObj}"> <f:variable name="col1" value="{cObj.allSettings.col1}" /> <f:variable name="col2" value="{cObj.allSettings.col2}" /> <f:variable name="width" value="{cObj.allSettings.width}" /> <f:if condition="{cObj.allSettings.color} == 'transparent'"> <f:then> <f:variable name="color" value="" /> </f:then> <f:else> <f:variable name="color" value="#" /> </f:else> </f:if> <nl:section full-width="true" background-color="{color}{cObj.allSettings.color}" padding="{cObj.allSettings.paddingVTop} 0px {cObj.allSettings.paddingVBottom}" width="{width}" class="color-{cObj.allSettings.color} nl-section-padding-adjustable"> <nl:cols.row width="{width}"> <nl:cols.col width="{col1}" padding="0px" class="nl-col nl-col1 nl-col-width-{col1}"> <div class="col-width" data-col-width="{col1}"> <bh:tmpl.content section="col1" elements-allowed="{cObj.allSettings.elementsAllowed}" parent="{cObj.uid}" /> </div> </nl:cols.col> <nl:cols.col width="{cObj.allSettings.paddingCol}" padding="0px"> <div class="colSpace"> </div> </nl:cols.col> <nl:cols.col width="{col2}" padding="0px" class="nl-col nl-col2 nl-col-width-{col2}"> <div class="col-width" data-col-width="{col2}"> <bh:tmpl.content section="col2" elements-allowed="{cObj.allSettings.elementsAllowed}" parent="{cObj.uid}" /> </div> </nl:cols.col> </nl:cols.row> </nl:section> </bh:tmpl.element>
    Typoscript: nl-columns.typoscript
    TYPOSCRIPT
    plugin.tx_bh.settings.contentElements { nl-columns < abstract.bhElement nl-columns { name = Spalten hidden = 0 bheListgroup = 10 bheSorting = 30 description = Element um Spalten zu machen iconFile = typo3conf/ext/bh/Resources/Public/Icons/Elemente/columns.svg settingsForm = EXT:bh_newsletter/Resources/Public/Elements/nl-columns/nl-columns-settings.html templatePath = EXT:bh_newsletter/Resources/Public/Elements/nl-columns/ templateFile = nl-columns.html padding = 0 paddingCol = 20 paddingVTop = 30px paddingVBottom = 30px grid = 300 width = 600 col1 = 290 col2 = 290 options{ oncreate = advanced edit = 0 translate = 0 } styleOptions > styleOptions.color < element.options.nlbgcolor styleOptions.paddingV < element.options.paddingV styleOptions{ colStyles{ default = auswählen... fifty = ½ / ½ onethird = ⅓ / ⅔ twothird = ⅔ / ⅓ } } elementsAllowed = nl-text,nl-picture,nl-button,nl-box,nl-newsbox,nl-pauschalbox enablePaddingV = 1 settingsGlobalFields { templatePath = EXT:bh_newsletter/Resources/Public/Elements/nl-settings-global-fields.html } } } ## Mediaqueries element.options.mediaqueries.desktop.nl-columns = nl-columns-mediaqueries-desktop element.options.mediaqueries.mobile.nl-columns = nl-columns-mediaqueries-mobile ## CSS page.includeCSS { nl-columns-newsletter = EXT:bh_newsletter/Resources/Public/Elements/nl-columns/nl-columns.css nl-columns-newsletter.forceOnTop = 1 }
    Settings-HTML: nl-columns-settings.html
    HTML
    {namespace bh=TYPO3\Bh\ViewHelpers} <bh:form.settingsform content="{cObj}"> <div class="bhe-formsettings-option" id="bhe-colstyle-select" data-colstyle="{cObj.allSettings.grid}"> <label>Aufteilung der Spalten</label> <div class="bhColsStyleGroup"> <f:form.radio name="grid" value="300" class="bhe-colstyle-radio bh-cols-fifty" /> <f:form.radio name="grid" value="200" class="bhe-colstyle-radio bh-cols-onethird" /> <f:form.radio name="grid" value="400" class="bhe-colstyle-radio bh-cols-twothirds" /> </div> </div> <div class="bhe-formsettings-option bhe-col1-width" style="display:none;"> <label>Breite Spalte 1 in Pixel</label> <f:form.textfield type="number" name="col1" value="{cObj.allSettings.col1}" /> </div> <div class="bhe-formsettings-option bhe-col2-width" style="display:none;"> <label>Breite Spalte 2 in Pixel</label> <f:form.textfield type="number" name="col2" value="{cObj.allSettings.col2}" /> </div> <div class="bhe-formsettings-option bhe-col-padding" style="display:none;"> <label>Platz zwischen den Spalten</label> <f:form.textfield type="number" name="paddingCol" value="{cObj.allSettings.paddingCol}" /> </div> <div class="bhe-formsettings-option"> <label>Hintergrundfarbe</label> <f:form.select name="color" value="{cObj.allSettings.color}" options="{cObj.allSettings.styleOptions.color}" /> </div> <bh:form.dynamicFields item="{cObj}" settings="{cObj.allSettings.settingsGlobalFields}" /> <f:form.submit value="Speichern" /> <script type="text/javascript"> Bh.newsletter.coreElements.initColSettings(); </script> </bh:form.settingsform>