WordPress는 기사의 머리글과 바닥글이 PHP/JavaScript/CSS 코드를 로드하도록 지정합니다.

WordPress를 사용하여 웹사이트를 구축하는 경우 , 특정 게시물이나 페이지의 헤더와 푸터에 PHP/JavaScript/CSS 코드를 어떻게 삽입할 수 있을까요?

WordPress의 강력한 사용자 정의 필드를 사용하여 주어진 게시물 또는 페이지 로드에 대해 다른 JavaScript 페이지를 구현할 수 있습니다.

이 기사에서는 WordPress, 사용자 정의 JavaScript 또는 CSS 파일에서 사용자 정의 필드를 사용하는 방법을 보여줍니다.

이해할 수 있다면 사용자 정의 필드 값은 JavaScript 및 CSS 파일만큼 간단하지 않습니다.

WordPress에 사용자 정의 필드를 추가하는 방법은 무엇입니까?

일반적으로 워드프레스 테마의 header.php 파일을 열고 다음 코드가 추가되었는지 확인하십시오. ▼

<?php wp_head(); ?>

WordPress에서 헤더를 사용자 정의하는 방법보다 권장되는 접근 방식: functions.php 또는 코드 플러그인 구현

테마를 직접 수정하세요 header.phpfooter.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. 워드프레스 관리자 페이지에 접속하여 게시물이나 페이지를 편집하세요.
  2. 에디터 페이지에서 찾아보세요 "사용자 정의 필드" (메타박스가 보이지 않으면 오른쪽 상단의 "표시 옵션"을 클릭하거나 구텐베르거 편집기에서 "환경 설정"을 클릭하고 "사용자 지정 필드"가 선택되어 있는지 확인하십시오.)
  3. 클릭 새 항목을 입력하세요:
    • 이름 설명:head (헤더 코드용) 또는 foot (하단 코드에 사용).
    • 입력란: 추가해야 할 HTML, CSS 또는 JS 코드를 붙여넣으세요.
  4. 클릭 사용자 정의 필드를 추가하세요 그리고 기사를 업데이트/게시합니다.

WordPress에서는 PHP/JavaScrip/CSS 코드를 추가하기 위해 기사 머리글과 바닥글을 지정합니다.

  • 기사를 업데이트하면 테마를 코딩하고 이러한 사용자 정의 필드에 값을 입력할 수 있습니다.

"값"에 로드해야 하는 코드만 출력하므로 "값"에 다음과 유사한 코드를 입력해야 합니다 ▼

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

또는 ▼

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

위의 코드를 출력합니다.

이 수정 사항의 장점은 다음과 같습니다.

  1. 더 안전한직접 수정하지 마세요 header.phpfooter.php이렇게 하면 테마가 업데이트될 때 코드가 덮어쓰여지는 것을 방지할 수 있습니다.
  2. 보다 표준화된워드프레스 사용을 권장합니다. add_action 후크 기반 장착 코드.
  3. 명확한 논리기능을 함수 내부에 캡슐화하면 후속 유지 관리가 더 쉬워집니다.

Chen Weiliang님의 블로그( https://www.chenweiliang.com/ ) 에 공유된 "WordPress에서 게시물 헤더와 푸터를 지정하기 위한 PHP/JavaScript/CSS 코드 로드하기"라는 글이 여러분께 도움이 되기를 바랍니다.

이 기사 링크( https://www.chenweiliang.com/cwl-2022.html )를 자유롭게 공유해 주세요.

더 많은 숨겨진 트릭을 알아보려면🔑 Telegram 채널에 가입하세요!

마음에 드셨다면 공유하고 좋아요를 눌러주세요! 여러분의 공유와 좋아요는 저희의 지속적인 원동력이 됩니다!

 

发表 评论

您的邮箱地址不会被公开。必填项已用*标注

위쪽으로 스크롤