Mit dem Gutenberg-Block Infobox Carousel werden verschiedene Informationen in einer Kombination aus Bild, Text und einem Call-To-Action-Button präsentiert. Dabei kann es sich zum Beispiel um verschiedene Themen oder Angebote handeln.
Das Infobox Carousel einfügen #
Du findest diesen Block im Bereich “Magnesites Blocks” in der Liste der Gutenberg-Blöcke unter Infobox Carousel. Wie Du ihn einfügst und wie Du mit Gutenberg-Blöcken umgehst, kannst Du in diesem Handbuch-Eintrag nachlesen.
Titel des Infobox Carousels vergeben #
In das oberste Eingabefeld ➔“Titel” schreibst Du eine Überschrift. Diese sollte kurz und bündig aussagen, worum es inhaltlich geht.
Infoboxen erstellen, löschen oder ordnen #
Per Klick auf das Eingabefeld ➔“Add Infobox” lassen sich einzelne Infoboxen erstellen. Die Anzahl ist nicht begrenzt. Bei mindestens fünf Infoboxen generiert das System automatisch eine Slideshow, sodass sich Webseitenbesucher durch das Karussell klicken können. Einzelne Boxen lassen sich über den kleinen Button ➔ “-” rechts neben der jeweiligen Infobox löschen.
Die Anordnung der einzelnen Infoboxen bestimmst Du, indem Du neue Positionen zuweist. Fahre dafür mit dem Curser über die Nummer links neben der Infobox. Halte den Mauszeiger dann gedrückt und bewege so die Box per Drag & Drop – Funktion nach oben oder unten.
Bild laden #
Per Klick auf den Button ➔“Bild hinzufügen” öffnet sich Deine Mediathek, aus der Du Bilder in den Gutenberg-Block laden kannst. Jedes verwendete Bild muss in der Mediathek liegen. Wie Du mit der Mediathek arbeitest, darüber erfährst Du mehr in diesem Handbuch-Eintrag.
Hast Du keine Bilder hinzugefügt, wird automatisch das in den Einstellungen hinterlegte Platzhalterbild in der Infobox angezeigt. Am besten eignen sich für das Infobox Carousel quadratische Bilder im Seitenverhältnis 1:1.
Texte anpassen #
Passe die Texte der Infobox an und schreibe in die Eingabefelder ➔“Title” und ➔“Description”, worum es inhaltlich geht. Je kürzer und prägnanter, desto besser.
Button anpassen #
Passe den Button an, indem Du in das Eingabefeld ➔“Button Text” einen eindeutigen Aufruf zu einer Handlung schreibst. Call-To-Actions können sein: “Mehr ansehen”, “Termin buchen” oder “Jetzt klicken”.
Bestimme mit dem Eingabefeld ➔“Button URL” abschließend, auf welches Ziel Du Nutzer nach dem Klick leitest. Für eine funktionierende Weiterleitung muss der vollständige Link angegeben sein (also inklusive “https://” oder “http://”).
