社交媒体上的链接跟随按钮将不起作用

Question

我在社交媒体页面上使用以下三个按钮，即Facebook，Twitter和Google+。 唯一的问题是，Facebook和Twitter按钮上的跟随链接不起作用，Google +起作用，而其他两个按钮则不起作用，通过链接我指的是按钮，您可以在其中看到关注者/喜欢人数，然后查看您以用户的身份单击它时，它就可以跟随/喜欢该页面，而无需进入页面，但是这些按钮将无法工作，甚至不会显示“链接鼠标悬停”（当您将鼠标悬停在链接上并且鼠标图标从指向手的箭头）。

我直接从Facebook和Twitter提供的开发工具包中获取了代码。 重要说明，我正在使用css来移动按钮，但是如果我选择不使用css来移动它们，而只是将它们默认保留在随机位置，则链接有效，因此我认为可能存在问题那里。

我已经删除了后续页面的链接，但是该链接仍然可以正常运行，因为它是“ href”，所以不要介意。

html代码：

<!DOCTYPE html>
<html>

<head>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
</head>

<body>

        <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.3";
            fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));</script>


        <div id="header">
        </div>

        <div id="container">

        <div id="content">

        </div>

        </div>

        <div id="footer">

        <div class="twitterTextForButton">
            Twitter
        </div>

        <div class="twitter-follow">
            <a class="twitter-follow-button"
            href="https://twitter.com/"
            data-show-count="true"
            data-lang="en"
            data-show-screen-name="false">
            Follow 
            </a>
        </div>

            <script>window.twttr=(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);t._e=[];t.ready=function(f){t._e.push(f);};return t;}(document,"script","twitter-wjs"));</script>


        <div class="facebookTextForButton">
            Facebook
        </div>
            <div class="fb-like" data-href="https://test.com" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>

        <div class="googlePlusTextForButton">
            Google+
        </div>

        <div class="moveGooglePLogo">
        <div class="g-follow" data-annotation="bubble" data-height="20" data-href="//plus.google.com/test" data-rel="author"></div>
        </div>

        </div>

        </div>

</body>

</html>

CSS代码：

    .fb-like {
        position: absolute;
        left: 50%;
        margin-left: 35px;
        bottom: -50px;
    }

    .twitter-follow{
        position: absolute;
        left: 50%;
        margin-left: 180px;
        bottom: 126px;
    }

    .moveGooglePLogo{
        position: absolute;
        left: 50%;
        margin-left: 325px;
        bottom: 126px;
    }

.facebookTextForButton{
    position: absolute;
    color: #ffffff;
    top: 30px;
    left: 50%;
    margin-left: 35px;
}

.twitterTextForButton{
    position: absolute;
    color: #ffffff;
    top: 30px;
    left: 50%;
    margin-left: 180px;
}

.googlePlusTextForButton{
    position: absolute;
    color: #ffffff;
    top: 30px;
    left: 50%;
    margin-left: 325px;
}

Answer 1

对于Google+，您需要一个正确的URL。 而且您必须对项目进行排序。

 data-href="https://plus.google.com/+LarryPage"

Facebook-API需要HTTP Server（请参阅未显示“赞”按钮（jsfiddle除外））

您还可以使用Facebook按钮的iframe解决方案。

按钮示例：

http://jsfiddle.net/GreenMicrochip/djtbg68x/

----更新----

您是否使用了正确的链接？

面子书： http : //facebook.com/YOURUSER

Twitter： http : //twitter.com/YOURUSER或http // twitter.com / intent / follow？screen_name = YOURUSER

您是否有可以尝试解决此问题的链接？

希望能有所帮助。

问候

社交媒体上的链接跟随按钮将不起作用

问题描述

1 个解决方案

解决方案1
0 2015-04-27 12:16:49

社交媒体上的链接跟随按钮将不起作用

问题描述

1 个解决方案

解决方案1 0 2015-04-27 12:16:49

解决方案1
0 2015-04-27 12:16:49