Das Design Ihrer Eventwebsite und Mailings

Das Design Ihrer Eventwebsite und Mailings

Im Menüpunkt Design können Sie das Erscheinungsbild Ihrer Eventwebsite und Mailings an Ihre Anforderungen anpassen.

Um das Design Ihrer Veranstaltung anzupassen, klicken Sie auf > Design im Seitenmenü.

Listenansicht (nur im PRO-Paket enthalten)
  1. Das Default-Design wird automatisch auf Event-Website und allen Mailings verwendet.
  2. Um ein Design zu bearbeiten, klicken Sie auf den Design-Namen.
  3. Um ein eigenes Design für ein oder mehrere Mailings bzw. einer oder mehrere Seiten der Event-Webite zu verwenden, muss dieses hier angelegt werden.
  4. Ein neues Design kann mittels Symbol “ Design”, oder durch “Duplizieren” (im Schnellmenü) eines bestehenden Designs erstellt werden.
  5. Um die Elemente zu sehen, in der ein Design verwendet wird, klicken Sie auf den Link z.B.“1x verwendet” in der Spalte “Verwendung".



Mehrere Designs für eine Veranstaltung: Wenn Sie bei einer Veranstaltung unterschiedliche Designs nutzen möchten, können Sie mehrere Design-Konfigurationen erstellen und dem jeweiligen Element (Eventwebsite oder Mailing) zuweisen. Damit ist es möglich, jedem Mailing sowie jeder Seite Ihrer Eventwebsite ein eigenes Design zuzuweisen. Um zusätzliche Design-Konfigurationen zu erstellen, können Sie eine bestehende Konfiguration duplizieren und eine vollkommen neue Konfiguration anlegen.

Design erstellen oder bearbeiten

  1. Reiter "Basis":
    1. Name: Die interne Bezeichnung des Desings wird in den Auswahlfeldern beim Bearbeiten der Event-Websites und Mailings im Backend angezeigt.
    2. Laden Sie Headerbild bzw. Logo in den erforderlichen Maßen hoch, diese werden automatisch in der Event-Website und den Mailings übernommen.
Maße Headerbild: 1.200 x 314 Pixel (BxH) hoch.
Maße Logo:
1.080 x 60 Pixel (BxH) hoch.
    1. Wenn Sie mit Design-Vorlagen arbeiten, wird Ihnen das Auswahlfeld "Design von Account übernehmen:" angezeigt. Wurde eine Design-Vorlage in diesem Feld gewählt, sind nur noch Headerbild und Logo bearbeitbar und die anderen Reiter inaktiv.


  1. Reiter "Einstellungen":
    1. Hintergrund & Inhaltsbereich: Legen Sie das Farbschema für den Hintergrund von Event-Website und Mailings fest. Sie können bei den Hintergrund-Farben zwischen der Hauptseite ("Body") und dem Inhaltsbereich unterscheiden. Den Rahmen der Inhaltsbox können Sie mit Schatten darstellen (nur auf Event-Website) bzw. mittels "Radius" die Ecken abrunden.
    2. Farben: Die Hauptfarbe wird standardmäßig für Überschriften und Buttons übernommen, dies kann in den Reitern "Text" bzw. "Button" bearbeitet werden. Ebenso können Sie die Farbe des Fließtextes hier definieren. Zusätzliche Farben können Sie im Reiter "Erweitert" definieren.
    3. Schriften: Hier legen Sie die Schriftarten Ihrer Event-Website fest. Bitte beachten Sie, dass für Mailings nur Systemschriftarten zur Verfügung stehen. Jeder Schriftart, die Sie für Ihre Eventwebsite ausgewählt haben, können Sie zur Darstellung in Mailings eine Systemschriftart als sogenanntes "Fallback" im gleichnamigen Feld rechts daneben zuordnen. Zusätzliche Schriftarten können Sie unter dem Reiter "Erweitert" definieren.
Individuelle Schriftarten: Bitte kontaktieren Sie uns, wenn die von Ihnen benötigte Schriftart nicht angeführt ist. Der Support unterstützt Sie gerne bei der Einbindung einer individuellen Schriftart.
    1. Schriftgröße: Definieren Sie hier die Schriftgrößen für den Fließtext jeweils für die Darstellung auf Desktop, auf Tablets bzw. in den Mailings und auf mobilen Geräten. Je nach Größe des Bildschirms, passt sich die Schriftgröße dadurch automatisch an (Responsive Design). Alle anderen Textelemente (wie Überschriften und Buttons ) passen sich über ein einstellbares Größenverhältnis automatisch an. Sie können dieses Größenverhältnis im Reiter "Text" anpassen.
    2. Verwendung Schriften und Ausrichtung: Definieren Sie die Standard-Ausrichtung aller Textelemente (links, mittig, rechts) und weisen Sie die gewählten Schriftarten den Textelementen Fließtext (Feld "Standard-Schrift") und Überschriften (Feld "Standard-Schrift für Überschriften") zu. 


  1. Reiter "Erweitert":
    1. Zusätzliche Farben: Neben den drei bereits definierten Farben, können Sie hier zwei zusätzliche Kontrastfarben definieren.
    2. Zusätzliche Schriften: Wählen Sie bis zu zwei weitere Schriftarten sowie ein dementsprechendes Fallback für Mailings aus.


  1. Reiter "Text":
    Sie können für die Schriftsätze "Fließtext" und für die vier Überschriften ("Überschrift 1 bis 4") jeweils detaillierte Einstellungen vornehmen:
    1. Schrift: Anhand der in den Reitern "Einstellungen" und "Erweitert" gewählten Schriftarten.
    2. Stil: Darstellung ausschließlich in Groß- oder Kleinbuchtstaben (losgelöst davon wie der Text eingegeben wurde).
    3. Größe: Schriftgröße im Verhältnis (%) der im Reiter "Einstellungen" im Absatz "Schriftgrösse" definierten Schriftgrößen des Fließtextes (in px).
    4. Zeilenhöhe: In Relation zur Schriftgröße (%).
    5. Ausrichtung: Die Standard-Ausrichtung wurde im Reiter "Einstellungen" im untersten Absatz definiert und kann hier je Schriftsatz geändert werden (z.B. Standard-Ausrichtung des Fließtextes ist links, die Überschrift 1 soll aber mittig dargestellt werden.
    6. Farbe: Wählen Sie aus einer der in den Reitern "Einstellungen" und "Erweitert" Farben aus.
    7. Sie können definieren, ob der Schriftsatz immer fett, kursiv oder unterstrichen angezeigt werden soll.
    8. Im unteren Teil der Seite können Sie Einstellungen für die Darstellung von Links vornehmen (Farbe & Stil).

  1. Reiter "Footer":
    Sie können für die Darstellung des Footers auf Event-Website und in Mailings detaillierte Einstellungen vornehmen:
  1. Schrift: Anhand der in den Reitern "Einstellungen" und "Erweitert" gewählten Schriftarten.
  2. Stil: Darstellung ausschließlich in Groß- oder Kleinbuchtstaben (losgelöst davon wie der Text eingegeben wurde).
  3. Größe: Schriftgröße im Verhältnis (%) der im Reiter "Einstellungen" im Absatz "Schriftgröße" definierten Schriftgrößen des Fließtextes (in px).
  4. Zeilenhöhe: In Relation zur Schriftgröße (%).
  5. Ausrichtung: Die Standard-Ausrichtung wurde im Reiter "Einstellungen" im untersten Absatz definiert und kann hier je Schriftsatz geändert werden (z.B. Standard-Ausrichtung des Fließtextes ist links, der Footer soll aber mittig dargestellt werden.
  6. Farbe: Wählen Sie aus einer der in den Reitern "Einstellungen" und "Erweitert" Farben aus.
  7. Hintergrundfarbe: Wählen Sie die Hintergrundfarbe des Footers aus und in den Reitern "Einstellungen" und "Erweitert" Farben aus
  1. Reiter "Button":
    Sie können für die Darstellung der Buttons auf Event-Website und in Mailings detaillierte Einstellungen vornehmen:
    1. Schrift: Wählen Sie die Schriftart für die Button-Bezeichnung anhand der in den Reitern "Einstellungen" und "Erweitert" gewählten Schriftarten aus.
    2. Stil: Darstellung der Schrift der Button-Bezeichnung ausschließlich in Groß- oder Kleinbuchtstaben.
    3. Schriftgröße: Schriftgröße der Button-Bezeichnung im Verhältnis (%) der im Reiter "Einstellungen" im Absatz "Schriftgrösse" definierten Schriftgrößen des Fließtextes (in px).
    4. Schriftfarbe: Wählen Sie die Schriftfarbe der Button-Bezeichnung aus einer der in den Reitern "Einstellungen" und "Erweitert" eingegebenen Farben aus.
    5. Stil: Sie können definieren, ob die Button-Bezeichnung fett, kursiv oder unterstrichen angezeigt werden soll.
    6. Breite: Breite des Buttons in Pixel.
Achten Sie bei der Definition der Button-Breite darauf, dass lange Button-Bezeichnungen nicht umbrechen.
    1. Abstand oben/unten: Abstand zwischen Button-Bezeichnung und oberen/unteren Button-Rand.
    2. Abstand seitlich: Abstand zwischen Button-Bezeichnung und rechten/linken Button-Rand.
    3. Zeilenhöhe: In Relation zur Schriftgröße (%).
    4. Hintergrundfarbe: Wählen Sie die Hintergrundfarbe des Buttons aus einer der in den Reitern "Einstellungen" und "Erweitert" Farben aus.
    5. Rahmenfarbe: Wählen Sie die Rahmenfarbe des Buttons aus einer der in den Reitern "Einstellungen" und "Erweitert" Farben aus.
    6. Rahmenbreite: Definieren Sie die Breite des Button-Rahmens.
    7. Radius: Definieren Sie ob die Ecken der Buttons abgerundet dargestellt werden sollen und den Radius der Abrundung.

  1. Reiter "CSS":
    Je nach Paket können Sie mittels CSS weitere Anpassungen auf Event-Website und Mailings vornehmen.
Wird der Reiter "CSS" nicht angezeigt, dann nehmen Sie mit Ihrem Invitario-Ansprechpartner Kontakt auf.

    • Related Articles

    • Verfügbare Schriftarten für Event-Website und Mailings

      Über den Menüpunkt Design können Sie die Schriftarten für Ihre Eventwebsite und Mailings festlegen. Dazu steht Ihnen ein breites Spektrum an Schriftarten zur Verfügung. Folgende Schriftarten stehen Ihnen zur Verfügung (Stand 01/2017): Serife ...
    • CSS Anpassungen in Website und E-Mailings

      Zusätzlich zu den umfangreichen Design-Einstellungen können weitere Anpassungen mittels CSS Einstellungen vorgenommen werden. Öffnen Sie im Menüpunkt > Design das gewünschte Design mit dem "Bearbeiten"-Symbol und klicken Sie auf "Erweiterte ...
    • Verwenden von Headerbild und Logo

      Zur Gestaltung Ihrer Event-Website und Mailings können Sie ein Headerbild bzw. ein Logo verwenden, das jeweils am Beginn der Website bzw. des Mailings angezeigt wird. Dabei haben Sie die Möglichkeit ein Headerbild und/oder Logo "global" für alle ...
    • Ein Event aus einer Vorlage erstellen (Event-Templates)

      Mit Event-Templates können Sie in wenigen Minuten eine neue Veranstaltung mit Ihren individuellen Prozessen, Inhalten und Designs erstellen. Dabei werden die in den Event-Templates einmal angelegten Einladungs- und Anmeldeprozesse, sämtliche Inhalte ...
    • Hintergrundfarbe von Fehlermeldungen anpassen

      Um die Hintergrundfarbe von System-Fehlermeldungen wie "Die Anmeldung wurde bereits beendet" anzupassen muss folgendes CSS im Design hinterlegt werden .errorMessage { background-color: #ed1b2f; border-color: #ed1b2f; color: #fff; }