Auto populate Web form for marketers Form (WFFM) Fields With social data using social connected Sitecore 8+

In previous post i have shown you how to get the social data using social connected.


Now we will see how to auto populate these data to a web form for marketers Form Fields.

Prerequisite:-

1. Sitecore 8+
2. Web form for marketers module
3. Social connected configured.

We will be fetching LinkedIn data to a WFFM form using LinkedIn Login.

Step1- Setting up WFFM form in page.

 For adding a form in page create a form item in sitecore.

Step2- Assign WFFM form to page and add LinkedIn login control

Step 3 - Configuring Form fields 

To set default value to a form field we can set Rules.

• Click on form item go to form designer
• Select any field and scroll to bottom of the left panel.

By default sitecore provides few default action.

• Hide element
• Use value from query string
• Use value from profiles specific field
• Use value from specific visitor tag

But since we have to populate the social data we can not use above rules.
For populating social data we need to create a new rule.

Step 4- Creating new WFFM action rule.

• Navigate to "/sitecore/system/Settings/Rules/Definitions/Elements/Web Forms for Marketers Actions"
• Right click and insert new Action.
• Provide your custom method and reference details. As below.

Method- SCcustom.ReadPropertyFromMongo

using Sitecore.Security.Accounts;

using System;

using System.Collections.Generic;

using Sitecore.Diagnostics;

using Sitecore;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using System.Reflection;

using Sitecore.Social.Api;

namespace SCcustom

{

    public class ReadPropertyFromMongo<T> : Sitecore.Forms.Core.Rules.ReadValue<T> where T : Sitecore.Forms.Core.Rules.ConditionalRuleContext

    {

        private string Network { get; set; }

        protected override object GetValue()

        {

          

            try

            {

                string networkname = "LinkedIn";

                networkname = Network;

                // Sitecore.Context.User.Profile.GetCustomProperty("soc_PrimaryNetwork") ;

                var socialProfile = new SocialProfileManager();

               

                // Do we have an extra profile from the user?

                if (socialProfile.SocialProfileExists(Sitecore.Context.User.Name, networkname))

                {

                    var soProfile = socialProfile.GetSocialProfile(Sitecore.Context.User.Name, networkname);

                    try

                    {

                        return soProfile.Fields[Name];

                    }

                    catch

                    { return ""; }

                }

                return "";

            }

            catch

            { return "network error"; }

        }

     

    }

}

Now we have to pass two parameters from Sitecore-"Name" and "Network" from Sitecore.

Custom rule will look for the "ln-headline" property in context user's Linkedin social profile. If any value is found it will return the value else it will return blank.

Below is the Output

Sitecore Social Connected - Linkedin ( Sitecore 8+ )

Getting LinkedIn Profile data using Sitecore connected.

In this blog post i will be showing how to get the profile data from LinkedIn using Sitecore Connected. 

I will be covering below points-

• Adding application in LinkedIn.
• Setting up LinkedIn application.
• Setting up Sitecore to use LinkedIn connection
• Adding and configuring login with LinkedIn rendering.
• Code snippet for getting profile data.

Adding application in LinkedIn  

for creating a new application in LinkedIn navigate to https://www.linkedin.com/developer/apps

and click on create  application . Fill in the required fields and click on submit.

Setting Up LinkedIn application

After adding the application open the application and set the Authorized Redirect URLs:

Copy Client ID and Client Secret .. Hit Update after adding url.

Setting up Sitecore to use LinkedIn connection

Login to Sitecore open content editor. Navigate to /sitecore/system/Social/Applications/Default.

right click on Default item and insert new application.

 Add the Application ID and Application secret copied from LinkedIn application.Select the network as LinkedIn.

Save the item.

Adding and configuring login with LinkedIn rendering.

Once configuration is done now you can add the login with LinkedIn rendering(/sitecore/layout/Renderings/Social MVC/Connector/Login with LinkedIn) to your page.

After adding the rendering you need to configure few Rendering parameters as shown below.

Click Ok. save and publish your page

You should be able to view the login button of LinkedIn on your page click on the login button it will redirect you to LinkedIn Authentication page. Enter the credential and click on allow access it should redirect back to the url which you provided earlier on rendering parameter.

It will add one query string parameter called authResult . If value is success means the login is successful else login failed.

Code snippet for getting profile data.

Now when login is successful the social profile data from LinkedIn gets attached to the Sitecore context user.

we can get those data by using below code and use it in our website.

below is the set of  data we can get -

we can configure the key data to be fetched from Sitecore.Social.ProfileMapping.LinkedIn.config file present at app_config/include/social folder.