WordPress Kodavsnitt

De bästa sätten att inkludera kodavsnitt i WordPress

Om du driver en WordPress-webbplats kommer det säkert att komma en tid när du engagerar dig i kodavsnitt. Eftersom underhåll av kodavsnitt kan vara onödigt arbete om det integreras felaktigt finns det kodavsnittsplugins. Men det finns också andra sätt att bädda in kodavsnitt på din webbplats. I den här artikeln jämför vi de bästa sätten att lägga till kodavsnitt på din WordPress-webbplats. 

Först och främst bör frågan besvaras: Vad är ett kodavsnitt? Ett kodavsnitt är en liten bit kod som utökar funktionaliteten på din webbplats. Därav namnet - översatt som "kodavsnitt". Detta för att indikera att det bara är några rader kod. Användbara exempel på detta är möjligheten att integrera responsiva videor och möjligheten till ytterligare filformat för mediebiblioteket. Det intressanta är att dessa kodavsnitt kan ersätta ett helt plugin. Detta kan avsevärt förbättra mängden kod (och därmed filstorlekarna), prestandan och även mottagligheten för fel på din webbplats.

Det finns andra fall där du behöver lägga till kodavsnitt på din WordPress-webbplats. Om du vill spåra vem som besöker din webbplats kan du infoga en spårningskod i sidhuvudet eller sidfoten. Om du vill använda en färdig lösning för att samtycka till cookies på din webbplats infogar du vanligtvis JavaScript-kod i sidhuvudet eller sidfoten. 

Varför koda utdrag plugins alls? 

För många WordPress-webbplatser har koden anpassats, men ibland på sätt som inte är hållbara. Kodavsnitt ska inte integreras direkt i "föräldern" eller huvudtemat för WordPress. Eftersom de skrivs över och raderas så snart du uppdaterar temat.

Detsamma gäller för plugins. Om du ändrar koden för ett plugin direkt kommer dina ändringar sannolikt att raderas under en uppdatering. Det enda sättet att få dina ändringar är om du har sparat dem eller gjort en säkerhetskopia någon annanstans. Vissa plugin-uppdateringar lägger bara till nya funktioner, men andra inkluderar också säkerhetsförbättringar. Dessa måste tillämpas korrekt för att göra din webbplats mindre sårbar för attacker. Därför kan felaktig tillämpning av kodavsnitt till och med bli en säkerhetsrisk, för då kan du komma på idén att lämna uppdateringen på grund av kodavsnittet.

Jag ska nu presentera dig för tre sätt att infoga kod som ska användas i en funktions.php fil. En av dem är kodfragment plugins. Detta täcker inte alla situationer där du vill anpassa ett plugin eller tema, eftersom det beror på förekomsten av lämpliga krokar för nödvändiga ändringar. Krokar är platser i koden för att interagera med WordPress-kärnan, en slags "krok" där plugins och teman kan "haka in". Så om det inte finns någon krok för en viss önskad funktion är kodavsnitt (i funktionerna.php) det mest förnuftiga sättet.

Skapa ett WordPress-plugin

Den här metoden kräver lite arbete med filen och på själva webbplatsen, så du bör vara försiktig och bäst göra en säkerhetskopia innan du gör några ändringar. Ett plugin har minst en mapp för PHP-filen. Försök att komma med ett unikt namn för din mapp och filer (du kan lägga till ett prefix baserat på ditt namn eller namnet på ditt företag eller något liknande (till exempel "Raidboxes.io Disk Usage Sunburst").

I den här filen behöver du en annan sak - en rubrik med plugin-informationen. Återigen behöver du en deklaration av ditt plugin-namn, som liknar följande: 

<?php

/**
* Plugin Name: your plugin name
*/

Bra jobbat!! Nu har du skapat ditt första egna plugin. Efter rubriken lägger du bara till dina kodavsnitt (de du vill infoga i funktionerna.php) och laddar upp mappen till din / wp-content / plugins / mapp på servern. Och ditt plugin ska visas under Plugins i administratörsområdet. 

WordPress Plugins

Om du är mer intresserad av att skapa WordPress-plugins kan du läsa Codex-inlägget om det.

Jag föredrar tillvägagångssättet att skapa ett anpassat plugin eftersom det är bra för att infoga kod i funktionerna.php. Dessutom är det enkelt att installera. 

Använd ett WordPress-plugin

För dig som inte vågar använda dina egna plugins är en av kodavsnittspluginsna ett utmärkt sätt att hantera dina kodavsnitt eller i allmänhet lägga till anpassad kod på WordPress-webbplatser. Du är förmodligen redan van vid att installera plugins från tredje part, så det kan vara enklare än det första alternativet.

Du installerar helt enkelt önskat plugin och navigerar till det nya menyalternativet som visas i administrationsområdet. Observera att de olika pluginsna kan struktureras annorlunda. Men de flesta av dem är enkla och enkla och lätta att förstå. Du bör byta namn på varje kodfragment som du lägger till. Detta är mycket användbart för att göra det lättare att hitta ett visst kodavsnitt. Den här metoden rekommenderas starkt och kan spara problem med många kodfragment.

Avgörande faktorer för att välja ett bra plugin som låter dig köra kodavsnitt på din webbplats inkluderar påverkan på din webbplats prestanda och användarvänlighet. Jag presenterar dig för några WordPress-kodavsnittsplugins.

De bästa kodfragmentpluginsna för WordPress

Kodstycken

Kodstycken

Denna förlängning utvecklades av Code Snippets Pro och är min personliga favorit. Tanken med tillägget är att du kan lägga till små PHP-kodavsnitt. Det ger en enkel lösning för att lägga till dina egna HTML-, JavaScript- eller PHP-kodavsnitt. Användningen av plugin liknar de andra administratörsmenyerna i WordPress och är mycket lätt att använda. Med plugin kan du infoga kodavsnitt i ditt tema med hjälp av ett grafiskt gränssnitt. Observera att detta tillägg inte är lämpligt för att lägga till spårningskoder eller något liknande. Detta tillägg är bäst för att lägga till mer funktionalitet i ditt temas funktioner.php fil.

Karakteristika:

  • Du kan använda PHP-kod i widgets, sidor och inlägg.
  • Infoga PHP för att skapa kontaktformulär och bearbeta alla typer av inmatning eller uppladdning.
  • Lägg till PHP för att skapa användaroptimerat innehåll.
  • Med PHP kan du anpassa alla aspekter av din WordPress-installation.

Infoga PHP-kodavsnitt

Infoga PHP-kodavsnitt

Utvecklat av xyzscripts.com är detta plugin ett populärt tillägg som uppdateras regelbundet. Med detta plugin kan du använda PHP-kod, som enkelt kan sättas in i den normala redigeraren för WordPress, eftersom det skapar utdragskortkoder för varje kod som läggs till. Infoga fungerar också med en kortkod i sidofältet på sidans textwidget. 

Karakteristika: 

  • I TinyMCE Editor har du en smart rullgardinsmeny
  • Konvertera PHP-utdrag till kortkoder för enkel implementering
  • Enkel och flexibel funktionalitet

Anpassad CSS Pro 

Kodfragment Anpassad CSS Pro

Med Custom CSS Pro WordPress-plugin kan du enkelt lägga till anpassad CSS-kod på din WordPress-webbplats. Detta gratis WordPress-plugin erbjuder några praktiska funktioner, inklusive förhandsgranskning i realtid och radnumrering för att göra redigeringen av koden lite enklare. 

Karakteristika:

  • Visuellt som miljön i Visual Studio Code eller Sublime Text
  • Det är enkelt att lägga till anpassad CSS-kod till WordPress
  • Förhandsgranskning i realtid

Infoga sidhuvuden och sidfötter

Kodfragment Infoga sidhuvud och sidfot

Denna typ av plugin gör det enkelt att infoga kod i sidhuvudet eller sidfoten. Förlängningen utvecklades av WPbeginner, som också utvecklade den berömda formen plugin WPforms. Med plugin kan du enkelt infoga kodavsnitt för integration av tjänster som Google Analytics och Facebook Pixel. 

Karakteristika: 

  • Snabb installation
  • Infoga enkelt rubriker, skript och annan kod
  • Det låter dig lägga till valfri kod eller skript tillsammans med HTML och JavaScript
  • Är det enklaste alternativet att infoga spårningskoder

Verktyg inbyggda i Elementor (Pro-version)

Om du använder Page Builder Elementor som en Pro-version behöver du inte installera ett annat plugin. Eftersom Elementor har ett inbyggt verktyg för att infoga spårningskoder och liknande. Elementor stöder också att byta namn på alla skript du lägger till på din WordPress-webbplats. Följ dessa steg för att hitta Elementor Custom Code. Gå till Dashboard > Anpassad elementorkod. Där infogar du skriptet du vill placera på din sida. Observera att du måste ha en aktiv Elementor Pro-licens för att kunna använda Elementors inbyggda anpassade kodverktyg.

Karakteristika: 

  • Enkel och logisk struktur
  • Integrerad med din sidbyggare

Använda ett underordnat tema

Den här metoden rekommenderas minst för att lägga till kodfragment, men den fungerar fortfarande bra. Det är lite mer komplicerat än att skapa ett plugin. Ett underordnat tema bör innehålla kod och formatering som gäller för layouten och utseendet på din webbplats. Men ett utdrag används vanligtvis för att ändra funktionaliteten och faller därmed inte in i "ansvaret" för ett barntema. 

Om du vill skapa ett underordnat tema skapar du en mapp med samma namn som ditt överordnade tema och med suffixet "-child" (om mappen för det överordnade temat "raidboxes.io-theme", mappen för barntemat skulle vara "raidboxes.io-tema-barn"). 

I den här mappen behöver du minst två filer: stilarkfilen som heter style.css och PHP-filen som heter child.php.

Filen style.css måste innehålla en rubrik med följande minsta information:

* 
Theme Name: Raidboxes.io Theme Child
Template: Raidboxes Theme
Version: 1.0.0
*/

Sätt sedan in ditt kodavsnitt i slutet av funktionerna.php filen och ladda upp mappen Child Theme till servern under / wp-content / themes /.

Om allt är bra kan du öppna temamenyn → i din administratör och aktivera det nya barntemat. Om du vill veta mer om det förklarar vi i tidningen hur man skapar ett barntema.

Slutsats 

Den här artikeln gav dig grundläggande information om dina sätt att inkludera kodavsnitt i WordPress. Beslutet mellan att skapa ditt eget WordPress-plugin eller barntema eller använda ett kodavsnittsplugin är upp till dig - och beror bara på dina preferenser, eftersom de tre metoderna funktionellt uppfyller samma. Det är bäst att använda det som passar dig bäst

Tyckte du om artikeln?

Med din recension hjälper du oss att förbättra vårt innehåll ytterligare.

Skriva en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade med *.