WordPress especifica que a cabeceira e o pé do artigo cargan código PHP/JavaScript/CSS

Se está a usarSitio web de WordPress, cómpre especificar un determinado artigo ou páxina en WordPress, cargar código PHP/JavaScript/CSS na cabeceira e no pé de páxina, como conseguilo?

Podemos usar os poderosos campos personalizados de WordPress para implementar diferentes páxinas JavaScript para unha determinada publicación ou carga de páxina.

Este artigo amosarache: Como usar campos personalizados en ficheiros WordPress, JavaScript ou CSS personalizados?

Se podes entender, os valores de campo personalizados non son tan sinxelos como os ficheiros JavaScript e CSS.

Como engadir campos personalizados en WordPress?

Normalmente, abre o ficheiro header.php do teu tema de WordPress e asegúrate de que se engadiu o seguinte código: ▼

<?php wp_head(); ?>

Como personalizar a cabeceira en WordPressUnha estratexia máis recomendada: a través de functions.php ou implementación de complementos de código

Modificar directamente o tema header.phpfooter.php O código pérdese facilmente despois de actualizar o tema.

Prácticas máis seguras e estandarizadasEngade o seguinte código ao tema actual. functions.php No ficheiro, ou usando Fragmentos de código Este tipo de complementos úsanse para xestionar código personalizado.

Para evitar modificar os ficheiros principais do tema, usamos... functions.php Código de montaxe.

Paso 1: Engadir código funcional

Engade o seguinte código PHP ao teu tema. functions.php Ao final do ficheiro, ou mediante Fragmentos de código Crea un novo fragmento de código no plugin e pégao:

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

(Nota: Se) functions.php O ficheiro xa ten un ficheiro ao final. ?>Non o engadas repetidamente; simplemente insire o código de arriba directamente. ?> (Anteriormente)

Paso 2: Usar na páxina de edición do artigo

  1. Accede ao backend de WordPress para editar unha entrada ou páxina.
  2. Atopao na páxina do editor "Campos personalizados" (Se non ves o metabox, fai clic en "Opcións de visualización" na esquina superior dereita ou en "Preferencias" no editor de Gutenberger e asegúrate de que estea marcada a opción "Campos personalizados").
  3. Prema en Introducir novo:
    • Nome Importar:head (Para o código de cabeceira) ou foot (Para usar no código inferior).
    • Valor Caixa de entrada: pega o código HTML, CSS ou JS que necesitas engadir.
  4. Prema en Engadir un campo personalizado E actualizar/publicar artigos.

WordPress especifica a cabeceira e pé de páxina do artigo para engadir código PHP/JavaScrip/CSS

  • A actualización do artigo permitirache codificar o tema e introducir valores para estes campos personalizados.

Xa que só mostras o código que debes cargar en "valor", tes que introducir o seguinte código similar en "valor" ▼

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

ou ▼

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

para emitir o código anterior.

As vantaxes desta modificación:

  1. 更安全: Non modificar directamente header.php E footer.phpIsto impide que o código se sobrescriba cando se actualice o tema.
  2. Máis estandarizadoRecoméndase o uso de WordPress add_action Código de montaxe baseado en ganchos.
  3. Lóxica claraEncapsular a funcionalidade dentro das funcións facilita o mantemento posterior.

发表 评论

O teu enderezo de correo electrónico non será publicado. Utilízanse os campos obrigatorios * Etiqueta

Directorio de artigos
Volver arriba