Voeg een stukje code toe aan je WordPress website

Leer hoe je specifieke stukjes code toevoegt aan je website zonder dat je website uit de lucht gaat. Er worden verschillende mogelijkheden toegelicht.

Wil je weten hoeveel bezoekers je hebt op je blog of website via Google Analytics? Wil je een MailChimp inschrijvingsformulier op je website? Wil je een externe chat optie aanbieden? Dit zijn maar enkele mogelijke scenario’s waarvoor je code moet toevoegen op je website. Maar hoe doe je dat nu precies?

Afhankelijk van wat soort code, en waar die terecht moet komen, zijn er verschillende opties om het aan je website toe te voegen.

Hoe je het niet moet doen

Heel veel tutorials op het internet schrijven dat je de code die je wilt toevoegen gewoon rechtstreeks in de functions.php mag worden geplaatst van het thema. Of rechstreeks de code van de plugin in kwestie gaan wijzigen als je een aanpassing wilt. Het spreekt voor zich wanneer je een update installeert dat de wijzigingen gewoon zijn verdwenen.  Je zou dit dus iedere keer opnieuw moeten doen.

Ga hier dus niet op in en lees hieronder verder …

Hoe je het wel moet doen

1. Via een childthema

Een mogelijke uitzondering van het toevoegen van code in de functions.php is wanneer je een childthema actief hebt op je website. Weet je niet wat een childthema is of hoe je er één maakt? Lees er alles over in een iets ouder bericht van me hier.

Het nadeel van deze oplossing is wanneer je van thema wilt veranderen. Dan moet je tijd investeren om uit te zoeken waar je precies de code hebt toegevoegd en opnieuw plakken in je nieuw childthema. Opnieuw manueel werk dus.

2. Via de Code Snippets plugin

Als je een eigen plugin schrijven te technisch klinken vindt, kan je altijd gebruik maken de plugin Code Snippets. Deze plugin is vooral handig als je code moet toevoegen die enkel op de voorzijde van je website of aan de achterzijde moet worden uitgevoerd. Dit werkt enkel met PHP code. De toegevoegde code wordt ook op syntax-fouten gecontroleerd, zou voorkom je bvb. een foutcode 500 (lees hier meer over).

Zie screenshot:

code-snippets-plugin.png

Link : https://nl.wordpress.org/plugins/code-snippets/

3. Via de Header and Footers plugin

Voor code zoals een Google Analytics, een Facebook Pixel of iets anders, dien je het stukje code vaak in de header of net onderaan in de footer te plaatsen. De Code Snippets plugin is hiervoor niet uitgebreid genoeg en hiervoor zijn alternatieven beschikbaar.

3.1 Insert Headers and Footers (WPBeginner)

insert-header-footer.png

Met deze plugin kun je specifiek je code toevoegen aan zowel je header of aan je footer, er zijn maar 2 velden in de hele plugin. Zie bovenstaand screenshot.

Link: https://nl.wordpress.org/plugins/insert-headers-and-footers/

3.2 Head, Footer and Post Injections (Stefano Lissa)

Deze plugin is uitgebreider dan die van WPBeginner, met name de mogelijke locaties waar je de code nodig acht. Zie screenshot:

head-footer-and-post-injections.png

Als je deze functionaliteit nodig hebt is dit een prima plugin.

Link: https://nl.wordpress.org/plugins/header-footer/

4. Schrijf je eigen plugin

Het klinkt misschien heel ingewikkeld, maar eigenlijk is een kleine plugin schrijven met enkel de code die je hoeft toe te voegen heel simpel. Maak een .php bestand aan in je wp-content/plugins map, geef het een beschrijvende naam en zet er volgende code in:

<?php
/**
 * Plugin Name: Jouw pluginnaam
 */

Alles dat je na de */ plaatst is de effectieve code. Om je plugin iets veiliger te maken voeg je ook dit daarna toe:

<?php
defined( 'ABSPATH' ) or die( 'Hackers niet toegelaten' );

Dit voorkomt directe uitvoering en toegang tot het bestand en maakt het dus veiliger. Na die regel kun je de effectieve plugin code toevoegen.

Een voorbeeld van een volledig pluginbestand waarin ik de tekst onderin elke pagina van het Dashboard aanpas:

<?php
/*
Plugin Name:  Dashboard footer informatie
Plugin URI:   https://jerrix.be
Description:  Voeg contactinformatie toe in het Dashboard.
Version:      1.01
Author:       Jeroen Rotty
Author URI:   https://jerrix.be
*/

function remove_footer_admin()
{
    echo '<span class="dashicons dashicons-admin-generic"></span> Onderhoud door <a href="https://jerrix.be" target="_blank">JerrixIT</a> - Jeroen Rotty -  <span class="dashicons dashicons-smartphone"></span><a href="tel:+32470596406">0470 596 406</a></p>';
}

add_filter('admin_footer_text', 'remove_footer_admin');

Veel succes!

Vragen of opmerkingen over deze blogpost? Reageer dan hieronder…

Geef een reactie