- WhatsApp Erweiterung.PNG (24.45 KiB) 21386 mal betrachtet
Diese Erweiterung könnt Ihr unter den "Site Settings" aktivieren/deaktivieren und einrichten. Klickt dazu auf "Sites" und am gewünschten Projekt auf das Symbol "Zahrad":
Tragt oben Eure Smartphone Telefonnummer ein und passt den Text Euren Wünschen an:
Bei der ersten Verwendung vom PC muss ein QR-Code über Euer Handy gescannt werden, an dem Ihr auch WhatsApp installiert habt. Folgt dazu den Anleitungen auf web.whatsapp.com:
So sieht das dann auf der Mobirise-Seite aus:
Hier meine Testseite (ich werde den Button aber wahrscheinlich irgendwann wieder entfernen):
https://www.mobirise-tutorials.com/Test ... estseite3/
Das Fenster kann sich automatisch nach einer eingestellten Sekunden-Zeit öffnen, 0 Sekunden deaktiviert das automatische Öffnen, so wie ich es auf meiner Testseite eingestellt habe.
Wollte man dieses Popup-Fenster gar nicht (weil sich dieses bereits bei Maus über dem WhatsApp-Button öffnet), müsste man bei den Einstellungen "Popup" ausschalten.
Falls ihr die Standard-Schrift vom WhatsApp Popup-Fenster ändern wollt, dann guckt bitte auch hier:
https://www.mobirise-tutorials.com/Foru ... 349#p11349
Bei Mausüber dem WhatsApp Button öffnet sich das Chat-Fenster, beim Senden der Nachricht oder beim Klick auf den WhatsApp Button wird die Verbindung zur web.whatsapp.com Seite hergestellt, die dann ein Abbild Eures WhatsApp am Smartphone darstellt.
WhatsApp Button links
Wer eventuell den WhatsApp Button und das Chatfenster lieber links haben möchte, kopiert diese CSS und trägt sie in den Site-Einstellungen in die globale CSS des Projektes ein.
> Menü > Sites > An Projektkachel am Zahnrad
> Site-Einstellungen > Global HTML Insert > "Before </head> code"Code: Alles auswählen
<!-- WhatsApp Button Left -->
<style>
.floating-wpp {
left: 15px!important; /* Changed from 'right: 15px;' → positions the button at the bottom left */
}
/* Make the WhatsApp chat popup open on the left, above the button */
.floating-wpp .floating-wpp-popup {
left: 0 !important; /* attach popup to the left side of the button */
right: auto !important; /* remove right alignment */
transform-origin: bottom left !important; /* animation expands from bottom-left */
}
</style>
)
