在MVC项目中集成facebook share按钮

时间:2011-07-18 05:43:24

标签: asp.net-mvc facebook

如何将facebook share按钮集成到我的ASP.NET MVC项目中?我想要显示图像和链接。

2 个答案:

答案 0 :(得分:3)

Microsoft Web Helpers Assembly有一个简单的解决方案。 您可以通过nuget

进行安装

Install-Package microsoft-web-helpers

之后你可以这样做:

@ Facebook.LikeButton(YOUR_URL)

答案 1 :(得分:0)

第1步。使用id =“ fb-root”定义div

第2步。从facebook帐户添加社交共享脚本。

                                        <script>
                                            window.fbAsyncInit = function () {
                                                FB.init({
                                                    appId: '..........',
                                                    status: true,
                                                    cookie: true,
                                                    xfbml: true
                                                });
                                            };
                                            (function () {
                                                var e = document.createElement('script');
                                                e.async = true;
                                                e.src = document.location.protocol +
                                                    '//connect.facebook.net/en_US/all.js';
                                                document.getElementById('fb-root').appendChild(e);
                                            }());
                                        </script>

第3步。在您的自定义共享按钮上单击。(注意:ID为-share_button的共享按钮)

                                        <script type="text/javascript">
                                            $(document).ready(function () {
                                                $('#share_button').click(function (e) {
                                                    e.preventDefault();
                                                    FB.ui(
                                                    {
                                                        method: 'feed',
                                                        name: '@Model.Title', // Share Title
                                                        link: '@Request.Url.AbsoluteUri', // Share Url
                                                        picture: '@ViewBag.OpenGraphImageUrl', // Share Url
                                                        caption: 'Click here for more detail..', // Share caption
                                                        description: '@Model.Description', // Share Description
                                                        message: '' // Share Any Message!.
                                                    });
                                                });
                                            });
                                        </script>

第4步。使用id =“ share_button”添加共享div,然后将div的样式设置为类似于Facebook共享按钮