WordPress spezifizéiert datt den Header an de Fouss vum Artikel PHP/JavaScript/CSS Code lued

Wann Dir benotztWordPress Websäit, Dir musst e bestëmmten Artikel oder Säit a WordPress spezifizéieren fir PHP/JavaScript/CSS Code am Header a Fousszeilen ze lueden.Wéi erreechen ech dat?

Mir kënne WordPress 'mächteg personaliséiert Felder benotze fir verschidde JavaScript Säiten fir e bestëmmte Post oder Säitbelaaschtung ëmzesetzen.

Dësen Artikel weist Iech: Wéi benotzen ech personaliséiert Felder op WordPress, Custom JavaScript oder CSS Dateien?

Wann Dir kënnt verstoen, sinn personaliséiert Feldwäerter net sou einfach wéi JavaScript an CSS Dateien.

Wéi addéiere personaliséiert Felder a WordPress?

通常是打开WordPress主题的header.php 页眉文件,确保已经添加以下代码 ▼

<?php wp_head(); ?>

Wéi personaliséiere Dir Header a WordPress?更推荐的方式:通过 functions.php 或代码插件实现

直接修改主题的 header.php Ëff footer.php 容易在主题更新后丢失代码。

更安全、更规范的做法是将以下代码添加到当前主题的 functions.php 文件中,或者使用 Code Snippets 这类插件来管理自定义代码。

为了避免修改主题核心文件,我们通过 functions.php 挂载代码。

第一步:添加功能代码

请将以下 PHP 代码添加到你的主题 functions.php 文件末尾,或者通过 Code Snippets 插件新建一个代码片段并粘贴:

<?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 文件末尾已经有 ?>,请不要重复添加,直接把上面的代码插在 ?> 之前即可)

第二步:在文章编辑页使用

  1. 进入 WordPress 后台,编辑某篇文章或页面。
  2. 在编辑器页面找到 “自定义字段” metabox(如果没看到,请点击右上角的“显示选项”或古腾堡编辑器的“偏好设置”,确保勾选了“自定义字段”)。
  3. klickt “输入新的”:
    • 名称 (Name) Import:head (用于头部代码) 或 foot (用于底部代码)。
    • 值 (Value) 输入框:粘贴你需要添加的 HTML、CSS 或 JS 代码。
  4. klickt “添加自定义字段” 并更新/发布文章。

WordPress spezifizéiert den Artikel Header a Fousszeilen fir PHP / JavaScrip / CSS Code ze addéieren

  • D'Aktualiséierung vum Artikel erlaabt Iech d'Thema ze codéieren a Wäerter fir dës personaliséiert Felder aginn.

Well Dir nëmmen de Code ausgëtt, deen an "Wäert" gelueden muss ginn, musst Dir de folgenden ähnleche Code an "Wäert" aginn ▼

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

oder ▼

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

fir den uewe genannte Code auszeginn.

这样修改的好处:

  1. 更安全:不直接修改 header.php an footer.php,避免主题更新时代码被覆盖。
  2. 更规范:使用 WordPress 推荐的 add_action 钩子方式挂载代码。
  3. 逻辑清晰:将功能封装在函数中,方便后续维护。

Comments

Är Email Adress gëtt net publizéiert ginn. Néideg Felder gi benotzt * Etikett

Minière zu Top