Skip to main content
mobile

Integrate Whatsapp Click to Chat on WordPress

by July 27, 2020#!31Fri, 07 Aug 2020 17:24:57 +0200+02:005731#31Fri, 07 Aug 2020 17:24:57 +0200+02:00-5Europe/Rome3131Europe/Rome202031 07pm31pm-31Fri, 07 Aug 2020 17:24:57 +0200+02:005Europe/Rome3131Europe/Rome2020312020Fri, 07 Aug 2020 17:24:57 +0200245248pmFriday=4159#!31Fri, 07 Aug 2020 17:24:57 +0200+02:00Europe/Rome8#August 7th, 2020#!31Fri, 07 Aug 2020 17:24:57 +0200+02:005731#/31Fri, 07 Aug 2020 17:24:57 +0200+02:00-5Europe/Rome3131Europe/Rome202031#!31Fri, 07 Aug 2020 17:24:57 +0200+02:00Europe/Rome8#No Comments

1. Find a Whatsapp icon

Prima di tutto abbiamo bisogno di un’icona per consentire all’utente di fare clic su. Ci sono molti siti di immagini royalty free tra cui puoi scegliere. Scarica un’icona che ti piace, caricala nella sezione media e metti l’URL sul lato per ora.

2. Define the parameters

There are 2 parameters you need to decide:

  1. The phone number to which you want to send the message Whatsapp
  2. Il messaggio che ti verrà inviato

3. Put it all together

Here is your button:

< A href = "Https://api.whatsapp.com/send?phone=00155555555&text=I I am interested in your service" target = "_Blank" class = "Whatsapp" >
< img src = "Https://site.com/wp-content/uploads/2018/07/whatsapp.png" alt = "Whatsapp" >
< / to >

Copy the above but be sure to change the phone number and message.

4. Paste the code

For the sake of this tutorial we will place the icon at the bottom left of the screen and give it a fixed position so that you cannot lose it.

Quindi, per fare ciò, incollerò il codice dall’alto nel mio footer.phpfiles just before the bodytag di chiusura .

Una volta salvato il mio file e aggiornato il mio browser, sarò in grado di vedere l’icona in fondo alla pagina. Ora andremo avanti e lo modelleremo.

5. Draw the Whatsapp button

Tutto quello che devi fare è scrivere alcune righe CSSand paste it into yours style.cssfile.

.Whatsapp {
position: fixed;
left: 5px;
bottom: 65px;
}

Come puoi vedere, ho posizionato la mia icona a 5 pixel dalla sinistra dello schermo e 65 pixel dalla parte inferiore. La ragione per cui l’ho fatto è il fatto che ha bloccato del testo sul mio piè di pagina quando ho fatto scorrere fino alla fine della mia pagina, ma puoi giocarci come desideri.

6. Il momento della verità

Tutto ciò che dovresti fare ora è aggiornare la pagina, assicurarti che ti piaccia il luogo in cui è posizionata l’icona, fare clic su di essa e assicurarti di essere trasferito su Whatsapp per inviare il tuo messaggio.

Anche se questo tutorial dovrebbe essere incredibilmente facile da fare sul tuo sito, se hai ancora bisogno di un plug-in, ecco un plug-in che ti aiuterà a implementare un pulsante click to call di Whatsapp.

Click Chat to chat Whatsapp

Click Chat for WhatsApp chat

Questo plugin ha 10 stili di design diversi ed è davvero facile da usare. Ecco alcune altre funzionalità:

  • Choose your icon / image
  • animations
  • Style on a specific page / post
  • Define your message
  • Supporto per Google Analytics e Tag Manger Event
  • Support for Facebook events

Leave a Reply