Design

Here you can find out how to customize the design for your event.
You can find all the settings explained here in the “Design” tab of your event or event template.

Du kannst für das guestoo Back-End zwischen zwei Darstellungsoptionen wählen. Die Screenshots in der Doku basieren auf dem "Klassischen Design".
Hier siehst Du die Unterschiede, damit Du dich auch im "Modernen Design" zurecht findest: » guestoo Back-End-Design

Note: If you cannot see some of the sections explained on this page, there may be two reasons for this:

 

1) You do not have the required subscription to use the corresponding function.

 

2) The sections are hidden. To show them, scroll to the bottom of the “Design” tab and click on “Show more options”.
There you can set which sections should be displayed and which should be hidden so that you have a better overview. :)

Background image + Colors

Event > Design > Colors

Background image + Colors - Event > Design > Colors
Background image

Here you can upload a background image.

 

The background image is displayed in the following places:

  • Event microsite
  • Payment site
  • Survey site

To ensure that the background image is displayed optimally, it should meet the following requirements:

  • File format: JPG
  • Size: Longest side at least 2000px
  • Aspect ratio: ideally 15:10 (but will be adjusted automatically)
  • DPI: 72
  • Colors: RGB
Colors

Here you can set the colors that are used for your event page, your registration form, your tickets and your emails.

 

You can pick the following colors here:

  • Primary color
  • Accent color
  • Text color
  • Text color lighter
  • Separator color: Used for lines and other separating elements
  • Background color

Event page template

Event > Design > Event page template

Event page template - Event > Design > Event page template

Here you can specify which template should be used for your event page.

 

You currently have the choice between these different templates:

  • Tile - DEMO
  • Tile + Navigation - DEMO1DEMO2
  • Tile Rounded + Logo + Navigation - DEMO
  • Classic + Logo - DEMO
  • Classic + Logo + Navigation - DEMO1DEMO2
  • Modern 1 #hell - DEMO
  • Modern 2 #dunkel - DEMO
  • Classic - DEMO
  • MiniMiniMinimal (beta) - DEMO

If you change the template, no data will be lost! So you can always try out the view of the different templates by setting them and then going to your event page to see the changes.

 

Tip: You can access your event page by clicking on the eye symbol in the top right-hand corner.

Show/hide elements and buttons

Event > Design > Show/hide elements and buttons

Show/hide elements and buttons - Event > Design > Show/hide elements and buttons

Here you have the possibility to further influence the appearance of the event microsite and the registration form.

 

You have the following options here:

Labeling of the button

Here you can select the label for the button that leads to the registration form.

The following options are available:

  • Register / Buy Now (depending on whether it is a free event or an event with paid tickets)
  • Register now
  • Participate now
  • Join in now
  • Vote now
  • Send inquiry
  • Prebook now
  • Request document
Further options

You also have the option of showing or hiding the following buttons and elements:

  • Hide invitation code & login items in form
    If this option is activated (= Toggle on green), the options for entering an invitation code and for logging in are not displayed to guests.
  • Show share buttons on microsite
    If this option is activated (= Toggle on green), various social media buttons for sharing the event are displayed on the event microsite. This is practical if you want your guests to recommend the event to others and thus make other interested parties aware of it.
  • Show free spots on the microsite (Available: 6)
    If this option is activated (= Toggle on green), the event microsite will show how many places are currently still available for the event.
  • Show number of available tickets in the registration form
    If you activate this option (= Toggle on green), the number of tickets of this type still available will be displayed under each ticket in the registration form.
    Requirements: Several tickets must be created and the availability of the tickets must not be set to “-1” (= unlimited).
  • Show number of available timeslots in the registration form
    If you activate this option (= Toggle on green, the registration form will show how many places are still available per timeslot.
    Requirements: The availability of timeslots must not be set to “-1” (= unlimited).
  • Hide "Save data for next time" button
    If this option is activated (=Toggle on green), the option to save their data for their next visit is not displayed to guests.
  • Hide language switcher
    If this option is activated (=Toggle on green), the language selection (DE, EN, etc.) is hidden at the bottom of the event page and in the registration form.

E-Mail-Template

Event > Design > E-Mail-Template

E-Mail-Template - Event > Design > E-Mail-Template

Here you can specify which template should be used for your emails.

 

You currently have the choice between the following templates:

  • -- From Agency » Design --
    Default setting, the ticket template specified under “Agency > Design” is used
  • Classic (will not be developed further)
  • Modern

If you change the template, no data will be lost! So you can try out the view of the different templates at any time by setting them up and then inviting yourself to an event and playing through the process.

Ticket Design

Event > Design > Ticket-Design

Ticket Design - Event > Design > Ticket-Design

Wenn du guestoo im Pro-Tarif oder höher nutzt, kannst Du hier festlegen welches Template für Deine Tickets verwendet werden soll.

Dieses Feature kann auf Wunsch auch zum Basic-Tarif hinzugebucht werden - weitere Informationen dazu findest Du hier.

 

Du hast aktuell die Wahl zwischen fünf verschiedenen Templates:

  • -- Aus Agentur » Design --
    Standard-Einstellung, es wird das unter "Agentur > Design" hinterlegte Ticket-Template genutzt
  • Classic
  • Ticket als Namensschild (DIN A6)
  • Ticket als Namensschild mit vCard
    Wird der QR-Code auf dem Ticket von einem anderen Gast gescannt, hat dieser die Möglichkeit die Kontaktdaten des Ticket-Inhabers als Visitenkarte auf seinem Gerät zu speichern
  • Modern
  • Modern v2
  • 86x54mm
  • Ohne Checkin Code
  • Zusatz: Parkticket
  • Zusatz: Parkticket v2

Nachdem Du Dich für ein Template entschieden hast, lädst Du noch die/das benötigte(n) Bilder hoch. Achte hierbei auf die Vorgaben, die Du unterhalb des Uploads findest.

 

Hinweis: Um das gewählte Ticket-Template zu testen, melde Dich selbst zu Deinem Event an. Du findest das Ticket in der Bestätigungs-E-Mail.

Wallet Design

Event > Design > Wallet Design

Wallet Design - Event > Design > Wallet Design

Wenn du guestoo im Pro-Tarif oder höher nutzt, kannst Du hier das Design für Dein Wallet-Ticket individualisieren.

Dieses Feature kann auf Wunsch auch zum Basic-Tarif hinzugebucht werden - weitere Informationen dazu findest Du hier.

 

So einfach gehts:

  • Scrolle im "Design"-Tab Deines Events zum Abschnitt "Wallet Design"
  • Klicke oben rechts auf "Bearbeiten"
  • Lade ein Logo für das Wallet-Ticket hoch
    Maße: 360x100 px
  • Lade ein Thumbnail für das Wallet-Ticket hoch
    Maße: 100x100px
  • Klicke oben rechts auf "Speichern"

Um das Erscheinungsbild Deines Wallet-Tickets zu testen, melde Dich als Gast zum Event an und spiele den Prozess durch. Das Wallet-Ticket findest Du als Anhang in der Bestätigungs-E-Mail.

Eigene Schrift verwenden

Event > Design > Eigene Schrift verwenden

Eigene Schrift verwenden - Event > Design > Eigene Schrift verwenden

Wenn Du guestoo im Pro-Tarif oder höher nutzt, kannst Du an dieser Stelle die Schriftarten ändern, die für die Event-Seite und die E-Mails verwendet werden.

Dieses Feature kann auf Wunsch auch zum Basic-Tarif hinzugebucht werden - weitere Informationen dazu findest Du hier.

 

Folgende Schriftarten stehen als Beispiel zur Verfügung:

  • Helvetica
  • Arial
  • Georgia
  • Impact
  • Trebuchet
  • Comic Sans
  • Lucida Console
  • Courier New
  • Verdana

Du kannst die Schriftart für den Fließtext und für die Überschriften getrennt voneinander festlegen.

Klicke hierzu auf den entsprechenden Button mit der gewünschten Schriftart, um den benötigten CSS-Code in Deine Zwischenablage zu kopieren. Diesen fügst Du dann mit Rechtsklick > Einfügen oder STRG/COMMAND+V in das Feld für "Fließtext" und/oder "Überschriften" ein.

 

Hinweis: Bitte beachte, dass es sich hierbei um CSS-Code handelt und halte Dich an die folgende Schreibweise:

  •  font-family: Helvetica, Arial, sans-serif;
Eigene Fonts benutzen

Wenn Du eine andere Schriftart benutzen möchtest, als die die oben aufgezählt wurden, ist das natürlich auch möglich.

Die Schriften müssen hierzu auf dem guestoo-Server liegen - wende Dich daher bitte zunächst an support@guestoo.de.

Einbindung der Schriftarten

Sobald die Schriften vom Support auf den Server hochgeladen wurden, erhältst Du einen Link zur Schriftart, sowie den zugehörigen Namen.

Um die Schriftart zu nutzen, trägst Du folgendes in die jeweiligen Textfelder ein:

 

Fließtext/Überschriften:

font-family: 'Name der Schrift';

 

Font-Import:

@font-face {
font-family: 'Name der Schrift';
font-style: normal;
font-weight: 400;
src: local(''),
url('Link zur Schrift'); format('opentype');
}

 

Hinweis: Das angegebene Format ist abhängig von der gesendeten Schriftart. Unser Support-Team wird Dir daher ggf. ein anderes Format zum Einbinden nennen.

Event-Microsite & Anmelde-Formular: CSS-Überschreiben

Event > Design > Event-Microsite & Anmelde-Formular: CSS-Überschreiben

Event-Microsite & Anmelde-Formular: CSS-Überschreiben - Event > Design > Event-Microsite & Anmelde-Formular: CSS-Überschreiben

Wenn Du guestoo im Business-Tarif oder höher nutzt, hast Du hier die Möglichkeit das CSS von guestoo mit Deinem eigenen zu überschreiben.

Dieses Feature kann auf Wunsch auch zum Pro-Tarif hinzugebucht werden - weitere Informationen dazu findest Du hier.

Hinweise zum Überschreiben des guestoo CSS
  • Es gibt zwei Stellen, an denen Du das CSS überschreiben kannst: die Event-Microsite und das iFrame-Formular.
  • Das CSS wird jeweils nach unserem Standard-CSS auf der Seite eingebunden.
  • Vorsicht!! Wenn Du hier etwas falsch machst, kannst Du Deine Seite hiermit im schlimmsten Fall unbrauchbar machen. Wir empfehlen Dir daher, diese Funktion nur zu nutzen, wenn Du Dich mit CSS auskennst.
  • Falls Du die beiden Felder an dieser Stelle leer lässt, werden die Einstellungen genutzt, die Du unter Agentur > Design hinterlegt hast.
  • Wenn Du unter Agentur > Design etwas hinterlegt hast, für dieses Event aber den Standard von guestoo nutzen möchtest, trage in das Feld folgendes ein: /* --- */

Tipp: Hilfreiche Code-Schnipsel zur Anpassung des HTML und CSS findest Du hier.

Event-Microsite: Eigenes HTML verwenden (nur Microsite)

Event > Design > Event-Microsite: Eigenes HTML verwenden (nur Microsite)

Event-Microsite: Eigenes HTML verwenden (nur Microsite) - Event > Design > Event-Microsite: Eigenes HTML verwenden (nur Microsite)

Wenn Du guestoo im Business-Tarif oder höher nutzt, hast Du hier die Möglichkeit mit Hilfe von HTML einen eigenen Header und Footer in Deine Event-Microsite zu integrieren.

Dieses Feature kann auf Wunsch auch zum Pro-Tarif hinzugebucht werden - weitere Informationen dazu findest Du hier.

Hinweise zum Überschreiben des guestoo HTML
  • Es gibt zwei Stellen, an denen Du Dein eigenes HTML zur Event-Microsite hinzufügen kannst: Im Header und im Footer
  • Der Header-Code wird direkt nach dem Body-Tag eingefügt, noch vor unserem Code.
  • Der Footer-Code wird nach unserem Code eingefügt.
  • Vorsicht!! Wenn Du hier etwas falsch machst, kannst Du Deine Seite hiermit im schlimmsten Fall unbrauchbar machen. Wir empfehlen Dir daher, diese Funktion nur zu nutzen, wenn Du Dich mit HTML auskennst.
  • Falls Du die beiden Felder an dieser Stelle leer lässt, werden die Einstellungen genutzt, die Du unter Agentur > Design hinterlegt hast.
  • Wenn Du unter Agentur > Design etwas hinterlegt hast, für dieses Event aber den Standard von guestoo nutzen möchtest, trage in das Feld folgendes ein: <!-- -->

Tipp: Hilfreiche Code-Schnipsel zur Anpassung des HTML und CSS findest Du hier.