Hvordan indsætter man kode i sidehoved- og sidefodssektionen i WordPress?

WordPress samler flere PHP-skabelonfiler for at gøre læsbart indhold til brugeren i browseren.WordPress-temaer indeholder header.php, footer.php, single.php (til indlæg), page.php (for sider) og sidebar.php-filer, de seneste temaer bruger yderligere skabelonsektioner til at generere hovedindholdet.

Alle disse skabeloner er pænt samlet og vist, når du ser WordPress-siden i din browser.Typisk behøver du ikke at ændre disse filer, og der er plugins tilgængelige til at indsætte brugerdefineret funktionalitet.I nogle tilfælde skal du dog indsætte kode i sidehoved- og sidefodssektionerne i WordPress.

I denne artikel forklarer vi, hvordan man gør det uden og med plugins.

Hvorfor indsætte kode i sidehoved eller sidefod?

Sidehoved- og sidefodssektionerne er praktiske til forskellige kodeintegrationer og tilføjelse af ekstra funktionalitet til dit websted.Her er nogle af de bedste eksempler, der kræver, at du indsætter kode i sidehoved og sidefod på dit WordPress-websted.

  • Indsæt automatisk annoncekode fra Google AdSense eller masthead-budannoncekode fra ethvert andet annonceprogram.
  • Installer Google Analytics og Facebook Pixel-sporingskoden.
  • Indsæt captcha fra Bing Webmaster Tools, Google Search Console, Baidu, Yandex og enhver anden platform som Pinterest.
  • Tilføj tilpasset CSS til overskriften, såsom Google Fonts stylesheets og JavaScript i sidefoden.
  • Indsæt brugerdefinerede komponenter som brødkrummer i headeren, når du bruger plugins som Yoast SEO.

Som du kan se, bliver listen længere afhængig af dine behov.

Tilføj kode til sidehoved- og sidefodssektioner i WordPress

Som standard giver WordPress ingen mulighed for at indsætte kode i sidehoved- og sidefodssektioner.Den nemme mulighed er at redigere filen direkte og indsætte din kode.Der findes dog også plugins til dette formål.I denne artikel vil vi forklare to måder at tilføje kode til sidehoved- og sidefodssektionerne på ethvert WordPress-websted.

  • Rediger header.php og footer.php filerne for WordPress-temaet manuelt.
  • Brug Insert Header and Footer plugin til at tilføje kode uden filredigering.
relateret spørgsmål  3 nemme måder at slå din Facebook-afhængighed på

Vi vil også forklare brugen af ​​nogle temaer til at indsætte kode i sidehoveder og sidefødder ved hjælp af wp_head og wp_footer krogene.

Indsæt WordPress sidehoved og sidefodskode manuelt

Denne mulighed kræver redigering af filen header.php eller footer.php i dit WordPress-webstedstema og er muligvis ikke begyndervenlig.

  • Først skal du starte med at forberede kodestykker eller kopiere fra tredjepartswebsteder.Når du har din sidehoved- og sidefodskode klar, skal du holde markøren over menuen Udseende på webstedets dashboard og klikke på fanen Temaredigering.
  • Ignorer eventuelle advarselsmeddelelser, du modtager, og vælg dit aktive emne fra rullelisten "Vælg emne, der skal redigeres:".
  • Vælg filen "header.php" eller "footer.php" til højre for den aktuelle visning.
  • For overskriften skal du sørge for at indsætte koden under det afsluttende "" tag, så skal koden til sidefoden være under "" Etiket.Nogle gange skal du muligvis også indsætte kode før det afsluttende tag.
  • Til sidst skal du klikke på knappen "Opdater fil" for at gemme ændringerne på dit websted med det tilføjede uddrag.

Sørg for at teste dit websted og tjek, at de funktioner, du tilsluttede, fungerer som forventet.

Indsæt WordPress sidehoved og sidefodskode ved hjælp af plugins

Som standard giver WordPress dig mulighed for at tilføje tilpasset CSS til dit websted under Udseende > Tilpasning > Yderligere CSS sektionen.Du kan dog ikke indsætte JavaScript i dette afsnit.Der er mange gratis plugins og plugins tilgængelige til at indsætte kode, her vil vi forklare brugen af ​​"WPBeginner Insert Header and Footer".Pluginnet har en super enkel grænseflade, som begyndere nemt kan bruge.

  • Først skal du installere og aktivere pluginnet "Indsæt sidehoved og sidefod".Fra dit WordPress-websteds dashboard skal du holde markøren over Plugins-menuen og klikke på Tilføj nyt.
  • Brug søgeplugin-funktionen til at finde "Indsæt sidehoved og sidefod", og klik på knappen "Installer nu".Når installationsprocessen er fuldført, "Aktiver" plugin'et.
Installer plugin'et
Installer plugin'et
  • Gå til menuen Indstillinger, find og klik på undermenuen Indsæt sidehoved og sidefod.
  • Pluginnet indeholder tre bokse til at placere scripts i sidehoved, brødtekst og sidefod for at indsætte kode.Indtil da instruerer tredjepartsudbydere som Google Analytics dig i, hvilken boks du skal placere deres kodestykker.Ellers skal du sørge for at vide præcis, hvor du vil indsætte koden.
  • Indsæt disse koder i de relevante koder, og klik på Gem for at fuldføre dine webstedsændringer.
  • Kodescripts indlæses nu automatisk til det specifikke sted, hvor webstedet kører.
relateret spørgsmål  Sådan fjerner du OneDrive fra File Explorer på Windows 10

Du kan altid redigere koden yderligere og holde plugin'et aktivt, da dets deaktivering vil forhindre tilføjelse af brugerdefineret funktionalitet og deaktivere alle scripts, der tidligere er tilføjet til dit websted.

Indsæt kode ved hjælp af plugins
Indsæt kode ved hjælp af plugins

Bemærk, at hvis "Indsæt sidehoved og sidefod"-plugin ved en fejl deaktiveres eller afinstalleres ved en fejl, forbliver din kode i din webstedsdatabase.Bare geninstaller eller genaktiver plugin'et for at få tidligere kode til at virke.Det anbefales også, at du rydder cachen på dit WordPress-websted, når du tilføjer og gemmer ændringer til sidehoved- og sidefodskodestykkerne i pluginnet.

Rediger sidehoveder og sidefødder med temaer

Uanset om du redigerer dine temafiler manuelt eller bruger et plugin, påvirker den kode du indsætter hele dit websted.Du skal bruge plugins som Insert HTML Snippets eller prøve tilpassede HTML-blokke i Gutenberg-editoren for kun at indsætte tilpasset kode i specifikke indlæg eller sider.Du kan dog indsætte kode i sidehoveder og sidefødder med de nyeste temaer som GeneratePress Premium og Astra Pro.Disse temaer bruger standard wp_head og wp_footer hooks og tillader brugerdefinerede begrænsninger at blive anvendt.For eksempel kan du bare indsætte brødkrummer i et enkelt indlæg uden at påvirke siden.

Her vil vi bruge Astra Pro-temaet til instruktioner, du kan udføre lignende trin i GeneratePress Premium-temaet ved at bruge "Elementer"-indstillingen.

  • Når du har installeret Astra Pro-tilføjelsen, skal du gå til Udseende > Astra-indstillinger.
  • Aktiver indstillingen Custom Layout, og klik på linket Indstillinger for denne mulighed.
  • Klik på knappen "Tilføj ny" og indsæt den kode, du vil indsætte i boksen.
  • Under afsnittet Custom Layout Settings skal du klikke på Layout-rullemenuen og vælge indstillingen Hooks.
Indsæt overskriftskode i Astra-tema
Indsæt overskriftskode i Astra-tema
  • På rullelisten Handling skal du vælge wp_head for sidehovedsektionen og wp_footer for sidefodssektionen.
  • Hvis du kun bruger et uddrag, skal du lade "prioritet" stå tomt.Men når du indsætter flere koder på samme krogplacering, skal du sørge for at indstille prioritetsrækkefølgen for at indsætte koderne.Du kan bruge 10, 20, 30 osv. som prioritet, den laveste vil have forrang over de andre.
  • Angiv top- og bundafstandsdetaljer i pixels, hvis det kræves.
  • Vælg, hvor du vil vise koden i rullemenuen Vis på.Du kan vælge specifikke indlæg, sider, kategorier eller indsætte hele dit websted eller indsætte specifikke indlægstyper såsom indlæg, sider eller enhver tilpasset indlægstype, der bruges på din hjemmeside.
  • I rullelisten Brugerrolle skal du vælge den brugerrolle, som du ønsker, at koden skal være aktiv for.
relateret spørgsmål  Sådan importeres adgangskoder fra Google Chrome til iCloud nøglering

Når alle indstillinger er færdige, skal du klikke på knappen Udgiv for at dine ændringer træder i kraft.

Grunde til at bruge Insert Header and Footer plugin

Der er så mange ulemper ved at redigere temafiler eller bruge et brugerdefineret tema, at du holder dig til plugin-tilgangen.Her er nogle af de fordele, du kan få ved at bruge pluginnet, bortset fra at du måske ikke er en tekniker, eller du er måske nybegynder.

  • Da plugin-butikken tilføjer scripts på en separat placering, behøver du ikke at bekymre dig om kodesletning under opgraderinger, opdateringer eller ændring af temaer.Du behøver heller ikke underordnede temaer, da plugin'et fungerer uafhængigt af dit websteds tema.
  • Det gør det nemt og hurtigt at tilføje tilpasset kode i sidehoveder og sidefødder.Derudover hjælper dette med at opretholde organiseringen af ​​kodestykker på et enkelt sted.
  • Det er muligt at støde på fejl, når du vælger at redigere dit WordPress-tema, så brug af et plugin kan hjælpe med at vinke, forhindre og undgå sådanne fejl.

sidste tanker

I mange tilfælde skal du ændre udseendet, ændre måden eller tilføje anden funktionalitet til dit WordPress-websted.I begge tilfælde, når du ikke er teknisk tilbøjelig, skal du huske at bruge plugin-metoden til at indsætte sidehoved- og sidefodskode.Mens temaer som Astra og GeneratePress kan hjælpe dig med dette, bliver du nødt til at købe premium-versionen.Det kan også gøre det vanskeligt at ændre temaer, på hvilket tidspunkt du bliver nødt til at lede efter plugins til at bruge.

Del dette indlæg

Send kommentar