Buttons | Sitely-Dokumentation

Buttons sind ein wesentlicher Bestandteil, um Menschen dazu zu bringen, mit deinen Webseiten zu interagieren. Sie können einmalige „Handlungsaufforderungen“ sein oder sie können gruppiert werden, um die Grundlage für eine vollständige Seitennavigation zu bilden. Im einfachsten Fall erstellst du einen Button, indem du das „Button“-Element zur Leinwand hinzufügst. Von dort aus kannst du den Button mit allen Optionen im Stil-Panel von Sitely gestalten.

Als Erstes musst du deiner Schaltfläche eine Beschriftung geben, damit Benutzer wissen, worum es sich handelt. Außerdem musst du Sitely mitteilen, was die Schaltfläche tun soll, wenn sie angeklickt wird. Dies wird als „On-Click“-Aktion bezeichnet.

Hier ist eine Zusammenfassung der Optionen:

Gehe zu Seite auf dieser Website: Diese Option verlinkt auf eine beliebige Seite deiner Website, die du bestimmst.
Zu externem Link wechseln: Hiermit wird ein Link zu einer externen URL erstellt.
E-Mail öffnen: Mit dieser Option wird ein Link erstellt, der den E-Mail-Client des Benutzers öffnet und eine neue Nachricht vorbereitet, die an eine bestimmte E-Mail-Adresse gesendet wird.
Datei herunterladen: Mit dieser Aktion wird eine von dir angegebene Datei heruntergeladen.
Telefonnummer anrufen: Dies ist eine nützliche Funktion für mobile Seiten deiner Website. Durch Klicken auf diese Art von Link wird ein Anruf an eine bestimmte Telefonnummer eingeleitet.
Textnachricht senden: Diese Funktion funktioniert genauso wie die Telefonnummernoption, löst jedoch anstelle eines Anrufs eine Textnachricht aus.
Diese Seite teilen: Dies ist ein Link zum Teilen, mit dem Besucher Ihre Webseite auf beliebten Social-Media-Plattformen teilen können.
Kontaktformular per E-Mail senden: Diese Aktion wird normalerweise an eine Schaltfläche zum Senden in einem Kontaktformular angehängt und sendet die Informationen aus dem Formular an eine bestimmte E-Mail-Adresse.
Erweiterte Formularübermittlung: Diese Option ähnelt der normalen E-Mail-Option für Kontaktformulare, bietet jedoch einige zusätzliche Funktionen, die von einigen Webhosting-Servern möglicherweise benötigt werden.
Popup öffnen/schließen: Diese Aktionen bewirken, dass ein bestimmtes Popup geöffnet oder geschlossen wird, wenn auf die Schaltfläche geklickt wird. Popups können auch mit der Aktion „Mouse Hover“ im Stil-Panel aktiviert werden.
Mediensteuerung: Mit dieser Aktion kann eine Schaltfläche zur Steuerung von Video- oder Audioinhalten auf der Seite verwendet werden. Durch die Verwendung mehrerer Schaltflächen könntest du einen benutzerdefinierten Media Player erstellen, wobei jede Schaltfläche einen anderen Aspekt der Medien steuert (Wiedergabe, Pause, Stummschaltung usw.).
Layoutblock-Sichtbarkeit: Mit dieser Aktion kann die Sichtbarkeit eines Layoutblocks auf deiner Seite ausgeblendet, angezeigt oder umgeschaltet werden.
Javascript-Funktion ausführen: Diese Option ist für die Entwickler unter uns, die sich mit der Programmierung von Webdesign befassen möchten. Mit dieser Option kann eine Schaltfläche eine Javascript-Funktion auslösen.

Nachdem du deiner Schaltfläche eine Beschriftung und eine Aktion zugewiesen hast, musst du sie nur noch mit den bekannten Stiloptionen von Sitely gestalten. Du kannst Farben, Füllungen, Umrandungen, Rundungen und Schriftarten festlegen und für jeden Schaltflächenstatus unterschiedliche Stiloptionen verwenden.

Über den Tellerrand hinaus

Wenn es um Schaltflächen geht, bietet dir Sitely alle Optionen, die du dir nur wünschen kannst. Du bist nicht auf die immer gleichen Designs festgelegt, die jeder verwendet. Mit Sitely kannst du wirklich kreativ werden. Hier zeigen wir dir einige Beispiele für interaktive Schaltflächen.

PRESS

Hierbei handelt es sich um Bildschaltflächen, die durch Hinzufügen von Bildern zum Schaltflächenhintergrund erstellt werden. Für jeden Schaltflächenstatus – Normal, Hover und Clicked – können Bildvariationen verwendet werden.

Come Fly With Us

Click the Bird to Book

Dieses Element besteht aus einer Standardbox mit rotem Umriss, zwei Textfeldern und einer Bildschaltfläche in der Mitte. Gruppiere einfach die Elemente, um ein einfach zu platzierendes Element zu erstellen

Hier ist ein weiteres zusammengesetztes interaktives Element. In diesem ersten Beispiel wurde die Sprechblase aus Apple Pages kopiert. Die Schaltfläche wurde darüber platziert und mit einem transparenten Hintergrund versehen. Der Link würde auf „Telefonnummer anrufen“ gesetzt werden. Die Funktion „Zum Anrufen klicken/tippen“ funktioniert nur auf Smartphones. Sie könnte auch verwendet werden, damit der Benutzer dir eine SMS sendet.

If you’re viewing on a Computer

Phone +34 000 111 111 2222

Click Here

Call me NOW

In diesem letzten Beispiel kannst du einen Link erstellen, der einen E-Mail-Client öffnet, oder die Beschriftung der Schaltfläche ändern und den Link eine Textnachricht senden lassen oder ein Formular öffnen. Egal, wofür du dich entscheidest, das Element wird auf die gleiche Weise erstellt. Der Text ist eine Schaltfläche mit transparentem Hintergrund. Sie wurde mit dem Handbild gruppiert, damit sie sich als vollständiges Element einfacher auf deiner Seite bewegen lässt.

Click Here to write me an email