--- title: Facebook-Layouts slug: campaign/docs/facebook-layouts docTags: createdAt: 2026-08-06T15:53:47.341Z --- Erfahren Sie in diesem Kapitel, wie: - Ihnen der Kundenbetreuung alternative HTML-Layouts [einrichtet](docId\:SNTD6vYznDKu72D8OOdub) - Sie alternative Layouts im Facebook-Paragraphen [auswählen](docId\:SNTD6vYznDKu72D8OOdub) - Sie mithilfe fundierter HTML-, CSS und Velocity-Kenntnisse alternative Layouts [bearbeiten](docId\:SNTD6vYznDKu72D8OOdub) Um bis zu 2 alternative Layouts zu erhalten, wenden Sie sich an die [Kundenbetreuung](docId\:ZWe1T3UPz3JW6_4mc76qV). Wenn Sie selbst HTML-Layouts hinterlegen möchten, legen Sie alternative Layouts sowohl für die Textversionen als auch die Mobilversionen an. Falls für die Mobilversionen und Textversionen keine alternativen Layouts hinterlegt werden, wird das Standard-Layout verwendet. :::hint{type="info"} **Note** Unter Umständen werden einzelne Textbausteine nicht wie gewünscht angeordnet. ::: ## Layout auswählen 1. Um das Standard-Layout oder eines der bis zu 2 alternativen Layouts auszuwählen, klicken Sie beim Bearbeiten eines Mailings im Template-Kit links in der Vorschau, in der Menüleiste des Facebook-Paragraphen, auf **Facebook**. Auf der rechten Seite öffnet sich das Konfigurationsfenster. 2. Wechseln Sie zum Reiter **Optionen**. 3. Wählen Sie im Bereich **Erscheinungsbild** in der Drop-down-Liste **Erscheinungsbild** das Layout aus, das Sie anwenden möchten. ![Bild: Layout-Auswahlliste](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/oxwQNw9nBE9PoYTlzOnvj-20260720-145327.png "Bild: Layout-Auswahlliste") 4. Klicken Sie auf **Übernehmen**. ## Layout bearbeiten Sie können alternative Layouts bearbeiten, das Standard-Layout ist jedoch nicht veränderbar. :::hint{type="danger"} **Warning** Wenn Sie nicht über fundierte HTML-, CSS- und Velocity-Kenntnisse verfügen, wenden Sie sich an die [Kundenbetreuung](docId\:ZWe1T3UPz3JW6_4mc76qV). Falls Sie die alternativen Layouts ohne fundierte Kenntnisse bearbeiten, kann es zu schweren Darstellungsfehlern in Ihren Mailings kommen. ::: 1. Klicken Sie links in der Vorschau auf **Einstellungen**. Auf der rechten Seite öffnet sich das Konfigurationsfenster. 2. Wechseln Sie zum Reiter **Facebook**. Pro Layout stehen Ihnen Quelltext-Felder für die Desktop-Version, die Mobilversion und die Textversion zur Verfügung. ![Bild: Reiter Facebook](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/o5nSAD5rHJ36UGbjjOCNq-20260720-145327.png "Bild: Reiter Facebook") 3. Bearbeiten Sie den Quelltext des entsprechenden Layouts nach Ihren Wünschen. Lesen Sie unter [Inhalte einfügen](docId\:SNTD6vYznDKu72D8OOdub), wie Sie die verschiedenen Inhalte auslesen und platzieren können. :::hint{type="info"} **Tip** Richten Sie auch für die Mobilversionen und die Textversionen entsprechende alternative Layouts ein. Falls für die Mobilversionen und Textversionen keine alternativen Layouts hinterlegt werden, wird automatisch auf das Standard-Layout zurückgegriffen. ::: 4. Klicken Sie auf **Übernehmen**. ## Inhalte einfügen Greifen Sie auf die Inhalte des Facebook-Paragraphen mit Velocity-Variablen zu und formatieren Sie die übertragenen Inhalte mit HTML-Style-Anweisungen. Folgende Velocity-Variablen stehen Ihnen zur Verfügung: - **Status**: Informationen zum aktuellen Facebook-Post - **Present**: Für Abfragen, die das Vorhandensein eines Elements prüfen - **Value**: Zur Ausgabe des Inhalts **Hinweise zur Erstellung neuer Layouts** - **Schriftdefinitionen**: Bei Verwendung einer alternativen Layout-Variante müssen alle Schriftdefinitionen in dem eingegebenen HTML vorhanden sein. Die Texte werden nicht durch das Template-Kit formatiert, um Ihnen völlige Freiheit bei der optischen Gestaltung zu lassen. - **Breitenangaben**: Geben Sie eine feste Breite oder eine Breite in Prozent an, um zu vermeiden, dass Elemente aus dem Layout herausragen. - **Gefahr von Darstellungsfehlern**: Falls Sie die Layouts ohne fundierte HTML-Kenntnisse bearbeiten, kann es zu schweren Darstellungsfehlern in Ihren Mailings kommen. ### Status-Variablen | Variable | Typ | Beschreibung | | ------------------ | ------- | ----------------------------------------------------------------------------------------------------------------------------------------- | | $facebookItemFirst | Boolean | Enthält `true`, falls es sich um den ersten Post des Facebook-Paragraphen handelt, sonst `false`. | | $facebookItemIndex | Integer | Enthält die Position des Posts innerhalb des Facebook-Paragraphen als Zahl (1 für den ersten Post, 2 für den zweiten Post und so weiter). | | $facebookItemLast | Boolean | Enthält `true`, falls es sich um den letzten Post des Facebook-Paragraphen handelt, sonst `false`. | ### Present-Variablen | Variable | Typ | Beschreibung | | ---------------------------- | ------- | ------------------------------------------------------------------------------------------------------------- | | $facebookTextPresent | Boolean | Enthält `true`, falls Inhalt für das Feld **Text** vorhanden ist, sonst `false`. | | $facebookAuthorPresent | Boolean | Enthält `true`, falls Inhalt für das Feld **Autor** vorhanden ist, sonst `false`. | | $facebookDatePresent | Boolean | Enthält `true`, falls Inhalt für das Feld **Datum** vorhanden ist, sonst `false`. | | $facebookLinkTextPresent | Boolean | Enthält `true`, falls im Bereich **Link** Inhalt für das Feld **Text** vorhanden ist, sonst `false`. | | $facebookLinkUrlPresent | Boolean | Enthält `true`, falls im Bereich **Link** Inhalt für das Feld **URL** vorhanden ist, sonst `false`. | | $facebookImageUrlPresent | Boolean | Enthält `true`, falls im Reiter **Bild** Inhalt für das Feld **Bild** vorhanden ist, sonst `false`. | | $facebookImageAltTextPresent | Boolean | Enthält `true`, falls im Reiter **Bild** Inhalt für das Feld **Alternativtext** vorhanden ist, sonst `false`. | | $facebookImageLinkPresent | Boolean | Enthält `true`, falls im Reiter **Bild** Inhalt für das Feld **Link** vorhanden ist, sonst `false`. | ### Value-Variablen | Variable | Typ | Beschreibung | | -------------------------- | ------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | $facebookTextValue | String | Enthält den Inhalt des Feldes **Text**. | | $facebookAuthorValue | String | Enthält den Inhalt des Feldes **Autor**. | | $facebookDateValue | String | Enthält den Inhalt des Feldes **Datum**. | | $facebookLinkTextValue | String | Enthält den Inhalt des Feldes **Text** aus dem Bereich **Link**. | | $facebookLinkUrlValue | String | Enthält den Inhalt des Feldes **URL** aus dem Bereich **Link**. | | $facebookImageUrlValue | String | Enthält die Bild-URL aus dem Reiter **Bild**. | | $facebookImageAltTextValue | String | Enthält den Inhalt des Feldes **Alternativtext** aus dem Reiter **Bild**. | | $facebookImageLinkValue | String | Enthält den Inhalt des Feldes **Link** aus dem Reiter **Bild**. | | $editBar | String | Setzt die Button-Leiste des Paragraphen ein. Dies wird beispielsweise bei der Umsetzung von nebeneinanderliegenden Posts benötigt, um die Button-Leiste in die Tabelle zu integrieren. Ist diese Variable nicht vorhanden, wird die Button-Leiste über den Artikel gesetzt. |