WordPress spesifiserer at topp- og bunnteksten til artikkelen laster PHP/JavaScript/CSS-kode

Hvis du bruker WordPress til å bygge et nettsted, hvordan kan du laste inn PHP/JavaScript/CSS-kode i toppteksten og bunnteksten til et bestemt innlegg eller en side?

Vi kan bruke WordPress sine kraftige tilpassede felt for å implementere forskjellige JavaScript-sider for et gitt innlegg eller sideinnlasting.

Denne artikkelen vil vise deg: Hvordan bruke tilpassede felt på WordPress, tilpassede JavaScript- eller CSS-filer?

Hvis du kan forstå, er egendefinerte feltverdier ikke så enkle som JavaScript- og CSS-filer.

Hvordan legge til egendefinerte felt i WordPress?

Vanligvis åpner du header.php-filen til WordPress-temaet ditt og sørger for at følgende kode er lagt til: ▼

<?php wp_head(); ?>

Hvordan tilpasse header i WordPressEn mer anbefalt tilnærming: via functions.php eller implementering av kodetillegg

Endre temaet direkte header.php eller footer.php Koden går lett tapt etter at temaet er oppdatert.

Tryggere og mer standardiserte praksiserLegg til følgende kode i det gjeldende temaet. functions.php I filen, eller ved å bruke kodesnutter Denne typen programtillegg brukes til å administrere tilpasset kode.

For å unngå å endre kjernetemafilene bruker vi... functions.php Monteringskode.

Trinn 1: Legg til funksjonskode

Vennligst legg til følgende PHP-kode i temaet ditt. functions.php På slutten av dokumentet, eller via kodesnutter Opprett en ny kodebit i plugin-modulen og lim den inn:

<?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;
        }
    }
}

(Merk: Hvis) functions.php Filen har allerede en fil på slutten. ?>Ikke legg den til gjentatte ganger; bare sett inn koden ovenfor direkte. ?> (Tidligere)

Trinn 2: Bruk på artikkelredigeringssiden

1. Få tilgang til WordPress-backend for å redigere et innlegg eller en side.
2. Finn den på redigeringssiden "Tilpassede felt" (Hvis du ikke ser metaboksen, klikk på «Visningsalternativer» øverst til høyre eller «Innstillinger» i Gutenberger Editor og sørg for at «Tilpassede felt» er merket av).
3. Klikk på Skriv inn nytt:
   • Navn Import:head (For headerkode) eller foot (Til bruk i bunnkoden).
   • Verdi Inndataboks: Lim inn HTML-, CSS- eller JS-koden du trenger å legge til.
4. Klikk på Legg til et egendefinert felt Og oppdatere/publisere artikler.

• Oppdatering av artikkelen vil tillate deg å kode temaet og angi verdier for disse egendefinerte feltene.

Siden du bare skriver ut koden som må lastes inn i "verdi", må du skrive inn følgende lignende kode i "verdi" ▼

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

eller ▼

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

for å sende ut koden ovenfor.

Fordelene med denne modifikasjonen:

1. tryggereIkke modifiser direkte header.php Og footer.phpDette forhindrer at koden blir overskrevet når temaet oppdateres.
2. Mer standardisertAnbefales å bruke WordPress add_action Krokbasert monteringskode.
3. Tydelig logikkÅ innkapsle funksjonalitet i funksjoner gjør senere vedlikehold enklere.