YoothemePro Kurzanleitung

Seite 1 von 2

Hier eine kleine Kurzanleitung zum Yootheme Builder.

Der Yootheme Builder erm├Âglicht es Inhalte auf der Website schnell und einfach anzupassen.

Den Builder ├Âffnen

Zu Starten des Builders gibt es zwei M├Âglichkeiten:

  1. Man ├Âffnet im Bereich ┬źInhalt -> Beitr├Ąge┬╗ einen entsprechenden Artikel welcher schon mit dem Builder erstellt wurde.
  2. Der zweite (meist besser Weg) ist die es den Builder ├╝ber ┬źErweiterungen -> Templates┬╗ zu starten.

Arbeiten mit dem Builder

Grunds├Ątzlich ist der Builder in zwei Spalten getrennt. Links sehen wir alle Inhalte (Bausteine) die auf der Seite verwendet werden und rechts die Vorschau der Website.

Achtung!!! Alle Aktionen zum Bearbeiten erstellen und Einstellen der Inhalte werden ├╝ber die linke Spalte vorgenommen.

Neues Layout

Um ein neues Layout von Grund auf zu erstellen, klickt man links auf die Schaltfl├Ąche "Neues Layout" und beginnt, Abschnitte und Elemente hinzuzuf├╝gen. Alternativ kann man ein bestehendes Layout aus der Layoutbibliothek importieren, indem man auf die Schaltfl├Ąche "Bibliothek" klickt.

Jedes Mal, wenn ein Layout ge├Ąndert wird, erscheinen in der oberen rechten Ecke die Schaltfl├Ąchen Layout speichern und Abbrechen. Wenn man auf Abbrechen klickt oder den Page Builder verl├Ąsst, werden alle Layout├Ąnderungen seit dem letzten Speichern verworfen.

Aufbau des Layouts

Ein Layout ist in drei verschiedene Bausteine organisiert.

  1. Sektion: Sektionen gruppieren Inhalte in gr├Â├čeren visuellen Bl├Âcken. Sie enthalten eine oder mehrere Zeilen.
  2. Zeilen und Spalten: Zeilen bestehen aus einer oder mehreren Spalten, die wiederum Elemente enthalten.
  3. Elemente: Die Elemente stellen den eigentlichen Inhalt dar.

Layout-Struktur

Ein neues Layout beginnt immer mit einer Sektion, in der eine Zeile mit einer leeren Spalte enthalten ist. Um das Layout entsprechend zu Bearbeiten und zu erweitern muss wie folgt vorgegangen werden:

  1. Mit einem Klick auf das "+" in der leeren Spalte kann man nun ein Element hinzuf├╝gen.
  2. Um eine neue Zeile hinzuzuf├╝gen f├Ąhrt man mit der Maus ├╝ber eine Zeile und klickt auf das "+" rechts unterhalb der bestehenden Zeile. Der Klick f├╝gt eine neue Zeile direkt unterhalb ein.
  3. Um eine neue Sektion einzuf├╝gen muss man mit der Maus ├╝ber eine Sektion fahren und dann das kleine "+" auf der linken Seite w├Ąhlen. Die Sektion wird dann direkt darunter eingef├╝gt.
  4. Per Drag & Drop lassen sich alle Elemente entsprechend verschieben.

Die wichtigsten Bestandteile

Titel

Werden in Yootheme als Headlines bezeichnet, wenn Sie nun im Builder ├╝ber eine Headline mit Ihrer Maus fahren sehen Sie rechts blau umrandet welche Headline Sie gerade "anfahren".

Klickt man nun auf die Box mit dem Namen Headline. ├ľffnet sich ein kleiner Editor in dem der entsprechende Text eingef├╝gt werden kann. Wichtig ist hier, dass man beim Einf├╝gen per "Copy/Paste" die Textformatierungen entfernt.

Haben Sie Änderungen vorgenommen gehen Sie zurück in den Builder Hauptmenu und klicken auf Save Page.

Achtung! Da der Builder ein Server basierter dienst ist kann es einen Moment dauern bis der Save Button erscheint und Änderungen registriert werden. 

Text

Text verh├Ąlt sich genau gleich wie ein Titel.

Image

Wichtig ist das alle Bilder die richtige Gr├Âsse, Format und Hochaufl├Âsend sind.

Um ein Bild einzuf├╝gen klicken wir nun auf select Image:
Wenn man "select Imag" angelkickt ├ľffnet sich ein Popup mit allen Dateien und Ordnern + der M├Âglichkeit neue Ordner anzulegen, Dateien hochzuladen und einer Suchfunktion die die Datei/Ordnernamen einschlie├čt.

Wenn man nun ein Bild ausw├Ąhlt und die Auswahl mit ┬źSelect┬╗ (unten rechts) best├Ątigt sieht man das ausgew├Ąhlte Bild in der Vorschau auf der Website.

Overlay-Element

Das Overlay-Element zeigt ein Bild mit einem Inhalts-Overlay an. Es hat ein Inhaltsfeld f├╝r Titel, Meta, Beschreibung, Bild und Link. Dies ist sehr n├╝tzlich, um Inhalte in einem Element zu gruppieren, anstatt separate Elemente zu verwenden. Wenn Sie mehrere Overlays nebeneinander haben, verwenden Sie das Gallery-Element, das mehrere Elemente anzeigen kann.

Panel-Element

Das Panel-Element zeigt ein Panel oder eine Karte mit Text und Bild an. Es hat ein Inhaltsfeld f├╝r Titel, Meta, Beschreibung, Bild und Link. Dies ist sehr n├╝tzlich, um Inhalte in einem Element zu gruppieren, anstatt separate Elemente zu verwenden. Wenn Sie mehrere Panels nebeneinander haben, verwenden Sie das Grid-Element, das mehrere Elemente anzeigen kann.

Galerie-Element

Das Gallery-Element zeigt mehrere Overlay-Elemente innerhalb eines Gitters an. Standardm├Ą├čig werden die Links in einem Fenster ge├Âffnet. Alternativ k├Ânnen sie in einer Lightbox ge├Âffnet werden, die auch das Navigieren zwischen den Elementen erm├Âglicht.

Grid-Element

Das Grid-Element zeigt mehrere Panel-Elemente innerhalb eines Gitters an. Standardm├Ą├čig werden die Links in einem Fenster ge├Âffnet. Alternativ k├Ânnen sie in einem Leuchtkasten ge├Âffnet werden, der auch das Navigieren zwischen den Elementen erm├Âglicht.

Tutorials
Seite

Weiterf├╝hrende Informationen

Unsere Kompetenzen


Alexander┬┤s Webdesign

Mosebergstra├če 1
37441, Bad Sachsa

+49-(0)-5523-952 89 98
+49-(0)-160-932 435 66
Diese E-Mail-Adresse ist vor Spambots gesch├╝tzt! Zur Anzeige muss JavaScript eingeschaltet sein.

Montag - Freitag 09:00 - 18:00 Uhr

Kundenstimmen

So bewerten uns unsere Kunden.

4.8 / 5 Sternen

4.8 / 5 bei 108 Stimmen

Alle Bewertungen


  • Folgen Sie uns

Copyright © 2003 - 2022 Alexander┬┤s Webdesign - Alle Rechte vorbehalten.