Hoe een shortcode in WordPress toevoegen?

Heb je ooit een tijd gehad waar je wat gespecialiseerde inhoud wilde toevoegen aan je WordPress-bericht of -pagina, maar wist je niet precies hoe? Misschien wilde je een Twitter-widget insluiten of een bepaalde inhoud terugbellen van een of andere website of API. Hoe kunt u dit type inhoud eenvoudig toevoegen aan uw WordPress-bericht? Gelukkig biedt WordPress een zogenaamde shortcode om dit soort taken uiterst eenvoudig te maken. Deze tutorial neemt je mee door het proces van het bouwen, installeren en gebruiken van een shortcode in je WordPress-installatie. Laten we beginnen met te zien wat een shortcode is.

Wat is een WordPress Shortcode?

Kort gezegd, een shortcode is een speciale tag die je kunt invoeren in een bericht dat wordt vervangen door andere inhoud wanneer je het bericht op de website daadwerkelijk bekijkt. Als je ooit een WordPress-galerij in je blog hebt ingesloten, heb je de ingebouwde korte code al gezien .

Wanneer u een blogpagina laadt met de shortcode [gallery], vervangt WordPress de shortcode [gallery] door alle code die daadwerkelijk een galerij van uw afbeeldingen weergeeft.

Zoals u aan het bovenstaande voorbeeld kunt zien, lijkt een shortcode op een HTML-tag, maar is deze ingesloten met vierkante haken in plaats van punthaken. Deze code wordt vervangen door een andere code wanneer de pagina daadwerkelijk in een webbrowser is geladen. Het is echt cool dat WordPress je in staat stelt om je eigen aangepaste shortcodes te maken om vrijwel alles weer te geven! Je zou het kunnen gebruiken om een ​​YouTube-video uit te voeren, je laatste tweets te laten zien of zelfs aan te passen zoals je wilt.

Als dat niet logisch is, laten we een voorbeeld bekijken. Laten we zeggen dat ik een AdSense-advertentie in mijn bericht wil uitvoeren. Ik zou in de HTML-modus van de WordPress content-editor kunnen gaan en het AdSense-codeblok erin kunnen kopiëren en plakken, maar dit zou vervelend en mogelijk storend zijn met alle extra markup in mijn bericht. Als ik het advertentieblok wilde wijzigen, moest ik bovendien teruggaan naar elk bericht om het te wijzigen in het nieuwe bericht. Een gemakkelijkere manier en een betrouwbaardere manier om het Adsense-blok toe te voegen waar ik maar wilde, zou het gebruik van een adsense-shortcode zijn. De shortcode kan er als volgt uitzien:

[Adsense] 

Wanneer u daadwerkelijk naar de post op uw website kijkt, wordt de shortcode vervangen door het adsense-advertentieblok. Dus hoe creëer je deze shortcode? Vanzelfsprekend moet je WordPress vertellen hoe de shortcode op de een of andere manier moet worden vervangen. Laten we daar naar kijken.

Hoe maak ik een shortcode aan?

Gelukkig maakt WordPress het vrij eenvoudig om je eigen shortcodes te maken, dus laten we eigenlijk gaan over de implementatie van de [adsense] shortcode. Het eerste wat we moeten doen, is een functie definiëren die de werkelijke Adsense-code uitvoert. Alle volgende codes gaan in functions.php in uw thema (het zou ook in een zelfstandig plugin-bestand kunnen gaan). Begrepen? Ok, laten we naar die functie kijken.

 functie get_adsense ($ atts) return '';  

Deze functie is vrij eenvoudig - het geeft alleen mijn Google AdSense-code als een tekenreeks terug. Wat deze functie ook retourneert, is waar mijn shortcode zal worden vervangen, dus ik zou mogelijk de HTML voor een Twitter-widget of een lijst met onderliggende berichten van deze persoon of iets anders hebben geretourneerd..

Nu we een functie hebben die teruggeeft wat we willen, hoe koppelen we dat dan aan een shortcode? Dit is waar de WordPress API binnenkomt. Laten we opnieuw kijken naar hoe we het doen en vervolgens uitleggen wat er aan de hand is. Hier is de oproep om de adsense-shortcode in te stellen.

 add_shortcode ('adsense', 'get_adsense'); 

Dat is het! De eerste parameter die is doorgegeven is de naam van de shortcode, dus in ons geval geeft 'adsense' aan WordPress de opdracht om de [adsense] shortcode te maken. De tweede parameter geeft de functie aan die wordt aangeroepen wanneer de nieuwe shortcode wordt gevonden. Nogmaals, in ons geval zegt 'get_adsense' dat WordPress [adsense] moet vervangen door de resultaten van onze methode get_adsense.

Niet slecht, toch? Nu is dit een heel eenvoudige shortcode, WordPress stelt u in staat om veel meer met uw shortcodes te doen, inclusief het toevoegen van parameters (misschien wilt u kiezen tussen adsense-blokken?). De volledige API is te zien op de WordPress Codex.

Hoe gebruik ik mijn shortcode?

Dit laatste deel is eenvoudig, voeg gewoon de [adsense] shortcode toe in de HTML- of Visuele weergaven van de bericht- of pagina-inhoudeditor. Dat is het! U hebt uw eerste shortcode gemaakt.

John Gadbois is de mede-eigenaar en technisch leider bij Domain Superstar, een site voor hulpprogramma's voor domeinnamen. Hij runt ook CalculatorPro, een coole calculator-site met allerlei financiële rekenmachines. Hij vindt het leuk om te leren over en te coderen met Ruby on Rails, jQuery, WordPress en PHP.