Cum să adaug cod în Header.php într-un tema copil?

Question

Cum să adaug cod în Header.php într-un tema copil?

27 feb. 2012, 17:40:36

Vizualizări: 91.7K

Voturi: 27

Încerc să creez un tema copil pentru prima dată și am câteva întrebări legate de adăugarea de cod în header.

Într-un tema obișnuit, adaug anumite coduri în fișierul header.php, cum ar fi Google Analytics, Google Webmaster Tools, Buy Sell Ads, Facebook Open Graph, etc.

Cum se face acest lucru într-un tema copil? Creez un fișier header.php în tema copil? Dacă da, cum se face acest lucru? Este la fel ca @import pe care l-am folosit în CSS?

Mulțumesc.

Rick Smith

471

tema copil anteturi open graph

Toate răspunsurile la întrebare

Comentarii

Mulțumesc. Nu am nicio experiență în crearea de plugin-uri. Am aproximativ 5 bucăți de cod pe care aș dori să le adaug în header. Ar trebui să creez un plugin pentru fiecare dintre ele?

Rick Smith

27 feb. 2012 18:26:16

@RickSmith Am adăugat formatul de plugin în postarea de mai sus

Brian Fegter

27 feb. 2012 18:35:25

Indiferent dacă folosești o Temă Părinte, Temă Copil sau orice altă Temă, abordarea corectă este să pui acest cod într-un callback, atașat la un action hook corespunzător. Poți pune acest cod în fișierul functions.php al Temei, sau, și mai bine, așa cum a sugerat Brian, să-l pui într-un Plugin specific site-ului.

Chip Bennett

27 feb. 2012 19:33:44

@BrianFegter Mulțumesc mult. Lucrul cu PHP / teme child este nou pentru mine, așa că învăț pe parcurs. Mulțumesc pentru răbdare. :) În vechea mea temă, am intrat în admin-ul WordPress, apoi în editor și am adăugat asta în header. <meta property="fb:page_id" content="12345678" /> Este mai bine să adaug toate acestea în plugin?

Rick Smith

27 feb. 2012 20:10:02

@RickSmith Nici o problemă. De asta există acest forum. :)

Brian Fegter

27 feb. 2012 20:10:52

Arată celelalte 13 comentarii

Adăugarea unui Fragment de Cod

HTML

Dacă doriți să adăugați un fragment de cod, de exemplu o meta etichetă etc., în secțiunea <head>, atunci ar trebui să utilizați acțiunea wp_head:

add_action( 'wp_head', 'wpse_43672_wp_head' );
function wpse_43672_wp_head() : void {
    ?>
    <meta ..... />
    <?php
}

Există de asemenea admin_head și wp_footer

Javascript & CSS

Ați putea folosi codul de mai sus pentru a adăuga și Javascript, dar în schimb JS personalizat ar trebui să fie încărcat ca un fișier JS, sau inclus ca JS inline prin wp_add_inline_script atașat la un handle JS existent deja încărcat.

https://developer.wordpress.org/reference/functions/wp_add_inline_script/

Același lucru este valabil și pentru CSS, care are wp_add_inline_style https://developer.wordpress.org/reference/functions/wp_add_inline_style/

Modificarea Antetului Site-ului

Rețineți că odată ce faceți acest lucru, nu veți mai vedea modificările aduse în tema părinte atunci când aceasta se actualizează, pentru acele fișiere pe care le suprascrieți și modificați.

Într-o Temă cu Blocuri

Dacă tema dumneavoastră este o temă cu blocuri, atunci puteți face acest lucru mergând în editorul de site și făcând modificări în zona de Administrare.

Într-o Temă Clasică

Dacă site-ul dumneavoastră folosește o temă clasică PHP, atunci puteți utiliza o temă copil.

Pentru a modifica antetul într-o temă copil, copiați fișierul header.php din tema părinte în tema copil și apoi modificați-l. WordPress va detecta că aveți un header.php în tema copil și va folosi acesta în locul header.php din tema părinte.

Orice fișiere șablon pe care le puneți în tema copil vor avea prioritate față de același fișier din tema părinte atunci când sunt apelate de WordPress.

Orice ar trebui să fie plasat în eticheta <head> ar trebui făcut folosind ceva similar cu funcția din răspunsul lui Brian. Dacă este specific temei, îl puteți pune într-un fișier numit functions.php în folderul temei fără pași adiționali.

Tom J Nowell

60.7K

27 feb. 2012 18:36:33

Comentarii

Tom, mulțumesc. Deci dacă am nevoie să instalez 5 fragmente diferite de cod în header.php, aș putea crea un singur plugin și să instalez acela? Aș mai avea nevoie să copiez fișierul header.php în tema mea copil?

Rick Smith

27 feb. 2012 19:58:53

Da, nu există niciun motiv să faci 5 plugin-uri

Tom J Nowell

27 feb. 2012 19:59:39

@RickSmith Dacă abstractizezi într-un plugin, nu ai niciun motiv să copiezi header.php. :)

Brian Fegter

27 feb. 2012 20:16:10

Problema cu această soluție este că atunci când tema este actualizată, veți pierde corecțiile din header.php făcute de autor.

Matthew S

24 feb. 2016 09:32:42

WordPress suprascrie întregul fișier sau doar adaugă conținut nou la fișierul părinte?

Ooker

31 mai 2020 11:44:10

Mulțumiri lui Brian Fegter. Dacă acest răspuns vă ajută, vă rugăm să evaluați răspunsul lui Brian chiar aici deasupra.

Acesta este un exemplu complet funcțional despre cum să adăugați elemente în "header" printr-un propriu plugin. În acest caz, adaug proprietățile Facebook Open Graph pentru butoanele de Share și Like.

Pur și simplu creați un fișier PHP cu numele specificat în "Plugin Script" la începutul codului exemplu, plasați-l într-un folder cu același nume fără extensie, evident, și copiați acest folder în destinația "/wp-content/plugins".

Apoi în interiorul "Wordpress", reîmprospătați "Plugins" și veți vedea noul vostru plugin instalat. Doar activați-l, iar paginile voastre vor începe să conțină metadatele Open Graph Facebook și Twitter.

Descrierea imaginii aici

FOARTE IMPORTANT: Fișierul PHP trebuie să fie codificat în UTF-8 fără BOM și nu trebuie să conțină absolut niciun caracter la final. Asigurați-vă de acest lucru.

<?php
/*
    Plugin Name: My Facebook Open Graph Protocol
    Plugin Script: my-facebook-open-graph-protocol.php
    Plugin URI: 
    Description: Adaugă Facebook Open Graph Protocol în header
    Author: Diego Soto (Mulțumiri lui Brian Fegter)
    Donate Link: 
    License: GPL    
    Version: 0.1-alpha
    Author URI: https://wordpress.stackexchange.com/questions/43672/how-to-add-code-to-header-php-in-a-child-theme
    Text Domain: myfogp
    Domain Path: languages/
*/

/*  Copyright 2014 Diego Soto  (http://disientoconusted.blogspot.com.ar/)

    Acest program este software liber; îl puteți redistribui și/sau modifica
    în conformitate cu termenii Licenței Publice Generale GNU, versiunea 2,
    așa cum este publicată de Free Software Foundation.

    Acest program este distribuit în speranța că va fi util,
    dar FĂRĂ NICI O GARANȚIE; fără măcar garanția implicită de
    COMERCIALIZARE sau ADAPTARE LA UN SCOP PARTICULAR. Consultați
    Licența Publică Generală GNU pentru mai multe detalii.

    Ar trebui să fi primit o copie a Licenței Publice Generale GNU
    împreună cu acest program; dacă nu, scrieți la Free Software
    Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
*/

add_action('wp_head', 'wpse_43672_wp_head');

function wpse_43672_wp_head(){
    $title = get_the_title() ." &lsaquo; ". get_bloginfo( "name", "display" );

    $src = wp_get_attachment_image_src( get_post_thumbnail_id(get_the_ID()), array( 90,55 ), false, "" ); 

    $face_metad = get_post_meta(get_the_ID(), "metadescription", true);

    $twitter_metad = get_post_meta(get_the_ID(), "metadescription140", true);
    if (empty($twitter_metad)) 
        $twitter_metad = $face_metad;

    //Închideți tag-urile PHP 
    ?>    
    <meta property="og:title" content="<?php echo esc_attr($title); ?>" />
    <meta property="og:image" content="<?php echo esc_attr($src[0]); ?>" />
    <meta property="og:url" content="<?php the_permalink(); ?>" />
    <meta property="og:description" content="<?php if (!empty($face_metad)) echo esc_attr($face_metad); else the_excerpt(); ?>" />

    <meta name="twitter:title" content="<?php echo esc_attr($title); ?>" />
    <meta name="twitter:image" content="<?php echo esc_attr($src[0]); ?>" />    
    <meta name="twitter:url" content="<?php the_permalink(); ?>" />
    <meta name="twitter:description" content="<?php if (!empty($twitter_metad)) echo esc_attr($twitter_metad); else the_excerpt(); ?>" />
    <?php //Deschideți tag-urile PHP
}
?>

Pentru cei interesați de funcționalitatea plugin-ului.

Titlul va fi concatenarea numelui paginii curente și numele site-ului.
Dacă există un câmp personalizat numit "metadescription", pluginul încearcă să ia descrierea din acest câmp. Altfel, ia descrierea din fragment.
Ca imagine, pluginul încearcă să utilizeze miniatura imaginii reprezentative a paginii.

Diego Soto

121

14 aug. 2014 02:12:12

Comentarii

Te rog să folosești esc_attr() pentru conținutul atributului HTML.

fuxia

14 aug. 2014 03:27:38

Am modificat să folosesc esc_attr() cum mi-ai spus. Mulțumesc.

Diego Soto

14 aug. 2014 07:19:48

Brian Fegter 10K · Accepted Answer · 2012-02-27T17:47:21Z

Aș folosi acțiunea wp_head. Aș plasa acest cod într-un plugin pentru a-l abstractiza de stratul de prezentare. Acest lucru permite scalabilitate și schimbarea temelor. De asemenea, previne orice daună colaterală la analize dacă un pas este ratat în migrarea de la o temă la alta.

add_action('wp_head', 'wpse_43672_wp_head');
function wpse_43672_wp_head(){
    //Închide tag-urile PHP 
    ?>
    ADAUGĂ AICI CODUL TĂU HTML
    <?php //Deschide tag-urile PHP
}

Brian Fegter

10K

27 feb. 2012 17:47:21