【问题标题】:Where to add the JavaScript SDK code in the page.php of my WordPress theme for the Facebook Plugin?在我的 Facebook 插件的 WordPress 主题的 page.php 中添加 JavaScript SDK 代码的位置?
【发布时间】:2016-07-17 21:09:57
【问题描述】:

我不确定在哪里将 Facebook 为 Facebook 插件提供的代码添加到我的 page.php

这是我原来的page.php

<?php 
/**
* Theme Page Section for our theme.
*
* @package ThemeGrill
* @subpackage Spacious
* @since Spacious 1.0
*/
?>

<?php get_header(); ?>

<?php do_action( 'spacious_before_body_content' ); ?>

<div id="primary">
    <div id="content" class="clearfix">
        <?php while ( have_posts() ) : the_post(); ?>

            <?php get_template_part( 'content', 'page' ); ?>

            <?php
            do_action( 'spacious_before_comments_template' );
// If comments are open or we have at least one comment, load up the comment template
            if ( comments_open() || '0' != get_comments_number() )
                comments_template();                    
            do_action ( 'spacious_after_comments_template' );
            ?>

        <?php endwhile; ?>

    </div><!-- #content -->
</div><!-- #primary -->

<?php spacious_sidebar_select(); ?>

<?php do_action( 'spacious_after_body_content' ); ?>

<?php get_footer(); ?>

这是 Facebook 插件代码

<div id="fb-root"></div>
        <script>
            (function(d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s); js.id = id;
            js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
            fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));
        </script>

我询问了主题的支持在哪里插入 Facebook 插件代码,他们回答是这样的:

在正文选项卡之后,我们包含了一个动作挂钩:do_action('before'); 在您的子主题中创建一个函数,添加所需的代码并将其挂钩到上面的动作挂钩。 像这样的东西: 功能任何名称(){ 在此处粘贴您的代码(如果是 HTML,则正确使用 php 标签的开始/结束) } add_action('之前', 'any_name');

我没有看到任何 body 标签。

如果我在该行下方插入 Facebook 插件代码是否正确?

<?php do_action( 'spacious_before_body_content' ); ?>

所以它看起来像这样:

<?php 
/**
* Theme Page Section for our theme.
*
* @package ThemeGrill
* @subpackage Spacious
* @since Spacious 1.0
*/
?>

<?php get_header(); ?>

<?php do_action( 'spacious_before_body_content' ); ?>

    <div id="fb-root"></div>
        <script>
            (function(d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s); js.id = id;
            js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
            fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));
        </script>

<div id="primary">
    <div id="content" class="clearfix">
        <?php while ( have_posts() ) : the_post(); ?>

            <?php get_template_part( 'content', 'page' ); ?>

            <?php
            do_action( 'spacious_before_comments_template' );
// If comments are open or we have at least one comment, load up the comment template
            if ( comments_open() || '0' != get_comments_number() )
                comments_template();                    
            do_action ( 'spacious_after_comments_template' );
            ?>

        <?php endwhile; ?>

    </div><!-- #content -->
</div><!-- #primary -->

<?php spacious_sidebar_select(); ?>

<?php do_action( 'spacious_after_body_content' ); ?>

<?php get_footer(); ?>

如果您还可以提供一个简短的解释或链接,我可以在其中了解如何和为什么,如果这对我来说是一个学习新东西的好机会。

edit_1: THIS 是我想插入到我网站页面的插件。订阅时事通讯后将添加到“感谢页面”中。您可以尝试设置它并执行“获取代码”,这样您就会看到它的内容。

为了将插件添加到您的网站,您必须添加 2 个代码:

  1. JavaScript SDK 代码(上面称为 Facebook 插件代码):您必须将其添加到 .php 文件中的某个位置才能将您的网站连接到您的 Facebook 页面;
  2. 显示内容的实际代码:您必须将此代码放在您希望插件出现的位置,例如在帖子中、页面中或边栏中。

我注意到的是,如果我将第一个代码(JavaScript SDK)添加到文件 page.php 中,我只能将第二个代码(显示内容的那个)添加到页面中(而不是例如侧边栏)。如果我将第一个代码添加到 header.php 中,我将能够在任何地方添加第二个代码。

问题是,我不知道如何添加第一个代码以及在哪里添加。我的意思是,实际上我不知道从哪里开始将代码写入 .php 文件。

edit_2: 好的,这里是我的标题的摘录,我应该将代码粘贴到 SPACE ONE、SPACE TWO 还是其他地方?

<body <?php body_class(); ?>>
--SPACE ONE--
<?php   do_action( 'before' ); ?>
--SPACE TWO--
<div id="page" class="hfeed site">
    <?php do_action( 'spacious_before_header' ); ?>
    <header id="masthead" class="site-header clearfix">
    </header>

关于钩子,你是对的,它让我很困惑!啊哈!

【问题讨论】:

    标签: javascript php wordpress facebook


    【解决方案1】:

    一般来说,当你在任何页面上添加 Facebook Script 时,你只需要将代码 sn-p 放在 body 标签之后。 wordpress 页面将被添加到 body 标记内,因此您在上面所做的一切都可以正常工作。

    在正文选项卡之后,我们包含了一个动作挂钩:do_action('before');在您的子主题中创建一个函数,添加所需的代码并将其挂钩到上面的动作挂钩。像这样的东西: function any_name() { 在此处粘贴您的代码(如果是 HTML,则正确使用 php 标签的开始/结束)} add_action( 'before', 'any_name' );

    但这里提到的是一种更好的方法。您需要为您的 facebook 脚本创建一个挂钩。这样,每次添加到每个页面时,您只需调用 Action 而无需复制 sn-p。

    有关更多信息,请查看 Facebook SDK 文档。

    不得使用 display: none 或 visibility: hidden 隐藏 fb-root 元素,否则 SDK 的某些部分将无法在 Internet Explorer 中正常工作。

    SDK 将元素插入到 fb-root 中,这些元素期望相对于正文或相对于靠近页面顶部的元素定位。最好 fb-root 元素不在具有 position: absolute 或 position: relative 的元素内。如果您必须将 fb-root 元素放置在定位元素内,那么您还应该将其放置在靠近主体顶部的位置,否则 SDK 的某些部分可能无法正常工作。

    【讨论】:

    • 对不起,我不是程序员,我不明白你在说什么。我已经阅读了FB SDK Doc,但我没有找到任何可以帮助我的东西。 Facebook 告诉我将上面提到的名为 Facebook 插件代码 的代码添加到文件 page.php 中。实际上,我可以将它添加到 header.php 中。问题是,我不知道在哪里。我试图搜索如何制作钩子,但找不到任何简单的指南来创建这个钩子。我只想将代码添加到我在 WordPress 上的子主题中。
    • Ow.. Facebook 插件已经准备好集成代码。它可以在 Wordpress 页面上运行。顺便问一下,您要添加什么 facebook 插件?以及您希望在哪些页面添加该插件?
    • 请查看第一篇文章底部的edit_1 @severinlorillajr
    • 好吧,您可以在 header.php 中添加 javascript 代码(第 1 部分),然后将其粘贴在打开的 &lt;body&gt; 标记之后。然后在您要添加插件的模板上(如感谢页面,只需添加 html(第二部分)。就是这样!不要费心添加钩子和 wordpress 操作,它只会让您感到困惑。:)跨度>
    • 请查看第一篇文章底部的edit_2,感谢您的帮助@severinolorillajr
    猜你喜欢
    • 1970-01-01
    • 2014-06-08
    • 1970-01-01
    • 2015-04-28
    • 1970-01-01
    • 2017-07-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多