Blogs

With a little effort you can add a twitter feed to a My Site Host so that when you visit your profile page or somebody else’s you can see the twitter feed they have chosen. It is fairly easy to get the widget code from the Twitter site and pop it on a page in a content editor web part. It is a little trickier to let users choose their own twitter feed. For this example we are going to need to do a few things. We need to go get the widget save the code to a text file, add a user profile property, modify the widget text, and modify the person.aspx page in the My Site host. You will need to put in some JavaScript but you can just copy the stuff I have written. I have outlined the steps below.

1. Go to the profile widget page on twitter (currently at http://twitter.com/about/resources/widgets/widget_profile) and build a widget that you like using a default Twitter handle for now.
2. Copy the code by clicking Finish & Grab Code.
3. Open up your My Site host with SharePoint Designer.
4. Create a text file (in Site Assets for example) and paste in the code you got from the widget and save it.
5. Open up the person.aspx page (or wherever you want to place the twitter feed). You will need to add a content editor web part somewhere. I recommend replacing the organization chart since you already have a whole page for that.
6. Edit the content editor web part and point to the text file you created in Step 4.
7. Verify that it works and that you can see the twitter feed.
8. Now you will need to create a new User Profile property. In this example the name of the property is TwitterHandle. This lets users put in their own TwitterHandle on their Edit Profile page.
9. You will need to populate the TwitterHandle property for your test profile.
10. Edit the person.aspx page (or the page where you want to put the Twitter feed) in Advanced File Mode in SharePoint Designer. You will need to place the following snippet below the SPSWC:ProfilePropertyLoader tag.
    
    <div id="divTwitterHandle" style="display:none">
    <SPSWC:ProfilePropertyValue PropertyName="TwitterHandle" runat="server"
    ShowPrivate="True" ApplyFormatting="True" PrefixBrIfNotEmpty="False"
    Font-Italic="True" id="TwitterHandle" TitleMode="False"/>
    </div>
    
    This puts the value of the TwitterHandle on the page but hides it.
11. Next you will need to open up the widget code in the text file you created and add the following lines below the second <script>.
    
    var obj = document.getElementById("divTwitterHandle");
    var sTwitterHandle = obj.innerText;
    //Get rid of the space at the end of the text
    sTwitterHandle = sTwitterHandle.replace(/\s+/g,'');
     
12. Now go to the bottom of the text file and find the line with .render().setUser in it and replace the hard coded user name (i.e. ‘SharePointNinja’) with the variable sTwitterHandle.

That is it. You now have a widget that is unique for every person. Of course the users will have to edit their profiles and put in their Twitter handles, but that really isn’t such a bad thing. Maybe they will fill in some more profile details while they are in there.