Cheat Sheets

Kurzanleitungen 

Ein Bild-Modul einfügen

1. Gehe auf die gewünschte Seite und öffne den Divi Builder

Auf jeder Seite sind die verschiedenen Elemente:

  • Abschnitte = Sektion (in blau, globale Sektion olivgrün)
  • Zeile mit Spalten (in grün)
  • und Module (in schwarz) hierarchisch ineinander verschachtelt angeordnet.

__________________

2. Füge ein neues Modul hinzu.

> Am einfachsten ist es, ein bestehendes Modul zu kopieren. Dann brauchst du keine weiteren Designeinstellungen vornehmen, da diese mit übernommen werden. Du kannst es dorthin ziehen, wo du es brauchst.

> Oder füge ein neues Modul (innerhalb einer Zeile, die sich wiederum innerhalb eines Abschnitts befindet)  durch Klicken auf den schwarzen Kreis mit + hinzu.

> Suche das Bild-Modul in der Liste und klicke darauf, um es der Seite hinzuzufügen. Die Modulliste ist durchsuchbar, du kannst auch das Wort “Bild” eingeben und dann die Eingabetaste drücken, um das Bildmodul automatisch zu finden und hinzuzufügen.

3. Sobald das Modul hinzugefügt wurde, öffnet sich das Fenster mit den Optionen für das Moduls, unterteilt in drei Hauptgruppen: Inhalt, Design und Erweitert. 

__________________

4. Füge die Inhalte (Bild, Link) hinzu

“Inhalt”

Hier befinden sich alle Inhaltselemente des Moduls, z. B. Text, Bilder und Symbole.

Inhalt > Bild

Klicke auf das kleine Steuerrad. Wähle ein Bild aus der WordPress-Medienbibliothek aus und laden es hoch. Wenn das Bild sich noch nicht in der Medienbibliothek befindet, kannst du es mit Drag and Drop von deinem Computer in die Medienbibliothek hochladen.

Bilder werden immer linksbündig in ihren Spalten angezeigt und erstrecken sich über die gesamte Breite der Spalte. Die Höhe des Bildes wird durch das Seitenverhältnis des Originalbildes bestimmt.

Inhalt > Link

Inhalt > Link > In Lightbox öffnen

Hier kannst du auswählen, ob das Bild beim Klicken in einer Lightbox geöffnet wird oder nicht. Wenn diese Option aktiviert ist, wird das Bild in voller Größe vergrößert, wenn man in das Fenster klickt.

Inhalt > Link > Link URL für das Bild

Möchtest du das Bild in ein Link verwandeln, dann gib hier eine gültige Web-URL in dieses Feld ein.

Inhalt > Link > Ziel für die Bild URL

Hier kannst du wählen, ob das Link in einem neuen Fenster geöffnet werden soll.

__________________

5. “Design”

Auf der Registerkarte Design  befinden sich die Gestaltungsoptionen für das Modul, z. B. Schriftarten, Farben, Größen und Abstände. Hier läßt sich das Aussehen des Moduls ändern. Jedes Divi-Modul verfügt über eine lange Liste von Designeinstellungen.

Wenn du eine fertiges Modul kopiert oder aus der Bibliothek übernommen hast, brauchst du hier KEINE Einstellungen zu machen.

__________________

6. Füge die richtigen Attribute für das Bild ein 

Öffne die Registerkarte “Erweitert” mit weitere Optionen, die für Webdesigner hilfreich sein können.

Erweitert > Attribute

Für SEO Zwecke ist es wichtig, hier die richtigen Attribute=Tags für das Bild einzufügen, damit es von Suchmaschinen gefunden und erkannt werden kann.

Erweitert > Attribute > Alternativer Bildtext:

füge eine kurze Beschreibung des Bildes hinzu mit allen erforderlichen Informationen, falls das Bild nicht geladen werden kann. Z.B. “Landschaft mit grünem Apfelbaum vor blauem Himmel mit spielenden Kindern” Dies dient auch dem Lesen durch Suchmaschinen.

Erweitert > Attribute > Bildtitel:

Füge den Titel des Bildes, eventuell auch Namen des Autors  ein: z.B. “Apfelbaum von Lieschen Müller, 2018”

Erweitert > Attribute > Sichtbarkeit

Mit dieser Option kannst du steuern, auf welchen Geräten das Modul angezeigt wird. Du kannst das Modul auf Tablets, Smartphones oder Desktop-Computern einzeln deaktivieren.

__________________

7. Vergiss nicht, alles zu sichern:

Klicke auf den violetten Kreis am unteren Rand der Seite, damit sich das Menü öffnet

> Klicke “Speichern” im grünen Kästchen rechts unten

Posting a Blog Post With Your Predefined Layout

 

In your Dashboard

1. Add new post

2. Add a title in the large field

3. In the right sidebar: Permalink: check that the Permalink URL corresponds with the title you want or change it

4. In the right sidebar: Categories: Choose the category

5. In the right sidebar: Featured Image: Upload featured image (This image will feature in the Weblog Grid Layout)

6. in the right sidebar Divi Page Settings change the following settings:
Page Layout > no sidebar
Post Title> hide

7. On the top of the right Sidebar: Save as draft, Publish or set publishing Date in the future

8. Click purple button: USE DIVI BUILDER

9. Choose middle section: CHOSE A PREMADE LAYOUT

10. Choose middle tab: YOUR SAVED LAYOUTS

11. Choose BLOG POST TEMPLATE

12. Your template will open. You can then

– Change Image

– Change Text

13. SAVE and PUBLISH

 

DIVI Basics Videos

I recomend to watch these videos, in order to get a basic overview of howw to use the DIVI Builder.

Getting Started with the Divi Builder

The Divi Library Tutorial

Posting new Images in Picture Gallery

PREPARE IMAGES
make sure they are 300 px wide, 72 dpi
(records exactly 300×300)
in jpg format.
1. UPLOAD TO MEDIA LIBRARY
> Login to WordPress
> Dashboard> Media> Go to media Library
> Add new: add from computer or drag and drop drop files
2. UPLOAD TO the PAGE with Divi
> Dashboard> Pages > My Vinyl Collection / What I am Reading
> Hover over chosen page: > Click Edit
> Click Edit with Divi Builder
> Hover over Image Gallery > Click gear icon on black menu for modules
> Gallery Setting will open in Pop Up Window
> Content Tab> Scroll to bottom of Gallery > Click grey + plus Icon
> This opens the view of the Media Library
> Add a TICK to new image on top right corner of the image, you can choose multiple images
> Click SELECT (Blue button on the bottom right)
> Click green TICK on bottom right in Gallery Setting pop Up
> Open PURPLE PAGE MENU at the bottom of screen (purple circle with three dots)
> Click SAVE in green BUTTON to the bottom right of the screen

 

 

DIVI Basics Videos

I recomend to watch these videos, in order to get a basic overview of howw to use the DIVI Builder.

Getting Started with the Divi Builder

The Divi Library Tutorial

Kontakt

 

Sigrid Jones

Haidgasse 7/1

1020 Wien

office (at) bikum.at

0699 1952 1260

Sind Sie an Zusammenarbeit interessiert ?

Haben Sie Fragen? Schicken Sie mir eine Nachricht per SMS, via WhatsApp oder email, oder benutzen Sie das Eingabeformular. Ich melde mich bei Ihnen zurück, so rasch es mir möglich ist.

Schreiben Sie mir!

4 + 9 =