SunBlogNuke - DotNetNuke Blog Module

As we promised ever, we are trying to build an enhanced and ultimate publishing tool on the DotNetNuke(DNN) platform with a focus on simplicity, ease of extendibility, web standards and usability. We hope that you can build what you would like to with more flexibility and extendibility and the WordPress-level blogging engine is our target until now. Today I would like share you how to add Facebook like button into your dnn website with Ultimate Blog Module – SunBlogNuke.

It's a very easy way for people to share articles they like and also helps drive more traffic to your sites. Since it seems most people have Facebook accounts now-a-days, there should be plenty of users on blogs liking things. Best part is, it's really easy to add to your blog too. Let us go through some steps below to add Facebook like button into your dnn blog:

1. Make sure you have installed our blogging module – SunBlogNuke and build your own blog in some specific page.
2. Go to the admin panel of your blog and click "Customize" link into Customize Panel.
3. Switch "Widget" tab and choose "Footer in Post Detail" type for your template like that:

   

4. Copy the following code into the template box:

   <iframe src="http://www.facebook.com/plugins/like.php?href=[PERMALINK]&layout=standard&show_faces=true&width=450&action=like&colorscheme=light"
       scrolling="no" frameborder="0" allowtransparency="true" style="border: none;overflow: hidden; width: 530px; height: 60px">
   </iframe>

5. Click "Update".

That is all. Please visit here to see how it action - The Latest in Blogging Innovation.You can change the parameters to customize the link button however you want. I think this is an awesome little trick and will drive more traffic than any of those "share" buttons on most blogs.

The tutorial is converted with the forum post - Adding a "Facebook Like" button. Thanks for Matt’s contributions again.

Updated: integrating with Facebook OpenGraph meta tags helps to populate the Facebook link/page/item fields in the Facebook Profile. Just follow up the steps below:

1. Open up the view file "DetailView.ascx" of your current theme, which you have better make it as the customized theme.
2. Import the namespace in the top like that (the second line is what you need to append):

   <%@ Control Language="vb" AutoEventWireup="false" EnableViewState="false"  Inherits="SunBlogNuke.UI.PostViewBase" %>
   <%@ Import Namespace="SunBlogNuke.Common" %>

3. Append the code in the end and save it (Note that you need to replace 'YOUR FACEBOOK ID'.):

   <script language="vbscript" runat="server">
       Sub Page_PreRender(ByVal sender As Object, ByVal e As EventArgs)
           DirectCast(Page, PageBase).HtmlAttributes.Add("xmlns:og", "http://opengraphprotocol.org/schema/")
           DirectCast(Page, PageBase).HtmlAttributes.Add("xmlns:fb", "http://www.facebook.com/2008/fbml")
       
           Page.Header.Controls.Add(New LiteralControl("<meta property=""og:title"" content=""" & Entry.Title & """/>"))
           Page.Header.Controls.Add(New LiteralControl("<meta property=""og:type"" content=""Blog""/>"))
           Page.Header.Controls.Add(New LiteralControl("<meta property=""og:image"" content=""" & ModuleContext.PortalSettings.HomeDirectory & ModuleContext.PortalSettings.LogoFile & """/>"))
           Page.Header.Controls.Add(New LiteralControl("<meta property=""og:url"" content=""" & Entry.Link & """/>"))
           Page.Header.Controls.Add(New LiteralControl("<meta property=""og:site_name"" content=""" & ModuleContext.PortalSettings.PortalName & """/>"))
           Page.Header.Controls.Add(New LiteralControl("<meta property=""og:admins"" content=""YOUR FACEBOOK ID""/>"))
           Page.Header.Controls.Add(New LiteralControl("<meta property=""og:description"" content=""" & HttpUtility.HtmlEncode(HtmlTextUtils.StripHtml(Entry.Description)) & """/>"))
       End Sub
   </script>