WhatsApp button toevoegen aan Genesis Child Thema

WhatsApp share button

Vandaag kreeg ik een vraag van een klant, of ik een WhatsApp share button wilde toevoegen. Maar natuurlijk doen we dat. In deze blog leg ik uit hoe ik dat gedaan heb.

Om de WhatsApp button toe te voegen moeten we welgeteld twee dingen doen:

  1. Code voor de knop genereren
  2. Deze code toevoegen aan het Genesis Child Thema

Code voor de button genereren

Via de website whatsapp-sharing.com kan je de button genereren. Je kan kiezen uit drie verschillende groottes, de knop tekst aanpassen en de tekst aanpassen die in het WhatsApp bericht gezet komt te staan, uiteraard samen met de link van de pagina waar de knop op staat.

De gegenereerde code is dan:

<a href="whatsapp://send" data-text="Bekijk deze interessante blog:" 
   data-href="" class="wa_btn wa_btn_s" style="display:none">
   Delen
</a>
<script type="text/javascript">
if(typeof wabtn4fg==="undefined"){
   wabtn4fg=1;h=document.head||document.getElementsByTagName("head")
   [0],s=document.createElement("script");
   s.type="text/javascript";s.src="//whatsapp-sharing.com/button";
   h.appendChild(s);
}
</script>

Deze code toevoegen aan het Genesis Child Thema

Het toevoegen van de code aan een single post weergave doen we in de functions.php. Ik heb deze code gebruikt:


function nstrm_add_whatsapp_share_button() {
   echo '<a href="whatsapp://send" data-text="Bekijk deze interessante blog:" data-href="" class="wa_btn wa_btn_s" style="display:none">Delen</a>
   <script type="text/javascript">if(typeof wabtn4fg==="undefined"){wabtn4fg=1;h=document.head||document.getElementsByTagName("head")
   [0],s=document.createElement("script");s.type="text/javascript";s.src="//whatsapp-sharing.com/button";h.appendChild(s);}
   </script>';
}
add_action( 'genesis_entry_content', 'nstrm_add_whatsapp_share_button' );

Na het opslaan van je functions.php is de button te zien op iOS apparaten. Op andere appraten zal de button niet getoond worden.

 



Geef een antwoord

Het e-mailadres wordt niet gepubliceerd.

Deze site gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.