Social Connected with Sitecore (Facebook) 1: Setup & Posting messages

Almost all up to date web facing sites today call for the need of being integrated with the social media websites. Sitecore has this handy Sitecore connected module which helps us deal with this needed integration to an extend. In this post, I am going to briefly go over some of the features that the social connected module comes with and steps to set this up.
Please note, this is on Sitecore 7.0 and Social Connected 2.0.
I will only be going over facebook but do note that Sitecore Social connected does support LinkedIn, Twitter and Google+ as well.

The Social Connected module will enable you to do the following through configurations alone:

  • Allow users to login to your site using configured social media websites by only adding the relevant user control to your page. Using the relevant config file settings, you can also determine what user data you will want to store in your databases from Facebook, when a user uses their facebook login to log into your site.
  • Publish facebook messages to a user (using facebook to log into your site) timeline when the user triggers a dms goal on the site
  • Post to a facebook timeline to a preconfigured company / website owned official facebook account timeline, when an item is published.
  • Allow you to place like / share buttons on your site pages again by adding only the relevant user control.

To be able to allow users to log into your website using facebook, you will need to create a Facebook app.

Creating a facebook app:

  1. In https://developers.facebook.com/, create a new app
    2014-06-29_002903
  2. Fill in the required information. Please note, an email address is required for a public app (which you need to enable connectivity from your site). You will also need to add a platform – In this case, a website and set the url.
    2014-06-29_003720
    Here is the sample:
    2014-06-29_003702
  3. You will need to make the app public:
    2014-06-29_003959
    Please note, that only the above fields in green – email, public_profile, user_friends are allowed to be accessed by default. Accessing any additional fields will require access from Facebook. This can be requested using the Review Submission Form, available in the Status & Review tab:
    2014-06-29_004346

Now that the Facebook setup is done, we can go ahead and get our sitecore instance set up.
You might want to look at the Modules Compatibility Table to ensure you have a compatible version of the module for your version of sitecore. The Known Issues are also listed here.

Sitecore Setup:

Once you have installed the Social Connected module, create a default application in the following location:
2014-06-29_104647

The ApplicationId and ApplicationSecret will be available in your facebook app.

That’s it! You are all set!
You’ll need to add the login sublayout onto your page:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="FacebookLoginRedirect.ascx.cs" Inherits="Sitecore7.layouts.SocialDemo.FacebookLoginRedirect" %>
<%@ Register Src="~/layouts/system/Social/Connector/Login with Facebook.ascx" TagPrefix="uc1" TagName="LoginwithFacebook" %>

<uc1:LoginwithFacebook runat="server" ID="LoginwithFacebook" />

2014-06-29_105121

When you attempt login, if you see an error:
2014-06-29_105812
You need to check your facebook app settings and make sure that the app domain matches the site Url and the Url you are using currently to hit facebook.
2014-06-29_110000

Once a user logs in using facebook, the same page which the sublayout resides on, refreshes after log in. If you would want it to redirect, you could use the following:

private void Page_Load(object sender, EventArgs e)
        {
            string fbId;
            if (Request.QueryString["authResult"] != null && IsFacebookLogin(out fbId))
            {
                var facebookDataItem = Sitecore.Context.Database.GetItem("/sitecore/content/Home/FacebookData");
                Response.Redirect(facebookDataItem.Paths.Path.Replace(facebookDataItem.Paths.ParentPath, ""));
            }
        }

public bool IsFacebookLogin(out string fbId)
        {
            fbId = string.Empty;
            if (!Sitecore.Context.User.IsAuthenticated) return false;

            fbId = Sitecore.Context.User.Profile.GetCustomProperty("fb_id");
            return !string.IsNullOrEmpty(fbId);
        }

You could similarly also use the Like sublayout on your page:

<%@ Register Src="~/layouts/system/Social/Sharing/LikeButton.ascx" TagPrefix="uc1" TagName="LikeButton" %>
<uc1:LikeButton runat="server" ID="LikeButton" />

Note on configurations for the Social Connected Module

Following are where all the related configs reside:

  • ~\App_Config\Include\Sitecore.Social.config:
    • Social.ProfileUpdating.EnableProfileUpdating – enable user profile information from facebook on login
  • ~\App_Config\Include\Sitecore.Social.Facebook.config
    • Social.Facebook.HasWriteAccess – This needs to be set to true if you want to be able to post to a users timeline.
  • ~\App_Config\Include\Sitecore.Social.ProfileMapping.Facebook.config – Here is where you would select the fields / user data that your application would want to access from facebook. When a new user tries to log into your site through facebook, they will be prompted to grant access to the fields which are set to true in this config file.

Posting messages to user timeline when a goal is triggered

Assuming you have a goal created already, all you need to do is configure a message which will be posted when this goal is triggered.

This can be done using the ‘Messages’ command in the Publish ribbon of the goal:

2014-06-29_122605

2014-06-29_122735

Publish messages to a preconfigured company / website owned official facebook account timeline, on item publish

You might want to push updates for newly published items automatically onto the official facebook feed. For this you need to create an account in sitecore providing the official facebook login credentials (You would want to post on this timeline)

For this, you need to add an account in sitecore:

2014-06-29_143348

You will then be asked for facebook crendentials and the account is now created.
We now need to add the message to be published to the corresponding item. This can again be done using the ‘Messages’ command in the Publish ribbon.

You also need to select the account you created here.

2014-06-29_150428

Once this is done, you could either manually post this message or have it post automatically on item publish (by checking the corresponding checkbox)

2014-06-29_150618

All set!

2014-06-29_150955

Message posted on facebook! 🙂

2014-06-29_151112

Thanks to Dan Solovay’s blog which helped me get through this initial setup and inbuilt functionality. More social media related sitecore posts coming up next!

Advertisements

, , , ,

  1. #1 by Peter Prochazka on July 22, 2014 - 3:45 pm

    Hi, Can I ask which permissions are needed to get Social Connected module work with Facebook and post messages. I am currently preparing Submission form for our app but I have no idea which permissions to choose and what to put there as notes… Thanks in advance, Peter

    Like

    • #2 by aceanindita on July 23, 2014 - 2:46 am

      Hi, So from your application, are you trying to post messages to the user timelines – of users logging into your site with facebook? (Perhaps when a goal is triggered?) Or are you trying to publish to an official facebook timeline (Like the facebook account of the company which owns the site you are developing?)

      Like

      • #3 by Peter Prochazka on July 23, 2014 - 12:31 pm

        We want to achieve both things – post messages to user timelines and also to company facebook page

        Like

      • #4 by aceanindita on August 4, 2014 - 3:42 pm

        Did you set this?
        ~\App_Config\Include\Sitecore.Social.Facebook.config
        – Social.Facebook.HasWriteAccess – This needs to be set to true if you want to be able to post to a users timeline

        Also, for being able to post to the company timeline, setting up the account user sitecore\system\social\accounts and granting permissions while configuring this account should suffice.

        Like

  2. #5 by weeder200 on April 28, 2016 - 5:14 pm

    Any blog posts detailing this on Sc8.1 ?

    Like

  1. Social Connected with Sitecore (Facebook) – Demo Video | Tech Musingz

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: