Artikkelihakemisto
Jos käytät WordPressiä verkkosivuston rakentamiseen, miten voit ladata PHP/JavaScript/CSS-koodia tietyn viestin tai sivun ylätunnisteeseen ja alatunnisteeseen?
Voimme käyttää WordPressin tehokkaita mukautettuja kenttiä erilaisten JavaScript-sivujen toteuttamiseen tietylle viestille tai sivulataukselle.
Tämä artikkeli näyttää sinulle: Kuinka käyttää mukautettuja kenttiä WordPressissä, mukautettuja JavaScript- tai CSS-tiedostoja?
Jos ymmärrät, mukautetut kenttäarvot eivät ole yhtä yksinkertaisia kuin JavaScript- ja CSS-tiedostot.
Kuinka lisätä mukautettuja kenttiä WordPressiin?
Avaa yleensä WordPress-teemasi header.php-tiedosto ja varmista, että seuraava koodi on lisätty: ▼
<?php wp_head(); ?>
Otsikon mukauttaminen WordPressissäSuositeltavampi lähestymistapa: kautta functions.php tai koodilaajennuksen toteutus
Muokkaa teemaa suoraan header.php 或 footer.php Koodi katoaa helposti teeman päivityksen jälkeen.
Turvallisemmat ja standardoidummat käytännötLisää seuraava koodi nykyiseen teemaan. functions.php Tiedostossa tai käyttämällä Koodinpätkät Tämän tyyppisiä laajennuksia käytetään mukautetun koodin hallintaan.
Jotta vältyttäisiin muokkaamasta ydinteeman tiedostoja, käytämme... functions.php Asennuskoodi.
Vaihe 1: Lisää toiminnallinen koodi
Lisää seuraava PHP-koodi teemaasi. functions.php Tiedoston lopussa tai sen kautta Koodinpätkät Luo uusi koodinpätkä laajennukseen ja liitä se:
<?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;
}
}
}
(Huomautus: Jos) functions.php Tiedoston lopussa on jo tiedosto. ?>Älä lisää sitä toistuvasti; lisää vain yllä oleva koodi suoraan. ?> (Aiemmin)
Vaihe 2: Käytä artikkelin muokkaussivulla
- Käytä WordPress-taustajärjestelmää muokataksesi julkaisua tai sivua.
- Löydät sen editorin sivulta "Mukautetut kentät" (Jos et näe metaruutua, napsauta "Näyttöasetukset" oikeassa yläkulmassa tai "Asetukset" Gutenberger Editorissa ja varmista, että "Mukautetut kentät" on valittuna).
- 点击 Syötä uusi:
- Nimi Tuoda:
head(Otsikkokoodia varten) taifoot(Käytettäväksi pohjakoodissa). - Arvo Syöttökenttä: Liitä lisättävä HTML-, CSS- tai JS-koodi.
- Nimi Tuoda:
- 点击 Lisää mukautettu kenttä Ja päivittää/julkaista artikkeleita.

- Päivittämällä artikkelin voit koodata teeman ja syöttää arvot näihin mukautettuihin kenttiin.
Koska annat vain koodin, joka on ladattava "arvoon", sinun on syötettävä seuraava samanlainen koodi kohtaan "arvo" ▼
<script type="text/javascript">...</script>
tai ▼
<style type="text/css">...</style>
tulostaaksesi yllä olevan koodin.
Tämän muunnoksen edut:
- turvallisempiÄlä muokkaa suoraan
header.php和footer.phpTämä estää koodin päällekirjoittamisen teeman päivitysten yhteydessä. - Standardoidumpi: WordPressin käyttö suositeltavaa
add_actionKoukkupohjainen kiinnityskoodi. - Selkeä logiikkaToiminnallisuuden kapselointi funktioiden sisään helpottaa myöhempää ylläpitoa.
Toivottavasti Chen Weiliangin blogissa ( https://www.chenweiliang.com/ ) jaetusta artikkelista "Loading PHP/JavaScript/CSS Code for Specifying Post Headers and Footers in WordPress" on sinulle hyötyä.
Voit vapaasti jakaa tämän artikkelin linkin: https://www.chenweiliang.com/cwl-2022.html
