#1

alexB

As  (106 Punkte)  ·   männlich  ·   Deutschland  ·   Nachricht senden

Ich hatte immer einen alten HTML Code von getbutton.io drin auf ein paar Web 12 Webseiten. Das hat gut geklappt und das Design hat sich nicht verschoben hat sich also gut integriert allerdings sind die jetzt kostenpflichtig geworden ein Button auf einer Webseite kostet 134 € für eine dauerhafte Lizenz. So und ich habe jetzt keine keine 1500 € um ein paar Webseiten damit auszustatten, hat jemand vielleicht einen anderen HTML Code mit einem WhatsApp Button, der fehlerfrei in allen Designs integriert werden kann?

Ps also ich meine diesen kleinen runden und grünen Button den man unten links oder unten rechts platzieren kann und dort auch stehen bleibt ohne die Web12 Designs zu zerstören. Ich hatte mal einen anderen gefunden aber, da wurde immer die H1 Überschrift verschoben.

 


Dieser Beitrag wurde bereits 2 mal bearbeitet, zuletzt von »alexB« (25.09.2024, 17:16)
#2

Plajaman

As  (160 Punkte)  ·   männlich  ·   Spanien  ·   Nachricht senden
 https://www.playa-busreisen.com

Hallo Alex,

ich hatte mal daran getüftelt, allerdings mit proweb8, hier der Code für den head-Bereich. Wie gesagt, es war nur ein Versuch, vielleicht hilft es weiter. - Viel Erfolg / Die Telefonnummer ohne 00 oder + bei der Ländervorwahl

  
  <style>
    /* Stil für den WhatsApp-Button */
    .whatsapp-button {
      position: fixed;
      bottom: 20px;
      left: 20px;
      background-color: #25D366;
      color: white;
      border-radius: 50px;
      padding: 10px 20px;
      font-size: 18px;
      text-align: center;
      box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
      z-index: 1000;
      display: flex;
      align-items: center;
    }

    /* Icon-Größe */
    .whatsapp-button img {
      width: 30px;
      height: 30px;
      margin-right: 10px;
    }

    /* Hover-Effekt */
    .whatsapp-button:hover {
      background-color: #20c057;
      cursor: pointer;
    }

  </style>

und body-Bereich

<!-- WhatsApp Button -->
  <a href="https://wa.me/DEINE_TELEFONNUMMER" target="_blank" class="whatsapp-button">
    <img src="https://upload.wikimedia.org/wikipedia/commons/5/5e/WhatsApp_icon.png" alt="WhatsApp Icon">
    WhatsApp Chat
  </a>
177 Aufrufe | 2 Beiträge