{"id":2621,"date":"2025-06-11T04:44:06","date_gmt":"2025-06-10T20:44:06","guid":{"rendered":"https:\/\/www.zhaozhao123.cn\/wpcms\/wpdt\/2621.html"},"modified":"2025-06-11T04:44:06","modified_gmt":"2025-06-10T20:44:06","slug":"%e5%a6%82%e4%bd%95%e5%9c%a8wordpress%e6%96%87%e7%ab%a0%e4%b8%ad%e6%b7%bb%e5%8a%a0%e4%bd%9c%e8%80%85%e4%bf%a1%e6%81%af%e6%a1%86%ef%bc%885%e7%a7%8d%e6%96%b9%e6%b3%95%ef%bc%89","status":"publish","type":"post","link":"https:\/\/www.zhaozhao123.cn\/wpcms\/post\/2621.html","title":{"rendered":"\u5982\u4f55\u5728WordPress\u6587\u7ae0\u4e2d\u6dfb\u52a0\u4f5c\u8005\u4fe1\u606f\u6846\uff085\u79cd\u65b9\u6cd5\uff09"},"content":{"rendered":"
\r\n
\r\n
\r\n
\r\n
\r\n
\"Bug编译狮\"<\/figure>\r\n\r\n\r\n\r\n

Bug编译狮<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\n\r\n

\r\n
\r\n

在WordPress的文章页面上添加作者信息框是一个常见的需求，可以帮助用户了解文章的来源和作者背景。以下是五种不同的方法来实现这一功能：<\/p>\n

方法一：使用插件“Author Box”<\/h3>\n
    \n
  1. \n

    安装插件<\/strong>：<\/p>\n

      \n
    • 登录到您的WordPress后台。<\/li>\n
    • 找到“插件”部分，点击“安装新插件”，搜索并选择“Author Box”。<\/li>\n
    • 安装完成后，启用该插件。<\/li>\n<\/ul>\n<\/li>\n
    • \n

      配置插件<\/strong>：<\/p>\n

        \n
      • 在插件设置中，您可以调整显示位置、样式等选项。<\/li>\n<\/ul>\n<\/li>\n
      • \n

        添加到文章<\/strong>：<\/p>\n

          \n
        • 当您编辑文章时，只需在适当的位置插入<div class=\"author-box\"><\/code>标签即可。<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n

          示例代码：<\/h3>\n
          <div class=\"author-box\">\n    <h4>作者名<\/h4>\n    <span>作者描述或链接<\/span>\n<\/div><\/code><\/pre>\n
          方法二：手动创建HTML元素<\/h3>\n
            \n
          1. \n
            编辑模板文件<\/strong>：<\/p>\n
              \n
            • 寻找与文章相关的内容区域，如single.php<\/code>或page.php<\/code>。<\/li>\n
            • 插入以下HTML代码：<\/li>\n<\/ul>\n
              <div class=\"author-info\">\n   <img src=\"{{ author.image }}\" alt=\"{{ author.name }}\">\n   <p>{{ author.bio }}<\/p>\n<\/div><\/code><\/pre>\n<\/li>\n
            • \n
              替换占位符<\/strong>：<\/p>\n
                \n
              • 将{{ author.image }}<\/code>, {{ author.name }}<\/code>, 和{{ author.bio }}<\/code>替换为实际的值。<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n
                方法三：使用PHP函数输出作者信息<\/h3>\n
                  \n
                1. \n
                  编辑文章模板<\/strong>：<\/p>\n
                    \n
                  • 找到与文章相关的模板文件，例如single.php<\/code>或page.php<\/code>。<\/li>\n
                  • 添加如下PHP代码：<\/li>\n<\/ul>\n
                    <?php if (is_single()) : ?>\n   <div class=\"author-info\">\n       <?php the_author_meta('display_name'); ?> | \n       <?php the_author_meta('description'); ?>\n   <\/div>\n<?php endif; ?><\/code><\/pre>\n<\/li>\n
                  • \n
                    查看效果<\/strong>：<\/p>\n
                      \n
                    • 这样，当文章单页打开时，会自动显示作者的名字和简介。<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n
                      方法四：使用自定义字段<\/h3>\n
                        \n
                      1. \n
                        添加自定义字段<\/strong>：<\/p>\n
                          \n
                        • 登录到WordPress管理后台，进入“帖子”或“页面”列表，找到您想添加作者信息的页面。<\/li>\n
                        • 点击“编辑”按钮，然后转到“文本”区域。<\/li>\n
                        • 为每个作者添加一个自定义字段，例如“作者姓名”和“作者描述”。<\/li>\n<\/ul>\n<\/li>\n
                        • \n
                          获取字段数据<\/strong>：<\/p>\n
                            \n
                          • 使用PHP获取这些自定义字段的数据并在文章中显示。<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n
                            示例代码：<\/h3>\n
                            <?php $authorName = get_field('author_name', 'post'); ?>\n<?php echo $authorName . ' ' . get_field('author_description', 'post'); ?><\/code><\/pre>\n
                            方法五：使用短代码<\/h3>\n
                              \n
                            1. \n
                              创建短代码<\/strong>：<\/p>\n
                                \n
                              • 创建一个新的短代码，例如[author_info]<\/code>。<\/li>\n
                              • 编辑这个短代码以提取作者信息并显示。<\/li>\n<\/ul>\n<\/li>\n
                              • \n
                                应用短代码<\/strong>：<\/p>\n
                                  \n
                                • 在文章中插入[author_info]<\/code>短代码。<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n
                                  结论<\/h3>\n
                                  以上五种方法各有优缺点，可以根据具体需求和网站布局灵活选择适合的方法。通过这种方式，不仅能够提升用户体验，还能增强网站的专业感和个性化体验。<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>
                                  \r\n
                                  \r\n
                                  \r\n
                                  \r\n
                                  \r\n
                                  \"黑板前的Bug语法讲师\"<\/figure>\r\n\r\n\r\n\r\n
                                  黑板前的Bug语法讲师<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\n\r\n
                                  \r\n
                                  \r\n
                                  在WordPress中添加作者信息框是一种常见的需求，它可以让访客了解作者是谁以及他们的身份背景等信息。以下是我将介绍的五种方法来实现这一功能：<\/p>\n
                                  方法一：使用author<\/code>标签<\/h3>\n
                                  示例代码：<\/h4>\n
                                  <?php the_author_meta('display_name'); ?><\/code><\/pre>\n
                                  解释：<\/h4>\n
                                  这个简单的示例代码通过the_author_meta()<\/code>函数获取当前文章的作者姓名并显示出来。<\/p>\n
                                  方法二：自定义主题插件<\/h3>\n
                                  示例代码：<\/h4>\n
                                    \n
                                  1. 创建一个名为 add_author_info.php<\/code> 的文件。<\/li>\n
                                  2. 在其中添加以下代码：<\/li>\n<\/ol>\n
                                    function add_author_info() {\n    $author = get_the_author();\n    if (is_user_logged_in()) {\n        echo '<div class=\"author-info\">';\n        echo '<img src=\"' . get_avatar(get_current_user_id(), 30) . '\" alt=\"' . esc_html($author->display_name) . '\">';\n        echo '<h3>' . esc_html($author->display_name) . '<\/h3>';\n        echo '<p>' . esc_html($author->name) . '<\/p>';\n        echo '<\/div>';\n    }\n}\nadd_action('wp_head', 'add_author_info');<\/code><\/pre>\n
                                      \n
                                    1. 在WordPress安装目录下的functions.php<\/code>文件中启用该插件，如：<\/li>\n<\/ol>\n
                                      require_once ABSPATH . 'wp-admin\/includes\/plugin.php';\nregister_activation_hook(__FILE__, 'uninstall_author_info');\nregister_deactivation_hook(__FILE__, 'deactivate_author_info');\nregister_script('author_info', plugin_dir_url(__FILE__) . 'js\/add_author_info.js', array('jquery'));\nadd_action('admin_init', 'enable_author_info');<\/code><\/pre>\n
                                        \n
                                      1. 激活此插件后，在WordPress顶部菜单栏或设置 > 首页和搜索 > 站点标题和描述处启用“显示用户头像”。<\/li>\n<\/ol>\n
                                        方法三：使用第三方库<\/h3>\n
                                        示例代码：<\/h4>\n
                                          \n
                                        1. 使用 wp-author-box<\/code> 和 wp-custom-meta<\/code>。<\/li>\n
                                        2. 在HTML模板文件中添加以下代码：<\/li>\n<\/ol>\n
                                          <div id=\"author-box\">\n    <?php the_author_meta( 'display_name' ); ?>\n<\/div><\/code><\/pre>\n
                                            \n
                                          1. 在您的主题或其他自定义样式中引入 wp-author-box<\/code> 和 wp-custom-meta<\/code> CSS类以调整外观。<\/li>\n<\/ol>\n
                                            方法四：使用自定义模块<\/h3>\n
                                            示例代码：<\/h4>\n
                                              \n
                                            1. 创建一个名为 author-info-module.php<\/code> 的文件。<\/li>\n
                                            2. 在其中添加以下代码：<\/li>\n<\/ol>\n
                                              function custom_module() {\n    wp_register_script(\n        'custom-author-info',\n        plugins_url('\/js\/custom-author-info.js', __FILE__),\n        array(),\n        '1.0'\n    );\n    wp_enqueue_script('custom-author-info');\n\n    register_block_type(\n        BLOCK_ID,\n        [\n            'editor_style' => false,\n            'render_callback' => function () {\n                return '<div class=\"author-info\"><img src=\"' . get_avatar(get_current_user_id(), 30) . '\" alt=\"' . esc_html(get_the_author_meta('display_name')) . '\">' . esc_html(get_the_author_meta('display_name')) . '<\/div>';\n            },\n        ]\n    );\n}\nadd_action('init', 'custom_module');<\/code><\/pre>\n
                                                \n
                                              1. 启用此模块并在WordPress顶部菜单栏启用“显示用户头像”。<\/li>\n<\/ol>\n
                                                方法五：利用自定义插件<\/h3>\n
                                                示例代码：<\/h4>\n
                                                  \n
                                                1. 创建一个名为 author_info_shortcode.php<\/code> 的文件。<\/li>\n
                                                2. 在其中添加以下代码：<\/li>\n<\/ol>\n
                                                  function author_info_shortcode() {\n    $args = array(\n        'title' => 'Author Info',\n        'fields' => array(\n            'display_name' => array(\n                'label' => __('Name'),\n                'type' => 'text',\n            ),\n            'job_title' => array(\n                'label' => __('Job Title'),\n                'type' => 'text',\n            ),\n            'bio' => array(\n                'label' => __('Bio'),\n                'type' => 'textarea',\n            ),\n        ),\n    );\n\n    ob_start();\n    do_shortcode('[author_info]');\n    $content = ob_get_clean();\n\n    \/\/ Replace shortcode with your own content.\n    return $content;\n}\nadd_shortcode('author_info', 'author_info_shortcode');<\/code><\/pre>\n
                                                    \n
                                                  1. 将上述代码保存为 author_info_shortcode.php<\/code> 并将其放在 WordPress主题的 inc\/shortcodes\/author_info<\/code> 文件夹下。<\/li>\n<\/ol>\n
                                                    结论<\/h3>\n
                                                    以上五种方法展示了如何在WordPress文章中添加作者信息框。每种方法都有其适用场景和优缺点，请根据实际需求选择最适合的方法。<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\n","protected":false},"excerpt":{"rendered":"
                                                    Bug编译狮 在WordPress的文章页面上添加作者信息框是&#1..<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[59],"tuisongtax":[],"class_list":["post-2621","post","type-post","status-publish","format-standard","hentry","category-wpdt","tag-pzjc"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/posts\/2621","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/comments?post=2621"}],"version-history":[{"count":0,"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/posts\/2621\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/media?parent=2621"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/categories?post=2621"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/tags?post=2621"},{"taxonomy":"tuisongtax","embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/wpcms\/wp-json\/wp\/v2\/tuisongtax?post=2621"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}