Question

我想在我的Blogger博客上添加类似按钮和评论框的Facebook。它是一个使用JavaScript显示图片的图片博客。最近我使用Facebook JavaScript sdk实现了分享按钮，并且它与我的图像脚本完美配合（共享图像缩略图和图像URL）。我想知道是否可以通过某种方式修改此共享脚本，将其用作“赞”按钮和注释框（仅显示当前正在查看的图像的注释）

这是分享按钮脚本

<script>
(function() {
        SocialShare = function() {
                var self = this;
                //////////////////////////////////////////////////////////////
                //
                //        Facebook Share
                //        @link - link to share
                //        @picture - Picture to share
                //        @name - Name for the share
                //        @caption - caption for share
                //        @description - description for share
                //
                //////////////////////////////////////////////////////////////
                self.facebook_share = function(share_obj){
                        FB.init ({
                                appId: share_obj.app_id,
                                status: true,
                                cookie: true,
                                xfbml: true
                        });

                        // create facebook share object
                        facebook_obj = {
                                method: "feed",
                                link: share_obj.link,
                                picture: share_obj.picture,
                                name: share_obj.name,
                                caption: share_obj.caption,
                                description: share_obj.description
                        };

                        FB.ui(facebook_obj,self.share_success);


 };

                //////////////////////////////////////////////////////////////
                //
                //        Twitter Share
                //        @link - Link to share
                //        @description - description for share
                //
                //////////////////////////////////////////////////////////////
                self.twitter_share = function(share_obj){
                        var windowProperties = "toolbar=no,menubar=no,scrollbars=no,statusbar=no,height=" + 250 + ",width=" + 500 + ",left=" + 150 + ",top=" + 150;
                    var popwin = window.open("http://twitter.com/share?url=" + encodeURIComponent(share_obj.link) + "&text=" + encodeURIComponent(share_obj.description), 'newwin', windowProperties);
                    popwin.focus();
                };
                return self;
        };
})();       
</script>
<a href='#' id='facebook_share' name='fb_share' type='button_count'><img src="http://cool-igadgets.appspot.com/fbshare.png"></a>&nbsp;&nbsp;




 <script type="text/javascript">
                $(function(){

                        // Init social share with FB_ID
                        sharer = new SocialShare();

                        var share_obj = {
                                app_id: 490866674364389,
                                        **link: document.URL,**
                                        **picture: pics[a],**
                                        name: "Funny Pictures - WoOf Hits",
                                        caption: "",
                                        description: "Best funny pictures on the Web !"
                        }

                        // CLICKS
                        $("#facebook_share").click(function(event){
                                event.preventDefault();
                                sharer.facebook_share(share_obj)
                        });

                        $("#twitter_share").click(function(event){
                                event.preventDefault();
                                sharer.twitter_share(share_obj)
                        });

                })
        </script>
        <script>
                // Load the Facebook SDK asynchronously
                        (function(d){
                         var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
                         if (d.getElementById(id)) {return;}
                         js = d.createElement('script'); js.id = id; js.async = true;
                         js.src = "//connect.facebook.net/en_US/all.js";
                         ref.parentNode.insertBefore(js, ref);
                        }(document));
        </script>

上面 document.URL 分享的链接来自我在博客上使用的图片脚本。 pics [a] 是图像脚本数组中的图像链接。

Answer 1

正如我在你的另一篇文章中提到的那样，我想我可以找到一种方法。基于this side的方式。如果您将页面滚动到最后，则会从用户OptiTool中找到注释。我用它来开发一种可行的方法。

你需要做什么：

首先将以下javascript代码插入您的页面：

   <script type="text/javascript">
    jQuery(document).ready(function()
    {
        $('#facebook_like').on('click', function() 
        {
            var fbURL = "http://www.facebook.com/plugins/like.php?href=";
            fbUR = fbUR + encodeURIComponent(pics[a]);
            fbUR = fbUR + "&send=false&layout=button_count&width=120&show_faces=false&action=like&colorscheme=light&font&height=21";
            var container = $(this).parent();
            var w = 120;
            var h = 27;
            fbFrame = document.createElement("IFRAME");
            fbFrame.setAttribute("src", fbURL);
            fbFrame.setAttribute("scrolling", "no");
            fbFrame.setAttribute("frameBorder", 0);
            fbFrame.setAttribute("allowTransparency", true);
            fbFrame.style.border = "none";
            fbFrame.style.overflow = "hidden";
            fbFrame.style.width = w;
            fbFrame.style.height = h;
            $(this).parent().empty().html(fbFrame);
        });
    });
    </script>

请确保在您安排导入jquery.js。

之后插入它

第二：

将您自己的喜欢按钮插入您的页面，无论您想要什么。然后将属性id="facebook_like"添加到他。

重要！因为我在Facebook上没有帐户，所以我无法进行实际测试。所以不要责怪我。

如何添加Facebook喜欢和评论框来图像javascript

1 个答案: