# Blöcke

Auf jeder Seite gibt es eine Anzahl an Inhaltsblöcken. Hier werden diese im Detail erklärt.

<table border="1" id="bkmrk-block-beschreibung-%C3%9C" style="border-collapse: collapse; width: 100%; height: 4703.05px;"><colgroup><col style="width: 30.4119%;"></col><col style="width: 69.5881%;"></col></colgroup><tbody><tr style="height: 29.7969px;"><td style="height: 29.7969px;">**Block**</td><td style="height: 29.7969px;">**Beschreibung**</td></tr><tr style="height: 238.797px;"><td style="height: 238.797px;">Überschrift mit optionaler Subline</td><td style="height: 238.797px;">Eine simple Überschrift + Subline, die z. B. über einen Block gesetzt werden kann, der keine eigene Überschrift beinhaltet.

<table border="1" style="border-collapse: collapse; width: 100.388%;"><colgroup><col style="width: 49.7423%;"></col><col style="width: 49.7423%;"></col></colgroup><tbody><tr><td>Überschrift:</td><td>Freitextfeld  
Die zu anzeigende Überschrift  
</td></tr><tr><td>Subline:</td><td>Freitextfeld  
Die zu anzeigende Subline  
</td></tr><tr><td>HTML-Anker:</td><td>Freitextfeld  
Die Anker-ID, zu der dann bspw. per Button gescrollt werden kann  
</td></tr></tbody></table>

</td></tr><tr style="height: 369.359px;"><td style="height: 369.359px;">Überschrift mit optionaler Subline und Bild</td><td style="height: 369.359px;">Auffällige Überschrift, die auf einem Bild prominent angezeigt wird. In der Regel ist dieser Block der erste Block auf jeder Seite.

<table border="1" style="border-collapse: collapse; width: 100.388%; height: 169.578px;"><colgroup><col style="width: 49.7423%;"></col><col style="width: 49.7423%;"></col></colgroup><tbody><tr style="height: 63.3906px;"><td style="height: 63.3906px;">Überschrift:</td><td style="height: 63.3906px;">Freitextfeld  
Die zu anzeigende Überschrift  
</td></tr><tr style="height: 46.5938px;"><td style="height: 46.5938px;">Subline:</td><td style="height: 46.5938px;">Freitextfeld  
Die zu anzeigende Subline  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Bild:</td><td style="height: 29.7969px;">Bildauswahlfeld  
Das zu anzeigende Bild. Im rechten Dropdown kann der Bildfokus ausgewählt werden. Wird das Bild zugeschnitten, ist dieser Teil im sichtbaren Bereich.  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Kein Abstand unter dem Header-Element:</td><td style="height: 29.7969px;">Schalterfeld  
Entfernt den Abstand unter dem Header, der global immer gleich ist  
</td></tr></tbody></table>

</td></tr><tr style="height: 283.594px;"><td style="height: 283.594px;">Text</td><td style="height: 283.594px;">Ein weißer Kasten der frei formatierbaren Text beinhaltet.

<table border="1" style="border-collapse: collapse; width: 100.388%; height: 139.781px;"><colgroup><col style="width: 49.7423%;"></col><col style="width: 49.7423%;"></col></colgroup><tbody><tr style="height: 80.1875px;"><td style="height: 80.1875px;">Wenig Padding:</td><td style="height: 80.1875px;">Schalterfeld  
Reduziert das horizontale Padding innerhalb des Textblocks  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Text:</td><td style="height: 29.7969px;">Text-Editor  
Der zu anzeigende Text  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Links:</td><td style="height: 29.7969px;">Block-Auswahl  
Eine zusätzliche Auswahl an Blöcken, die unterhalb des Texts angezeigt werden können. Siehe "Links" oder "Buttons" am Seitenende.  
</td></tr></tbody></table>

</td></tr><tr style="height: 854.297px;"><td style="height: 854.297px;">Zwei Spalten: Text und Bild</td><td style="height: 854.297px;">Ein weißer Kasten, der zweispaltigen Inhalt darstellt. Eine Spalte davon ist ein Bild oder ein Video, die andere Text.

<table border="1" style="border-collapse: collapse; width: 100.388%;"><colgroup><col style="width: 49.7423%;"></col><col style="width: 49.7423%;"></col></colgroup><tbody><tr><td>Bild:</td><td>Bildauswahlfeld  
Das zu anzeigende Bild. Im rechten Dropdown kann der Bildfokus ausgewählt werden. Wird das Bild zugeschnitten, ist dieser Teil im sichtbaren Bereich.  
</td></tr><tr><td>Youtube Video ID:</td><td>Freitextfeld  
Bettet statt des Bildes ein Youtube-Video ein. Nur die Video ID eintragen: https://www.youtube.com/watch  
?v=\[VIDEO-ID\] Das unter "Bild" ausgewählte Bild ersetzt das YouTube-Thumbnail.  
</td></tr><tr><td>Bildunterschrift:</td><td>Freitextfeld  
Diese wird unterhalb des Bildes im Artikel angezeigt.  
</td></tr><tr><td>Bild-Position</td><td>Auswahlfeld  
Bestimmt auf welcher Seite im Block das Bild relativ zum Text steht  
Optionen: Links, Rechts  
</td></tr><tr><td>Bild nicht zuschneiden</td><td>Schalterfeld  
Wenn aktiviert, wird das Bild im Original-Seitenverhältnis dargestellt und füllt die volle Breite aus  
</td></tr><tr><td>Bild-Format</td><td>Schalterfeld  
Legt fest, in welchem Format das Bild angezeigt werden soll. Für Landschafts-Format bitte "Bild nicht zuschneiden" aktivieren  
Optionen: Porträt Quadrat  
</td></tr><tr><td>Überschrift</td><td>Freitextfeld  
Die zu anzeigende Überschrift  
</td></tr><tr><td>Text:</td><td>Text-Editor  
Der zu anzeigende Text  
</td></tr><tr><td>Links:</td><td>Block-Auswahl  
Eine zusätzliche Auswahl an Blöcken, die unterhalb des Texts angezeigt werden können. Siehe "Links" oder "Buttons" am Seitenende.  
</td></tr></tbody></table>

</td></tr><tr style="height: 140.016px;"><td style="height: 140.016px;">Immobilien</td><td style="height: 140.016px;">Zeigt die ausgewählten Immobilien an.

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 29.7969px;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Immobilien</td><td style="height: 29.7969px;">Immobilienauswahlfeld  
Beim linken Feld (⌂) klicken und  
per Mehrfachauswahl die zu anzeigenden Immobilien selektieren.  
</td></tr></tbody></table>

</td></tr><tr style="height: 203.406px;"><td style="height: 203.406px;">Mitarbeiter</td><td style="height: 203.406px;">Zeigt die ausgewählten Mitarbeiter inklusive Adresse und Kontaktmöglichkeit an.

<table border="1" style="border-collapse: collapse; width: 100.189%;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr><td>Überschrift des Mitarbeiter- Blocks</td><td>Die zu anzeigende Überschrift über der Mitarbeiter-Liste</td></tr><tr><td>Mitarbeiter</td><td>Mitarbeiterauswahlfeld  
Beim linken Feld (+) klicken und "Personen" auswählen.  
Anschließend per Mehrfachauswahl die zu anzeigenden Mitarbeiter </td></tr></tbody></table>

</td></tr><tr style="height: 899.094px;"><td style="height: 899.094px;">Download-Liste</td><td style="height: 899.094px;">Eine Liste an zum Download bereitgestellten Dateien

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 772.078px;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr style="height: 96.9844px;"><td style="height: 96.9844px;">Icon</td><td style="height: 96.9844px;">Bildauswahlfeld  
Das zu anzeigende Icon. Im Bildauswahlfenster zu RHEINCARGO/Bilder/Icons navigieren und eines selektieren.  
</td></tr><tr style="height: 80.1875px;"><td style="height: 80.1875px;">  
Icon-Position  
</td><td style="height: 80.1875px;">Auswahlfeld  
Bestimmt auf welcher Seite im Block das Icon relativ zum Text steht  
Optionen: Links, Rechts  
</td></tr><tr style="height: 46.5938px;"><td style="height: 46.5938px;">Überschrift</td><td style="height: 46.5938px;">Freitextfeld  
Die zu anzeigende Überschrift  
</td></tr><tr style="height: 46.5938px;"><td style="height: 46.5938px;">Text</td><td style="height: 46.5938px;">Text-Editor  
Der zu anzeigende Text  
</td></tr><tr style="height: 63.3906px;"><td style="height: 63.3906px;">Download-Liste</td><td style="height: 63.3906px;">Dokumentauswahlfeld  
Die zum Download verfügbaren Dokumente selektieren  
</td></tr><tr style="height: 130.578px;"><td style="height: 130.578px;">Interner Link</td><td style="height: 130.578px;">Seitenauswahlfeld  
Fügt einen Button unterhalb des Texts des Download-Abschnitts ein. Verlinkt auf eine Seite innerhalb des Systems bzw.  
RheinCargo-Webspace. Wird stets im gleichen Fenster / Tab geöffnet.  
</td></tr><tr style="height: 248.156px;"><td style="height: 248.156px;">Externer Link</td><td style="height: 248.156px;">URL-Feld  
Fügt einen Button unterhalb des Texts des Download-Abschnitts ein. Beliebiges Linkziel. Das Protokoll kann separat angegeben werden, sollte in der Regel aber "https://" lauten.  
Externe Links werden ausschließlich in einem neuen Fenster / Tab geöffnet.  
Ein externer Link wird dem internen stets vorgezogen, das heißt ein Button kann nur auf eines der Ziele verweisen und verlinkt, wenn sowohl "Interner" als auch "Externer" Link angegeben sind, immer auf den externen.  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Link-Beschriftung</td><td style="height: 29.7969px;">Freitextfeld  
Wenn nicht angegeben, zeigt als Button-Beschriftung "Mehr Infos" an.  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">HTML-Anker  
</td><td style="height: 29.7969px;">Freitextfeld  
Der Anker, zu dem auf der verlinkten Seite gesprungen werden soll.  
</td></tr></tbody></table>

</td></tr><tr style="height: 253.797px;"><td style="height: 253.797px;">Youtube-Video einbetten</td><td style="height: 253.797px;">Fügt ein großformatiges Youtube-Video ein, das per Klick abgespielt werden kann.

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 160.375px;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr style="height: 130.578px;"><td style="height: 130.578px;">Youtube Video ID</td><td style="height: 130.578px;">Freitextfeld  
Bettet statt des Bildes ein Youtube-Video ein. Nur die Video ID eintragen: https://www.youtube.com/watch  
?v=\[VIDEO-ID\] Das unter "Bild" ausgewählte Bild ersetzt das YouTube-Thumbnail.  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Vorschau-Bild</td><td style="height: 29.7969px;">Bildauswahlfeld  
Wenn kein Bild ausgewählt, wird das Youtube-Thumbnail angezeigt  
</td></tr></tbody></table>

</td></tr><tr style="height: 554.359px;"><td style="height: 554.359px;">Galerie</td><td style="height: 554.359px;">Stellt eine Auswahl an Bildern als interaktive Galerie dar.

<table border="1" style="border-collapse: collapse; width: 100.189%;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr><td>Bilder</td><td>Bildauswahlfeld  
Die in der Galerie zu anzeigenden Bilder. Zeigt in der Detailansicht eines angeklickten Galerie-Bildes dessen Titel am unteren Bildschirmrand fest.  
Dies kann im Bild selbst unter "Informationen und Taxonomien" individuell geändert werden.  
</td></tr><tr><td>Spezielle CSS-Klasse</td><td>Freitextfeld  
Hier können zusätzliche CSS- Klassen angegeben werden, die beeinflussen, wie die Galerie angezeigt werden soll.  
Unterstützt:

<table border="1" style="border-collapse: collapse; width: 100.203%;"><colgroup><col style="width: 28.6902%;"></col><col style="width: 71.1194%;"></col></colgroup><tbody><tr><td>portrait</td><td>Zeigt die Bilder im Portraitformat an und stellt die Bild- Beschreibung darunter dar.  
Diese kann im  
portrait  
Bild selbst  
unter "Informationen und Taxonomien" individuell geändert werden.  
</td></tr></tbody></table>

</td></tr></tbody></table>

</td></tr><tr style="height: 184.797px;"><td style="height: 184.797px;">Hafen-Slider</td><td style="height: 184.797px;">Stellt einen Slider dar, der durch die ausgewählten Bilder wechselt.  
Der Titel und die Beschreibung werden aus dem Bild gezogen. Dies kann im Bild selbst unter "Informationen und Taxonomien" individuell geändert werden.

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 29.7969px;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Bilder</td><td style="height: 29.7969px;">Die zu anzeigenden Bilder der Häfen. Metadaten wie Bildtitel, Bilder und -Beschreibung werden für  
den Slider verwendet.  
</td></tr></tbody></table>

</td></tr><tr style="height: 483.156px;"><td style="height: 483.156px;">Teaser</td><td style="height: 483.156px;">Stellt eine Liste an Teaserblöcken dar, die zu beliebigen Seiten auf RheinCargo verlinken können.

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 316.953px;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr style="height: 96.9844px;"><td style="height: 96.9844px;">Icon</td><td style="height: 96.9844px;">Bildauswahlfeld  
Das zu anzeigende Icon. Im Bildauswahlfenster zu RHEINCARGO/Bilder/Icons navigieren und eines selektieren.  
</td></tr><tr style="height: 130.578px;"><td style="height: 130.578px;">Interner Link</td><td style="height: 130.578px;">Seitenauswahlfeld  
Fügt einen Button unterhalb des Texts des Download-Abschnitts ein. Verlinkt auf eine Seite innerhalb des Systems bzw.  
RheinCargo-Webspace. Wird stets im gleichen Fenster / Tab geöffnet.  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Teaser-Titel</td><td style="height: 29.7969px;">Freitextfeld  
Der Titel des Teasers  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Link-Beschriftung</td><td style="height: 29.7969px;">Freitextfeld  
Wenn nicht angegeben, zeigt "Mehr Infos" an.  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">HTML-Ziel-Anker</td><td style="height: 29.7969px;">Freitextfeld  
Falls zu einem Anker auf der Zielseite gescrollt werden soll, </td></tr></tbody></table>

</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Vertikaler Abstand</td><td style="height: 29.7969px;">Fügt zusätzlichen vertikalen Abstand ein, standardmößig 30px.

<table border="1" style="border-collapse: collapse; width: 100.189%;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr><td>Höhe des Abstands in px</td><td>Freitextfeld  
Überschreibt die 30px-Höhe mit  
dem hier angegebenen Wert.  
Bitte "px" dahinter angeben, also 100px, 250px etc.  
</td></tr></tbody></table>

</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Zitate</td><td style="height: 29.7969px;">Stellt einen zweispaltigen Abschnitt mit Bild rechts und 2 Zitaten links dar.

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 637.703px;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr style="height: 113.781px;"><td style="height: 113.781px;">Bild</td><td style="height: 113.781px;">Bildauswahlfeld  
Das zu anzeigende Bild. Im rechten Dropdown kann der Bildfokus ausgewählt werden. Wird das Bild zugeschnitten, ist dieser Teil im sichtbaren Bereich.  
</td></tr><tr style="height: 80.1875px;"><td style="height: 80.1875px;">Bild nicht zuschneiden</td><td style="height: 80.1875px;">Schalterfeld  
Wenn aktiviert, wird das Bild im Original-Seitenverhältnis dargestellt, füllt die volle Breite aus  
</td></tr><tr style="height: 113.781px;"><td style="height: 113.781px;">Bild-Format</td><td style="height: 113.781px;">Schalterfeld  
Legt fest, in welchem Format das Bild angezeigt werden soll. Für Landschafts-Format bitte "Bild nicht zuschneiden" aktivieren  
Optionen: Porträt Quadrat  
</td></tr><tr style="height: 46.5938px;"><td style="height: 46.5938px;">Zitat 1</td><td style="height: 46.5938px;">Freitextfeld  
Das zu anzeigende Zitat  
</td></tr><tr style="height: 63.3906px;"><td style="height: 63.3906px;">Zitat 1 Text</td><td style="height: 63.3906px;">Text-Editor  
Text, der unterhalb des Zitats angezeigt werden soll  
</td></tr><tr style="height: 80.1875px;"><td style="height: 80.1875px;">Zitat 1 Links</td><td style="height: 80.1875px;">Block-Auswahl  
Eine zusätzliche Auswahl an Blöcken, die unterhalb des Texts angezeigt werden können. Siehe "Links" oder "Buttons".  
</td></tr><tr style="height: 46.5938px;"><td style="height: 46.5938px;">Zitat 2</td><td style="height: 46.5938px;">Freitextfeld  
Das zu anzeigende Zitat  
</td></tr><tr style="height: 63.3906px;"><td style="height: 63.3906px;">Zitat 2 Text</td><td style="height: 63.3906px;">Text-Editor  
Text, der unterhalb des Zitats angezeigt werden soll  
</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Zitat 2 Links</td><td style="height: 29.7969px;">Block-Auswahl  
Eine zusätzliche Auswahl an Blöcken, die unterhalb des Texts angezeigt werden können. Siehe "Links" oder "Buttons".</td></tr></tbody></table>

</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Inhaltsverzeichnis</td><td style="height: 29.7969px;">Stellt ein Inhaltsverzeichnis dar, das alle "Überschrift mit optionaler Subline" der Seite auflistet und zu denen einzeln gescrollt werden kann. Voraussetzung dafür ist, dass bei jedem "Überschrift mit optionaler Subline" Block das Feld "HTML-Anker" ausgefüllt ist.

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 29.7969px;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Ignorieren</td><td style="height: 29.7969px;">Dieses Feld bitte ignorieren</td></tr></tbody></table>

</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">News Liste</td><td style="height: 29.7969px;">Stellt alle veröffentlichten News in einer paginierten Liste mit Bild, Titel, Kurzbeschreibung und Weiterlesen-Button an.

<table border="1" style="border-collapse: collapse; width: 100.189%;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr><td>News Liste</td><td>Newsauswahlfeld  
Die zu anzeigenden News  
Beiträge. Bisher keine Funktion. Der Block allein sorgt dafür, dass die News angezeigt werden.  
</td></tr></tbody></table>

</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Formular</td><td style="height: 29.7969px;">Stellt ein Formular dar, das unter "Formulare" im Backend erstellt werden kann.

<table border="1" style="border-collapse: collapse; width: 100.189%;"><colgroup><col style="width: 49.8168%;"></col><col style="width: 49.8168%;"></col></colgroup><tbody><tr><td>Text</td><td>Freitextfeld  
Der zu anzeigende Text oberhalb des Formulars.  
</td></tr><tr><td>Formular  
</td><td>Formularauswahlfeld  
Das zu anzeigende Formular.  
</td></tr></tbody></table>

</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Links Buttons</td><td style="height: 29.7969px;">Stellt unterhalb eines Texts oder Inhalts in einem Block  
zusätzliche Inhalte dar. Es können beliebig viele Inhalte  
aneinandergereiht werden.

<table border="1" style="border-collapse: collapse; width: 100.189%; height: 59.5938px;"><colgroup><col style="width: 16.7609%;"></col><col style="width: 83.0613%;"></col></colgroup><tbody><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Button</td><td style="height: 29.7969px;">Fügt einen Button ein, der auf ein Ziel verlinkt.

<table border="1" style="border-collapse: collapse; width: 100.203%;"><colgroup><col style="width: 49.8039%;"></col><col style="width: 49.8039%;"></col></colgroup><tbody><tr><td>Interner Link</td><td>Seitenauswahlfeld  
Fügt einen Button  
unterhalb des Texts des  
Download Abschnitts ein.  
Verlinkt auf eine Seite  
innerhalb des Systems bzw.  
RheinCargo Webspace.  
Wird stets im gleichen Fenster / Tab geöffnet.</td></tr><tr><td>Externer Link</td><td>URL-Feld  
Fügt einen Button  
unterhalb des Texts des Download- Abschnitts ein. Beliebiges Linkziel. Das Protokoll kann separat angegeben werden, sollte in der Regel aber "https://" lauten.  
Externe Links werden ausschließlich in einem neuen Fenster / Tab geöffnet.  
Ein externer Link wird dem internen stets vorgezogen, das heißt ein Button kann nur auf eines der Ziele verweisen und verlinkt, wenn sowohl "Interner" als auch "Externer" Link angegeben sind, immer auf den externen.  
</td></tr><tr><td>Link- Beschriftung</td><td>Freitextfeld  
Wenn nicht angegeben, zeigt als Button- Beschriftung "Mehr Infos" an.

</td></tr></tbody></table>

</td></tr><tr style="height: 29.7969px;"><td style="height: 29.7969px;">Media</td><td style="height: 29.7969px;"> Fügt ein Bild ein

<table border="1" style="border-collapse: collapse; width: 100.118%;"><colgroup><col style="width: 50%;"></col><col style="width: 50%;"></col></colgroup><tbody><tr><td>Medienauswahl</td><td>Bildauswahlfeld  
Das zu anzeigende Bild.</td></tr></tbody></table>

</td></tr></tbody></table>

</td></tr></tbody></table>