Layouts

In dem Layout-Menü können Sie durch das Hochladen von Style Sheets oder JavaScript-Dateien Einfluss auf das Layout nehmen. Das generelle Layout Ihrer Webseiten können Sie jedoch nicht über das CMS beeinflussen. Sollten Sie grundlegende Layout-Änderungen beabsichtigen, dann kommen Sie gerne jederzeit auf uns zu.

In folgendem zeigen wir Ihnen, wie Sie solche Layout-Dateien hochladen und erklären, was Layout-Bereiche und -Klassen sind.

Schritt 1: Zum Layout-Menü navigieren

Um Layout-Dateien hochzuladen, navigieren Sie zuerst zum Layout-Menü.

Dieses erreichen Sie, indem Sie mit der Maus über die Einstellungen, also das Zahnrad oben rechts, fahren und dort auf den Punkt „Layouts“ klicken.

Schon sollten Sie das Layout-Menü erreicht haben. Dies erkennen Sie an der Überschrift "Layouts" in grün.

Schritt 2: Layout bearbeiten

Im Layout-Menü sehen Sie nun mittig eine Liste der bereits erstellten Layouts. Durch Doppelklick auf das jeweilige Layout kann dieses bearbeitet werden.

In unserem Beispiel wählen wir das Layout "Endkundenwebshop" und öffnen die Bearbeitung durch Doppelklick.

Dadurch sollte sich ein Fenster mit der Überschrift "Layout "Endkundenshop" bearbeiten" öffnen. Bei dem Titel "Endkundenshop" handelt es sich dabei um den Namen des ausgewählten Layouts. Dort können die bereits festgelegten Layout-Einstellungen eingesehen und geändert werden.

Schritt 3: Layout-Dateien hochladen

Dort können Sie nun Layout-Dateien hochladen, in dem Sie unter der gleichnamigen Überschrift auf das "Plus" mit dem danebenstehenden Schriftzug "Neu" klicken.

Dadurch öffnet sich ein neues Fenster mit der Überschrift "Neue CSS / JavaScript Datei anlegen". In diesem können Sie durch Klicken auf "Durchsuchen" den Dateibrowser öffnen. Wie dieser funktioniert erklären wir hier im Rahmen des Hochladens und Verwaltens von Dateien. Über diesen können Sie dann Ihre eigenen JavaScripts und StyleSheets hochladen.

Damit können Sie das grundlegende Layout der sich im Hintergrund befindenden .php-Datei manipulieren. Die .php-Datei können Sie jedoch, wie oben schon erwähnt, über das CMS nicht bearbeiten oder anpassen.

Nachdem Sie eine Datei hochgeladen haben, können Sie diese über das darunterliegende Drop-Down noch als standardmäßig aktiv setzen.

Schritt 4: Layout Bereiche

Unter der Überschrift "Layout Bereiche" finden Sie die von uns erstellten Layout Bereiche. Dort können jedoch nur neue Bereiche angelegt werden, wenn diese auch in der .php-Datei, welche das ganze Layout Ihres Webshops enthält, hinterlegt sind.

Somit können Sie diese an sich nicht verändern oder neue anlegen. Sollten Sie Änderungen an diesen wünschen, wenden Sie sich jederzeit an uns.

Dennoch können Sie hier erkennen, welche Layout Bereiche verfügbar sind und an den Namen dieser erahnen, wo sich dieser Bereich auf der Seite befindet.

Schritt 5: Layout Klassen anlegen

Layout Klassen sind Klassen, welche Sie Inhalten zuordnen können. Diese bestimmen dann beispielsweise die Größe des Inhaltes oder die Farbe eines Textes sowie des Hintergrunds.

Gängige Layout Klassen sind zum Beispiel "Inhalt 1/1" welche den Inhalt auf die volle Breite des für den Inhalt vorgesehenen Textes erstreckt. Im Gegensatz dazu wird der Inhalt bei "Inhalt 1/2" auf die halbe Breite, bei "Inhalt 1/3" auf ein Drittel der Breite und so weiter, erstreckt.

Somit haben Sie beispielsweise die Möglichkeit Inhalte in zwei Spalten anzeigen zu lassen, wenn Sie beiden die Layout Klasse "Inhalt 1/2" zuweisen. Wie Sie Inhalten eine Layout Klasse zuweisen, zeigen wir Ihnen hier.

Sie können auch durch Klicken auf das "Plus" mit dem danebenstehenden Schriftzug "Neu" eine neue Layout Klasse anlegen.

Dadurch öffnet sich ein neues Fenster mit der Überschrift "Layout Klasse anlegen", in welchem Sie den Code der Layout Klasse und eine Beschreibung angeben. Danach speichern Sie dies, um die Layout Klasse zu erstellen.

Bitte beachten Sie hierbei, dass die Layout Klasse bzw. der Code dieser entweder in der .php-Datei oder in von Ihnen hochgeladenen StyleSheets definiert sein muss. Sonst wird diese nicht funktionieren.