WordPress-functionaliteit aanpassen met functions.php

Dus, hier zijn we bij het achtste en laatste deel van onze zoektocht om onder de huid te kruipen van een WordPress-website. Ik hoop dat je je nu een stuk comfortabeler voelt met het spelen van je eigen sites. Een van de geweldige dingen die ik heb gevonden over WordPress is het enorme aantal dingen dat je ermee kunt doen als je eenmaal bekend bent met hoe dingen in elkaar passen.

In de tutorial van vandaag gaan we dat laatste mysterieuze bestand aanpakken in ons thema dat je vaak zult zien genoemd rond de valstrikken; degene die je misschien al eerder stukjes code hebt geplakt zonder echt te weten waarom of waarom. Vandaag gaan we knoeien met de functiesjabloon (functions.php).

Voor een diepgaande discussie over dit mysterieuze document kun je niet voorbij gaan aan wat er op de Codex wordt besproken, maar kortweg, het Functions-bestand is het middel waarmee we de standaardfunctionaliteit van sommige van onze site kunnen wijzigen. Met behulp van dit bestand kunnen we de functionaliteit van de site verder uitbreiden. Het is behoorlijk krachtig en vandaag zullen we een paar manieren bespreken waarop we het kunnen gebruiken om onze testwebsite uit te breiden.


Voor we beginnen

Je hebt nodig:

  • FTP-toegang tot uw site
  • Uw tekstbewerkingssoftware
  • Een favicon-afbeelding 32x32px opgeslagen in .ico-indeling, genaamd favicon.ico

Wat we zullen doen

  • Toevoegen in de Google Analytics-trackingcode (u zou hiervoor een plug-in kunnen gebruiken, maar we gebruiken dit als een voorbeeld)
  • Add-in in een favicon voor uw site

Voordat we verder gaan, moeten we een beetje uitleggen over hoe het functiesbestand zich gedraagt ​​in de context van uw kindthema. Het is een beetje anders dan de andere sjablonen waarmee we hebben gewerkt.

In een kindthema vervangt u de functionaliteit van het overeenkomstige bestand in het bovenliggende thema, zoals we in onze laatste zelfstudie hebben gedaan, de functions.php voegt toe aan of breidt de functionaliteit van de ouder uit. Het vervangt het niet, wat u, als u het zich herinnert, herinnert aan de manier waarop de andere sjablonen zich gedragen in een kindthema.

Dus wanneer onze pagina wordt aangeroepen en de server zijn magie uitvoert door alle sjablonen bij elkaar te zoeken, zoekt het naar de functies in het onderliggende thema, voert het uit en kijkt vervolgens naar de ouder en voert die functies ook uit.

Ten tweede is het functiedossier ook een PHP-bestand, en functies die we plakken / schrijven bevatten zowel PHP-code als mogelijk wat HTML. Dus ze helpen ons onze nerdscredit te verbeteren! (high fives all round!)

Laten we erin stappen.


Het toevoegen van Google Analytics Tracking Code

Ik moet meteen zeggen dat er niets mis is met het toevoegen van analysecode met behulp van een plug-in. In feite verschillen de meeste plug-ins die deze functionaliteit bieden (in essentie) niet erg van dit proces, ze stoppen de code gewoon weg in een plug-insbestand. Dat gezegd hebbende, het is een nuttige en niet te uitdagende illustratie voor de doeleinden van deze oefening. Dus laten we een kijkje nemen.

1. Maken onze Functies Bestand

Stap 1. Open uw FTP-client en navigeer naar uw kind thema directory.

Stap 2. Klik in de bestandsvermelding op uw externe server met de rechtermuisknop en selecteer Maak een nieuw bestand.


Stap 3. Voer de naam van uw functiebestand in als functions.php en druk op OK.


Stap 4. Open je nieuwe functions.php bestand in uw teksteditor.

Stap 5. Op dit punt moeten we het bestand zo instellen dat onze server het als een PHP-bestand herkent. Dus voeg een PHP-tag toe, zoals deze , aan het begin van uw bestand.


Stap 6. Nu kunnen we wat code in onze plakken functions.php.

Hier is de code die we zullen in plakken, en daaronder staat een uitleg van waar we naar kijken:

  

Oké, laten we het opsplitsen.

// Google Analytics-code invoegen in de voettekst

Op regel 1 hebben we een zin die begint met twee // marks. Dit is een opmerking, die niets programmatisch doet, en is er alleen voor de informatie van de persoon die het bestand bewerkt. Het formatteren met de schuine streepjes is een snelle manier om een ​​opmerking te plaatsen enkele lijn van PHP-code. Als we een heel blok uitspreken dat meer dan één regel overschrijdt, gebruiken we het gebruikelijke / * reageer hier * / merken die we ook gebruiken in CSS. Het is een goede gewoonte om opmerkingen toe te voegen als notities wanneer u codeert, zodat u bij kunt houden waar u bent en wat u hebt gedaan.

add_action ('wp_footer', 'mytheme_add_googleanalytics');

Op regel 4 hebben we een enigszins gecompliceerde code die begint met add_action.

add_action is een PHP-functie die acties verbindt met plaatsen in de code genaamd haken. We kunnen een hele reeks codefragmenten vinden op het web die in feite PHP-functies zijn om functionaliteit aan verschillende hooks in onze code toe te voegen of te verwijderen. In dit geval gebruiken we dit voeg actie toe om de. toe te voegen mytheme_add_google_analytics functie naar de wp_footer haak.

function mytheme_add_googleanalytics () 

Regel 5 definieert en opent de mytheme_add_google_analytics functie:

en uit lijn 7, die volgt, is het zware hefgedeelte dat eigenlijk de functionaliteit is die we zullen bieden. Op dit moment is dit slechts een HTML-opmerking (<-- comment here -->), zullen we dat binnenkort oplossen.

Ten slotte sluiten we op regel 9 de functie af met de accolades (let op hoe we de functie moesten aanpassen label. De reden hiervoor is dat de code die we plakken, in feite HTML is en dat de twee talen achter elkaar werken in plaats van samen worden geperst. Dus we moesten de PHP-tag sluiten met de ?> na de haakjes op regel 5, plak dan onze code (we doen dat in de volgende stap) en open vervolgens de PHP-tag op regel 8 voordat we nog meer functies naar ons bestand schrijven.

 

Stap 7. Nu is het tijd om in te loggen op uw Google Analytics-account en uw insluitcode te pakken. Ik zal hier wachten terwijl je dat doet ...

...

Stap 8. Ga nu het hoofd en plak dat in op regel 7 bovenaan onze HTML-opmerking.


Stap 9. Sla nu uw bestand op en upload het naar uw server.

Je zou in staat moeten zijn de code van je pagina te bekijken en de code daar te zien zitten, onderaan in je broncode:



Voeg een Favicon toe aan uw site

Je weet wat een favicon is, toch? Als je een opfrisser nodig hebt, ga dan naar de Codex voor meer informatie. Maar kortom, het is het kleine pictogram dat u vaak een logo of aangepaste afbeelding ziet op de tabbladen van uw browser, of wanneer een link naar uw site wordt opgeslagen als een bladwijzer.

Stap 1. Creëer je favicon.ico in je favoriete beeldbewerkingssoftware.

Stap 2. Upload uw favicon naar uw themamap (uw kindthema) via FTP.

Stap 3. Plak de volgende code in uw functions.php het dossier:

// Voeg een Favicon toe aan de Site add_action ('wp_head', 'mytheme_add_favicon'); function mytheme_add_favicon () echo ''; 

Stap 4. Sla het bestand op en upload het terug naar uw server.

Als je hebt beschreven wat er eerder in een WordPress-functie gebeurde, zou je het vrij eenvoudig moeten vinden om te begrijpen wat er in deze volgende functie aan de hand is. Laten we eerst eens kijken naar de code ...

Om te beginnen kunnen we op regel 4 zien dat we een nieuwe maken add_action functie. De haak waar we onze code op zetten is wp_head (dus in tegenstelling tot de vorige haak voegen we dit toe aan de header van onze site, in plaats van de footer) en de naam van onze functie is mytheme_add_favicon.

Een opmerking over naamgevingsfuncties:

Het is je misschien al opgevallen dat ik in beide gevallen de functies heb genoemd door te beginnen met onze aangepaste themanaam mijn thema_ en eindigend met een beschrijving van wat onze functie doet, bijvoorbeeld. add_favicon. De reden hierachter is tweeledig:

  1. Het maakt het gemakkelijk om in een oogopslag te zien wat onze code zou moeten bereiken en ...
  2. Het elimineert het risico van het gebruik van functienamen die al bestaan ​​in ons bovenliggende thema, of in WordPress zelf, en vermindert zo het risico dat onze thema's dingen breken.

Hoe dan ook, ervan uitgaande dat je een hebt favicon.ico bestand in je themadirectory, de bovenstaande code zou uit de doos moeten werken, maar als toelichting:

  1. Op regel 8 vertellen we ons thema om een ​​reeks HTML in te voegen in de hoofd van onze website. Dit vertelt de browser waar het te vinden favicon.ico.
  2. Het kleine beetje PHP in die string (get_stylesheet_directory_uri () voegt het pad naar ons bestand toe in de themamap.

Ervan uitgaande dat alle code correct is en het bestand zich in de themamap bevindt, geeft de browser dit pictogram weer voor onze site in de hoek van onze tabbladen en andere plaatsen waar gewoonlijk een favicon wordt weergegeven.


U hebt misschien gemerkt dat we in dit voorbeeld de. Niet hoefden te sluiten en opnieuw te openen PHP tags zoals we deden in stappen 7 en 8 van het vorige voorbeeld. Dit komt omdat in dit tweede voorbeeld de code die we hebben gebruikt PHP van begin tot einde is en hoewel het HTML-bits bevat, is het geen op zichzelf staande HTML, omdat PHP een onderdeel is van de URL-reeks. Naarmate je bekend raakt met functies zoals deze, en als je leert om zelf functies te bouwen, krijg je meer duidelijkheid over het verschil, maar deze gedachte dient alleen om je te laten weten dat de code correct is, voor het geval je op zoek bent om toe te voegen in en / of ?> tags in dit voorbeeld ook rond de accolades!


Conclusie

Zodra je begint inzicht te krijgen in de kracht van de functions.php bestand ben je onstopbaar, het is het middel om allerlei dingen gedaan te krijgen en om een ​​aantal geweldige en krachtige functionaliteit toe te voegen aan je site. Dus de volgende keer dat een tutorial die je volgt of een fragment dat je hebt gevonden, moet worden toegevoegd aan je functions.php bestand, zou u nu in staat moeten zijn om zelfvertrouwen toe te voegen en de controle te nemen over alle delen van uw site!

Onthouden! Voordat u nieuwe wijzigingen in uw bestand aanbrengt, om een ​​kopie op uw bureaublad op te slaan voor bewaring voordat u nieuwe wijzigingen uploadt. De code verkeerd krijgen functions.php kan problemen veroorzaken. Als u dus een werkende versie op uw bureaublad hebt opgeslagen, betekent dit dat als het fout gaat, u eenvoudig uw veiligheidsbestand kunt uploaden en opnieuw kunt beginnen.