云策 WordPress 开发者社区

钩子文档

wp_body_open

查看官方原文 ↗
💡 云策文档标注

概述

wp_body_open 是一个 WordPress 动作钩子，在 body 标签打开后触发，允许开发者在页面主体开始处插入自定义代码。它从 WordPress 5.2 版本开始引入，常用于添加如 Google 标签管理器或粘性头部等元素。

关键要点

  • wp_body_open 钩子在 body 标签打开后执行，用于在页面顶部添加自定义内容。
  • 通过 add_action 函数挂接自定义函数，函数内应使用 echo 输出代码，而非 return。
  • 该钩子从 WordPress 5.2 版本开始可用，旧版本主题可能需要条件检查以确保兼容性。
  • 常见应用包括插入跟踪代码、粘性头部或任何需要在页面主体开始处显示的 HTML。

代码示例

// 添加 Google 标签管理器代码
add_action( 'wp_body_open', 'wpdoc_add_custom_body_open_code' );

function wpdoc_add_custom_body_open_code() {
    echo '<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-J4LMVLR" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>';
}

注意事项

  • 自定义函数必须使用 echo 输出内容，return 不会产生任何输出。
  • 在旧版 WordPress 中，可能需要添加条件检查来避免错误，例如使用 function_exists('wp_body_open')。
📄 原文内容

Triggered after the opening body tag.

Source

do_action( 'wp_body_open' );

View all references View on Trac View on GitHub

Used by Description
wp_body_open()wp-includes/general-template.php

Fires the wp_body_open action.

Changelog

Version Description
5.2.0 Introduced.

User Contributed Notes

  1. Skip to note 5 content


    rabmalin


    You must log in to vote on the helpfulness of this noteVote results for this note: 10You must log in to vote on the helpfulness of this note

    // Add Google Tag code which is supposed to be placed after opening body tag.
add_action( 'wp_body_open', 'wpdoc_add_custom_body_open_code' );

function wpdoc_add_custom_body_open_code() {
	echo '<!-- Google Tag Manager (noscript) --><noscript><iframe src="<a href="https://www.googletagmanager.com/ns.html?id=GTM-J4LMVLR&quot" rel="nofollow ugc">https://www.googletagmanager.com/ns.html?id=GTM-J4LMVLR"</a>; height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><!-- End Google Tag Manager (noscript) -->';
}

  3. Skip to note 7 content


    Keramot UL Islam


    You must log in to vote on the helpfulness of this noteVote results for this note: 1You must log in to vote on the helpfulness of this note

    Backward Compatibility
    A conditional check can make it compatible with older WordPress versions.

    
<html <?php language_attributes(); ?>>
  <head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">

    

  </head>

  <body <?php body_class(); ?>>

	


    

  </body>
</html>

    For More Information: https://make.wordpress.org/themes/2019/03/29/addition-of-new-wp_body_open-hook/

  4. Skip to note 8 content


    Rami Yushuvaev


    You must log in to vote on the helpfulness of this noteVote results for this note: -4You must log in to vote on the helpfulness of this note

    Basic usage:

    function custom_body_open_code() {
    return '<!-- some code -->';
}
add_action( 'wp_body_open', 'custom_body_open_code' );

    For more information read this post: https://generatewp.com/wordpress-5-2-action-that-every-theme-should-use/