Wie erstelle ich seitliche Sticky Buttons in WordPress?

Füge per Custom CSS einen fixen Button ein: position: fixed; right: 0; top: 50%; z-index: 999. In Divi kann ein Code-Modul mit HTML und CSS verwendet werden, ohne zusätzliches Plugin.

Seitliche Buttons (sticky button) in WordPress einfach einbinden

Marius Marzian • 20. Juli 2020 • 3 Min. Lesezeit

Icon: Code-Klammern – Symbol für Webentwicklung und Programmierung

SEO-Experte

Marius Marzian

OIT GmbH

Profil ansehen

Sticky Buttons am Bildschirmrand – etwa für „Jetzt anrufen", WhatsApp-Chat oder Newsletter-Abo – erhöhen die Conversion-Rate sichtbar, weil der Call-to-Action dauerhaft präsent bleibt. Mit ein paar Zeilen CSS und einem Divi-Button-Modul lässt sich das Pattern elegant umsetzen, ohne ein weiteres Plugin zu installieren.

Dieses Plugin können wir empfehlen um einfach Sticky-Icons bzw. Sticky Buttons zu ermöglichen. Ein typischer Anwendungsfall ist die schnelle Kontaktmöglichkeit auf einer Webseite.

Sie sehen gerade einen Platzhalterinhalt von Standard. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf den Button unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.

Inhalt entsperren

Mehr Informationen

Folgende CSS-Anpassungen helfen euch bei der Benutzung des Plugins um die Schriftgröße anzupassen und die Hoverfarbe zu ändern:

#ssb-container ul {
    font-size: 20px;
}
#ssb-container ul li:hover {
background-color: #FFFFFF;
}

Best Practices für Sticky Buttons

Maximal 2 Buttons

Mehr als zwei seitliche Buttons wirken überladen. Priorisiere: Telefon oder WhatsApp – nicht beides.

Mobile zuerst testen

Sticky Buttons überdecken auf kleinen Screens oft wichtige Inhalte. Teste auf iOS und Android vor dem Launch.

z-index beachten

Setze z-index: 9999 auf dem Sticky-Container, damit er über Headern, Menüs und Popups liegt.

Tipp: DSGVO-konforme WhatsApp-Integration

Ein WhatsApp-Sticky-Button lädt standardmäßig WhatsApp-Tracking. Nutze eine Consent-Lösung wie Borlabs Cookie und lade den Button erst nach Zustimmung – oder verlinke direkt auf wa.me/deine-nummer ohne Script-Einbindung.

Du brauchst professionelle Unterstützung bei WordPress oder Divi? OIT GmbH aus Osnabrück bietet WordPress-Webdesign und WordPress-Wartung für Ihr Unternehmen.