Shortcode Grid

1. In einer Reihe sollte immer die volle Breite genutzt werden. Nutzt also bitte Kombinationen wie 2/3 + 1/3 oder 1/5 + 1/5 + 3/5. Bitte beachtet, dass die letzte Spalte immer den Zusatz (letztes oder leer) haben sollte.

   Schauen wir uns das in der Praxis an:
   Wählt die Spalte mit der Nummer 1 und gleich danach die Spalte mit der Nummer 2.

   Diese Codes werden, wenn ausgewählt, im Textfeld wie folgt angezeigt:
   

2. Nun wollen wir diese Spalten mit Inhalt füllen. Beachtet, dass die Shortcodes einem bestimmten Aufbau folgen: zwei Klammern mit dem gleichen Text, wobei der zweite einen Schrägstrich enthält. Beispiel: [shortcode][/shortcode]
   Dieser Strich innerhalb des zweiten Shortcodes bedeutet, dass der gesamte Inhalt innerhalb dieses Codes stehen muss, denn durch ihn wird die Anordnung der Spalten auf eurer Website bestimmt. Im Screenshot seht ihr ein Beispiel dafür, wo euer Inhalt stehen muss:
   
3. Werdet kreativ!
   Innerhalb von Textblöcken könnt ihr mit Überschriften und Absätzen arbeiten. Um dieses Beispiel etwas anschaulicher zu gestalten, wählen wir den gesamten Text von Inhalt 1 in H3 aus. Markiert dazu NUR den betreffenden Text, klickt auf „Absatz“ und wählt „Überschrift 3“. Geht zur rechten Seite des Bildschirms und klickt auf „Vorschau“, um eine Vorschau eures Entwurfs zu sehen. Es sollte ungefähr so aussehen wie auf diesem Beispiel:
   

1. Wir können nicht nur mit Text arbeiten, sondern auch Bilder hinzufügen. Schaut euch dieses Beispiel an:
   

   Um mit Bildern zu arbeiten, fügt ihr im Textblock ein Bild innerhalb der von euch hinzugefügten Spalte ein. Wählt dazu die Spalten aus, wie in Thema 5 beschrieben, und klickt dann auf „Dateien hinzufügen“, um euer Bild auszuwählen.
   

2. Wenn ihr euer Bild hinzugefügt habt, habt ihr folgende Möglichkeiten. Erstens könnt ihr euer Bild je nach Bedarf verkleinern oder vergrößern. Wählt einfach das Bild aus, und es wird angezeigt:
   

   Klickt auf den Stift, um die Seite mit den Bildänderungen aufzurufen. Nun könnt ihr die Größe eures Bildes auswählen.
   

   Um euer Bild zu positionieren, wählt ihr das entsprechende Symbol für die gewünschte Ausrichtung aus:
   
   Dort könnt ihr im Textblock alle notwendigen Änderungen vornehmen. Wir empfehlen, die Seite nach jeder Änderung anzusehen, um zu prüfen, ob ihr das erwartete Ergebnis erhaltet.

3. Jetzt ist der richtige Zeitpunkt, kreativ zu sein. Um euch zu helfen, haben wir hier einen Link mit mehreren Beispielen von Kreationen mit den Shortcodes für Spalten erstellt.
4. Vergesst am Ende nicht, eure Seite zu speichern! Klickt in der oberen Ecke des Bildschirms auf „Aktualisieren“.

1. Wenn ihr auf die Shortcodes klickt, werdet ihr sehen, dass einige Spalten den Zusatz „leer“ haben. Diese Spalten sind zu verwenden, wenn die Spalte leer bleiben soll.
   
2. Dies könnte zum Beispiel so eingesetzt werden:
   
3. Jetzt müsst ihr den Inhalt nur noch in die Spalte einfügen, in der er erscheinen soll.
   

Wir haben hier einige Codes zum Herunterladen für euch bereitgestellt, damit ihr das Design kopieren könnt, falls ihr das gleiche Layout wie im Beispiel verwenden möchtet.

Zum Kopieren klickt ihr einfach auf den Button, woraufhin sich eine Seite mit Codes öffnet. Kopiert einfach den gesamten Code und fügt ihn in euer Textfeld ein. Aber Vorsicht: Das Textfeld muss sich in der Option „Text“ befinden!

Nachdem ihr den Code eingefügt habt, klickt auf „Visuell“ und ersetzt hier die Beispieltexte durch eure eigenen Inhalte.

Wählt das Beispiel aus und klickt auf „Download“.

Beispiel 1

Beispiel 2

Beispiel 3

Beispiel 4

Beispiel 5

Beispiel 6