Design-Editor (veraltet)

Überblick zur Vorlagenbearbeitung 

Mittels der Vorlagenbearbeitung können Sie aus eine Reihe von bereits vorgestalteten Vorlagen diejenige wählen, die am besten zu Ihrer Website passt. Um Ihrer Website ein spezielles Design zu geben, können Sie über die Vorlagenbearbeitung Designelemente wie Logo, Schriftarten oder Farbvorlagen importieren. Die Vorlagenbearbeitung ist in 3 Abschnitte gegliedert, die alle eine bestimmte Funktion erfüllen: 

• Vorlage ändern
• Farben anpassen
• Texte anpassen

Für die Vollbildanzeige diese englischen Videos klicken Sie bitte auf das Symbol im Videoplayer

Vorlage ändern

Unter dem Tab "Vorlage ändern" können Sie aus einer Reihe von vordefinierten Vorlagen mit bestimmten Farbpaletten wählen.

1. Hauptnavigation des Design-Editors: Hier könne Sie zwischen den drei Hauptfunktionen wählen:
   
• Vorlage ändern
• Farben anpassen
• Texte anpassen
2. Vorlage: Hier können Sie aus den verschiedenen Vorlagendesigns auswählen. 
   
   
3. Farbpalette: Die Optionen der Farbpalette erscheint, wenn Sie mit der Maus über die jeweiligen Vorlagen gehen. Klicken Sie dann auf eine Farbpalette und die Vorlage wird dann mit diesen Farben erscheinen. Sobald Sie dann eine Vorlage mit der entsprechenden Farbpalette ausgewählt haben, können Sie die Farben und andere Elemente anpassen.
4. Aktionsbereich: Hier können Sie spezielle Aktionen ausführen:
• Speichern: Hier speichern Sie alle Änderungen, die Sie vornehmen, während Sie im Design-Editor arbeiten.
• Live-Vorschau: Hier öffnet sich ein neuer Reiter mit einer Vorschau, die auf der Live-Datenbank Ihrer Site und den noch unveröffentlichen Änderungen in der Vorlage basiert. Dies ist lediglich eine Vorschau, zeigt Ihnen aber, wie Ihre Site mit der neuen Vorlage aktuell aussehen würde.
• Zurücksetzen: Hier können Sie alle unveröffentlichen Änderungen zur Live-Version Ihrer Website zurücksetzen. 
• Veröffentlichen: Hier stellen Sie alle Änderungen, die Sie im Vorlagen-Editor vorgenommen haben, live. Seien Sie vorsichtig! Sobald die Änderungen veröffentlicht sind, können sie nicht zu den ursprünglichen Einstellungen (vorhergehend getätigte Farbanpassungen und Schrifteinstellungen) zurückgesetzt werden.  

Farben anpassen

Sobald die Vorlage und die Farbpalette bestimmt sind, ist es möglich die Farben anzupassen, ein Hintergrundbild zu wählen und verschiedene Versionen Ihres Logos hochzuladen.

Klicken Sie auf das Bleistiftsymbol, um zu bearbeiten. 

1. Logo:
• Desktop Logo: Das Desktop Logo wird in der Kopfzeile gezeigt, wenn die Webseite im Vollbild auf Desktop oder Laptop Computer gesehen wird. 
• Maximale Breite = 990px
• Responsive Logo: Das sogenannte "responsive" Logo ist nicht notwendig. Responsive Design wird das Logo automatisch in der Grösse an den kleineren Bildschirm anpassen. Hier haben Sie aber die Möglichkeit ein entsprechendes, kleineres Logo, dass für kleinere Resolutionen besser passt, hinaufzuladen. Zum Beispiel, wenn Sie ein horizontales Logo haben, könnten Sie ein etwas weniger horizontales nehmen, sodass es besser für kleinere Bildschirme passt. 
• Keine fixe Grösse
  
  Beispiel für ein längliches, horizontales Logo und ein eher quadratisches Logo für die "responsive" Version. .
• Favicon: Ein Favicon ist eine 16x16 px Graphik, die in manchen Suchmaschinen erscheint. Das beste Dateiformat ist ein ICO, es geht aber auch PNG, GIF oder JPG. Mehr Information zu Favicons hier.
  
• 
  Beispiel für ein Favicon in Firefox. Favicons können in verschieden Plätzen je nach Browser erscheinen. 
  
  
• Standard Social Media Symbol: Fügen Sie eine quadratische Version Ihres Logos hinzu, das dann für Facebook und andere social media Plattformen benutzt wird. Diese Bild wird immer dann erscheinen, wenn ein Leser einen Artikel, Blog-Eintrag oder Kritik/Bewertung weiterveröffentlicht, der kein Bild dabei hat. Sollten Sie dieses Standard Symbol nicht haben, zeigt Facebook einen leeren Raum neben dem Artikel. 
• Beispiele für "Shares" ohne und mit dem entsprechenden Logo. 
  
  
2. Farben: Passen Sie einzelne Farben aus der vor-definierten Farbpalette an.  
• Jede Vorlage hat eine bestimmte Anzahl an Farben, die benutzt werden können.
3. Hintergrund: Verändern Sie den Hintergrund und fügen Sie ein Hintergrund-Bild ein. 
• Hintergrund-Farbe
• Hintergrund-Bild: Wählen Sie eines der bestehenden Bilder oder laden Sie ihr eigenes hoch.
• Widerholungs-Optionen: Wählen Sie eine Überlage-Regel je nach dem Bildtyp. 
• Wiederholen = horizontale und vertikale Überlage
• Wiederholen  =  horizontale und vertikale Überlage
• Wiederholen-x = horizontale Überlage
• Wiederholen-y = vertikale Überlage
• Nicht wiederholen = keine Überlage

Text anpassen

Hier könne Sie die Schriftart/Familie, die Grösse und den Stil der Texte auf Ihrer Seite bestimmen. 

Klicken Sie auf das Bleistiftsymbol, um zu bearbeiten. 

1. Navigation: Passen Sie die Schriftart, Stil und Grösse für die Haupt- und die Unternavigation an. 
2. Kopfzeile: Passen Sie die Schriftart, Stil und Grösse für den Überschriften-Text auf Ihrer Webseite an.
3. Text im Textfeld (Body Text): Passen Sie die Schriftart, Stil und Grösse für die Texte im normalen Textfeld auf Ihrer Webseite an. 
4. Personalisierte Schriftarten: Jene Klienten, die ein Typekit Konto haben, können ihre eigene Schriftart wählen. Sie brauchen nur die Typekit ID hier eingeben und Ihre persönliche Schriftarten-Familie wird hier als Option im Menü erscheinen.