HTML-Aufbau und CSS-Klassen
Die Social-Wall wird immer dann befüllt, wenn HTML mit folgendem Aufbau gefunden wird:
HTML
<a class="bh-social-post bh-social-template bh-social-link bh-social-background-picture" target="_blank">
<div class="bh-social-content">
<div class="bh-social-datewrapper">
<span class="bh-social-weekday"></span>
<span class="bh-social-day"></span>.
<span class="bh-social-month"></span>.
<span class="bh-social-year"></span>
</div>
<div class="bh-social-message"></div>
</div>
</a>
Element-Einstellungen
Im Element-TypoScript kann mit der settingsFormConfig.advanced-Einstellung bestimmt werden, ob die optischen Einstellungen angezeigt werden (1) oder nicht (0).
JavaScript-Konfiguration
Widget
| Klasse | Beschreibung |
| bh-social-widget | Umfasst ein Social-Widget und enthält die wichtigen [data] Attribute. |
| [data-facebook="cookiswebworks"] | Die ID der Facebook Page, die geladen werden soll. |
| [data-instagram="cookiswebworks"] | Der/die Instagram User:in |
| [data-limit="25"] | Anzahl der Posts, die geladen werden sollen. Maximum: 25 |
| [data-autofade="autofade"] | Aktiviert den Autofade bei der Darstellung 'Fade'. |
| [data-minWidthPerItem="400"] | Pixelwert, der die minimale Breite eines Eintrags definiert. Gilt nur in der 'Swiper' Ansicht. Über diesen Wert wird berechnet, wie viele Einträge nebeneinander Platz haben. |
| [data-maxTextLength="200"] | Gibt an, wie viele Zeichen der Nachricht ausgegeben werden. |
Elemente
| Klasse | Beschreibung |
| bh-social-post | Beeinhaltet einen einzelnen Post (z. B. Fadersheet). |
| bh-social-template | Beeinhaltet das Template für einen Eintrag. Kann auch mit bh-social-post übereinstimmen. |
| bh-social-link | Muss auf einem <a> Tag eingesetzt werden. Das href Attribut mit den Link wird hinzugefügt. |
| bh-social-background-picture | Das Bild wird als background-image im style Attribut hinzugefügt. |
| bh-social-picture | Muss auf einem <img> Tag eingesetzt werden. |
| bh-social-weekday | Der Ausgeschriebene Wochentag |
| bh-social-day | Der Tag im Zahlenformat |
| bh-social-month | Das Monat im Zahlenformat |
| bh-social-year | Das Jahr im Zahlenformat |
| bh-social-message | Die Nachricht |
Klassen für die Darstellung
| Klasse | Beschreibung |
| bh-social-default | Posts nebeneinander - Swiper |
| bh-social-rows | Zeilen untereinander - Hintergrundbild |
| bh-social-rows2 | Zeilen untereinander - Minibild |
| bh-social-fader | Fader |
Events
| Klasse | Beschreibung |
| bh-social-loaded | Social-Wall fertig geladen und angezeigt |