WordPress визначає верхній і нижній колонтитули статті для завантаження коду PHP/JavaScript/CSS

Якщо використовуватиВеб-сайт WordPress, вам потрібно вказати певну статтю чи сторінку в WordPress, завантажити код PHP/JavaScript/CSS у верхній та нижній колонтитул, як цього досягти?

Ми можемо використовувати потужні настроювані поля WordPress, щоб реалізувати різні сторінки JavaScript для певної публікації чи завантаження сторінки.

Ця стаття покаже вам: як використовувати власні поля на WordPress, спеціальні файли JavaScript або CSS?

Якщо ви розумієте, значення спеціальних полів не такі прості, як файли JavaScript і CSS.

Як додати власні поля в WordPress?

Зазвичай, відкрийте файл header.php у вашій темі WordPress та переконайтеся, що додано наступний код: ▼

<?php wp_head(); ?>

Як налаштувати заголовок у WordPressБільш рекомендований підхід: через functions.php або реалізація плагіна коду

Безпосередньо змінювати тему header.php 或 footer.php Код легко загубитися після оновлення теми.

Безпечніші та стандартизованіші практикиДодайте наступний код до поточної теми. functions.php У файлі або за допомогою Фрагменти коду Ці типи плагінів використовуються для керування користувацьким кодом.

Щоб уникнути зміни основних файлів теми, ми використовуємо... functions.php Код монтування.

Крок 1: Додавання функціонального коду

Будь ласка, додайте наступний PHP-код до вашої теми. functions.php В кінці документа або через Фрагменти коду Створіть новий фрагмент коду в плагіні та вставте його:

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

(Примітка: Якщо) functions.php Файл вже має файл в кінці. ?>Будь ласка, не додавайте його повторно; просто вставте код вище безпосередньо. ?> (Раніше)

Крок 2: Використання на сторінці редагування статті

1. Отримайте доступ до серверної частини WordPress, щоб редагувати публікацію або сторінку.
2. Знайдіть це на сторінці редактора "Налаштовувані поля" (Якщо ви не бачите метабоксу, натисніть «Параметри відображення» у верхньому правому куті або «Налаштування» в редакторі Gutenberger і переконайтеся, що позначено «Налаштовувані поля»).
3. 点击 Введіть нове:
   • Ім'я введіть:head (Для коду заголовка) або foot (Для використання в нижньому коді).
   • Значення Поле введення: Вставте код HTML, CSS або JS, який потрібно додати.
4. 点击 Додати настроюване поле І оновлювати/публікувати статті.

• Оновлення статті дозволить вам закодувати тему та ввести значення для цих спеціальних полів.

Оскільки ви виводите лише код, який потрібно завантажити в "value", вам потрібно ввести наступний подібний код у "value" ▼

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

або ▼

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

щоб вивести наведений вище код.

Переваги цієї модифікації:

1. безпечнішеНе змінюйте безпосередньо header.php і footer.phpЦе запобігає перезапису коду під час оновлення теми.
2. Більш стандартизованийРекомендовано використовувати WordPress add_action Код монтування на основі гачків.
3. Чітка логікаІнкапсуляція функціональності всередині функцій спрощує подальше обслуговування.