WordPress specifică că antetul și subsolul articolului încarcă cod PHP/JavaScript/CSS

Dacă folosești WordPress pentru a construi un site web, cum poți încărca cod PHP/JavaScript/CSS în antetul și subsolul unei anumite postări sau pagini?

Putem folosi câmpurile personalizate puternice ale WordPress pentru a implementa diferite pagini JavaScript pentru o anumită postare sau încărcare a paginii.

Acest articol vă va arăta: Cum să utilizați câmpuri personalizate pe fișiere WordPress, JavaScript sau CSS personalizate?

Dacă puteți înțelege, valorile câmpurilor personalizate nu sunt la fel de simple ca fișierele JavaScript și CSS.

Cum să adăugați câmpuri personalizate în WordPress?

De obicei, deschideți fișierul header.php al temei WordPress și asigurați-vă că a fost adăugat următorul cod: ▼

<?php wp_head(); ?>

Cum să personalizați antetul în WordPressO abordare mai recomandată: prin functions.php sau implementarea pluginului de cod

Modificați direct tema header.php 或 footer.php Codul se pierde ușor după actualizarea temei.

Practici mai sigure și mai standardizateAdăugați următorul cod la tema curentă. functions.php În fișier sau folosind Fragmente de cod Aceste tipuri de pluginuri sunt folosite pentru a gestiona cod personalizat.

Pentru a evita modificarea fișierelor temei principale, folosim... functions.php Cod de montare.

Pasul 1: Adăugați cod funcțional

Te rugăm să adaugi următorul cod PHP la tema ta. functions.php La sfârșitul fișierului sau prin intermediul Fragmente de cod Creați un nou fragment de cod în plugin și lipiți-l:

<?php
/**
 * 指定文章/页面加载 Head 自定义字段代码
 */
add_action('wp_head', 'add_custom_head_code');

function add_custom_head_code() {
    // 只在文章详情页和独立页面执行
    if (is_single() || is_page()) {
        global $post;

        // 获取自定义字段 'head' 的值
        $head = get_post_meta($post->ID, 'head', true);

        // 如果有值，则输出到 head
        if (!empty($head)) {
            echo $head;
        }
    }
}

/**
 * 指定文章/页面加载 Foot 自定义字段代码
 */
add_action('wp_footer', 'add_custom_foot_code', 99);

function add_custom_foot_code() {
    // 只在文章详情页和独立页面执行
    if (is_single() || is_page()) {
        global $post;

        // 获取自定义字段 'foot' 的值
        $foot = get_post_meta($post->ID, 'foot', true);

        // 如果有值，则输出到 footer
        if (!empty($foot)) {
            echo $foot;
        }
    }
}

(Notă: Dacă) functions.php Fișierul are deja un fișier la sfârșit. ?>Vă rugăm să nu îl adăugați în mod repetat; introduceți pur și simplu codul de mai sus direct. ?> (Anterior)

Pasul 2: Utilizați în pagina de editare a articolului

1. Accesează backend-ul WordPress pentru a edita o postare sau o pagină.
2. Găsește-l pe pagina editorului „Câmpuri personalizate” (Dacă nu vedeți metabox-ul, faceți clic pe „Opțiuni de afișare” în colțul din dreapta sus sau pe „Preferințe” în Editorul Gutenberger și asigurați-vă că este bifată opțiunea „Câmpuri personalizate”).
3. Click pe Introduceți nou:
   • Nume Import:head (Pentru codul antetului) sau foot (Pentru utilizare în codul de jos).
   • Valoare Casetă de introducere: Lipiți codul HTML, CSS sau JS pe care trebuie să îl adăugați.
4. Click pe Adăugați un câmp personalizat Și actualizați/publicați articole.

• Actualizarea articolului vă va permite să codificați tema și să introduceți valori pentru aceste câmpuri personalizate.

Deoarece scoateți doar codul care trebuie încărcat în „valoare”, trebuie să introduceți următorul cod similar în „valoare” ▼

<script type="text/javascript">...</script>

sau ▼

<style type="text/css">...</style>

pentru a scoate codul de mai sus.

Avantajele acestei modificări:

1. mai sigurNu modificați direct header.php 和 footer.phpAcest lucru previne suprascrierea codului la actualizarea temei.
2. Mai standardizatSe recomandă utilizarea WordPress add_action Cod de montare bazat pe cârlig.
3. Logică clarăÎncapsularea funcționalității în funcții facilitează mentenanța ulterioară.