Smarter ideas worth writing about.

Developing Yammer Apps

 

If you didn't have a chance to check out the Developing Yammer Apps webinar, then we hope this blog post will help you see what you missed!   The post will help you better understand the Why and How you can integrate Yammer into your custom application environment.

Why Integrate Yammer into your custom applications

About 50% of the folks attending the webinar had not used Yammer before.  I thought this was cool because my experience with people who use Yammer is that they end up loving it!  We went over the basics of Yammer.  In my words, I described Yammer like this:

Yammer is a Social Collaboration tool that helps break down silos with communication in organizations.  It empowers and connects users to collaborate quickly all in a familiar looking interface.

Yammer, to me, looks a lot like earlier versions of Facebook.  I think this was by design, because it is much easier to train with a product if you users have used something very similar.

Integration Use Cases and Examples

Integrating Yammer into your application can provide a lot of benefits.  Yammer provides the Social Collaboration functionality that your application may be missing or lacking.  At the very least, you can integrate with Yammer to provide quick wins for social collaboration and user interaction. 

Yammer integration can be broken into 3 main categories for types of uses:

Social Intranets – In this area, we can utilize SharePoint (and non-SharePoint!) and Yammer together to quickly add feeds to sites.  For instance, you can add the "Finance" Yammer Group to the "Finance" SharePoint Site. 

Line of Business Systems – These come in many forms.  Think of any application within your company's network that could leverage social collaboration.

Mobile Applications – Because Yammer is a secure cloud service, we can connect to this service on-the-go to connect our mobile workforce.

This is just the tip of the iceberg as far as different ways that you could potentially integrate Yammer into your corporate application environment.  Any place that could utilize "Likes", Comment-Streams, and more is a great candidate for integrating with Yammer.

In the webinar, I pointed out a few examples that could be used to help spark some interest:

Corporate Communications adds Comment/Like feed to Announcements or Articles – In this example, any announcements or articles created automatically contains a Yammer comment stream and generates "Buzz"by letting other users know that a user finds this information interesting.

Internal Corporate App Store uses Comments/Likes for Rating Engine – The Like and Commenting streams can act as a feedback mechanism and help generate a discussion on anything!

Mobile Field Sales application integrates questions/answers tagged to a specific product – For instance, a Mobile Financial Services Planner may use his tablet to look at a list of products, and each product has reviews from Financial Researchers stating performance information and their point-of-view on that product.

Hospital pushes social conversation into patient's electronic medical record – In this example, an organization can archive content from Yammer for compliance-related requirements. 

In the webinar, I also showed off some quick sample code that I created to give a glimpse into how an organization can use Yammer in the ways I mentioned above.

If you use map applications on your phone, this kind of functionality looks pretty familiar!   In this example I show that I can add a "Like" button, and comment-stream to this Starbucks location.  A simple way to get you thinking about how you may use this type of functionality in your application environment!

How to integrate Yammer into your environment

When working with Yammer, there are two routes for integration.  The route you take will depend on the level of customization and flexibility you need.  These two routes are:

Yammer Embed – Easily add common Yammer interaction to a web page.

RESTful API – Read/Manipulate raw data from Yammer.

Option 1:  Yammer Embed

Yammer embed is a really great way to quickly add Yammer functionality to an existing web page.  With only a few lines of code, I can quickly create a lot of value and connect my users the way that I want to.  Below is a list of types of common Yammer Embed controls that you can add to a web page:

Login Button – Allows your users to use Yammer in your application (since you must be logged in to Yammer to use Yammer!)

Feeds – Many options to display feeds such as:  All Company Feed, Group, User, and Topics (synonymous with tags).

Like/Follow – Quick action buttons that let users give a thumbs-up or thumbs-down to something.

OpenGraph Feed – This is very similar to a comment feed (see below for an example)

Before you get started, there are a couple of things worth noting that may trip up users when they first start using Yammer Embed.  You must be logged into Yammer to use your app.  Otherwise, how would Yammer know who to associate these comments or likes to!  Unfortunately, no impersonating users (I know… darn!)

To get started, you must create an App on Yammer.com.  This essentially sets up a trust between you and Yammer.  With this trust, your app and code that you write will make calls on behalf of the logged in user.  The two important things you will receive when you create an app is an ID and Client Secret.  These are used for OAUTH2 and authenticating the user through your app.  But what’s really nice, is that Yammer Embed handles authorization for you (as opposed to the REST API… you have to do that yourself)!  For more information regarding OAUTH as it relates to Yammer, please see the following link:  https://developer.yammer.com/oauth2-quickstart/.

Demo 1:  Adding Yammer Feed to an existing web page

Below are a couple of screenshots from the demo I gave in the webinar.  This demo shows how easy it is to add the "My Feed" to the web page.  This web page is nothing special, just a couple of lines of code and this feed is added!

The display:

The code: 

Note: #embedded-feed is an empty
HTML element. Network is a substring of the Yammer.com URL like below:

Demo 2: Adding Likes & Comments to Corporate Announcements

Below is an example of a corporate announcement with some added functionality.  I really like this example because it shows a great way to promote content internal inside your organization.

The display:

Note: Notice the verbiage of "Followed" and "Liked"… embed handles the logic if they are already taken action.

The Yammer display:

The code:

Note: For this feed, I configured the header/footer to not display… to give a more 'native' or cleaner looking integration.
Note: These are the properties that are grabbed by Yammer Embed to be posted to Yammer. These can also be passed as variable values much like the config section.

Yammer Embed Gotchas

Because we are using Yammer Embed with web pages, a lot of the best-practices for HTML/JS/CSS will need to be applied in order to not mess up Yammer Embed.  In general, you will want to diligently test your application to make sure your CSS does not cause issues with the Yammer Embed output.  I can't stress testing enough.

Another common issue is with sizing the Yammer feed elements.  Anything below 400px is going to cause overlapping of the Yammer child container over the parent container.  If you have small width requirements, give "Skinny mode" a try, but its still in beta, so test it!

Lastly, when you are Liking or Following a page, the default is that the URL is the Primary key.  Make sure that your users can click on the liked object and be properly redirected to your application!

Option 2:  RESTful API

The RESTful API is a wonderful and powerful tool to retrieve and manipulate data from Yammer.  Its vastly more complicated than the Yammer Embed, but offers a lot more flexibility and grants the developer the flexibility to parse through raw Yammer data and develop some really compelling applications.

The REST API can be called once your app has an authenticated user.  Unline Yammer Embed, your application will need to go through the process of getting a valid Access Token to make REST calls with.  For more information about how to get this Access Token, please refer to the OAUTH2 Quickstart guide:  https://developer.yammer.com/oauth2-quickstart/.

Demo:  Examining REST with Fiddler

In this demo, I showed a Yammer REST call and some of the things you need to do prior to making a REST call.

The call to get messages from Yammer:

The result:

Note: I received a 401 – unauthorized because I did not include an Access Token in my request.

The call with an Access Token:

The result:

The raw data:

Note: I received a 200 – OK because I included an Access Token in my request. Yammer is in the process of changing the way this Access Token is passed in requests. Please refer to the Yammer Developer Network for more details!

Rest API Gotchas

With the REST API, your application will need to make sure that the REST API is not called too many times within a certain period.  These Rate Limits mean that per user, per app, the following rules apply:

Messages and notifications:  10 requests in 10 seconds

Autocomplete and all other resources:  10 requests in 30 seconds

Next, all actions are done on behalf of the logged in user.  So, if your user is trying to pull down private groups that they don’t have access to, they will not be able to view them.

Lastly, the API can, and will change.  The engineers at Yammer have used a versioning naming convention to their RESTful services (it looks like …/api/v1/…).  Just note that sometimes the engineering team has made big changes to the API without increasing the version number.  You can keep up-to-date on these changes by joining the Yammer Developer Network.

Wrapping up

Hopefully you find the above article interesting and gets you thinking about how you can extend/integrate Yammer into your custom application environment!  The best advice that I can give for starting Yammer development is checking out https://developer.yammer.com and checking out their blog, documentation, and joining the Yammer Developer Network.

As always, please feel free to contact us if you are interested in integrating Yammer into your environment.  We have talented folks in our five offices that would love to hear from you!  Please use the contact form on our website http://cardinalsolutions.com to contact us with any questions or comments.

Share:

About The Author

Principal Consultant
Matt is a principal consultant in Cardinal's Columbus office. He has been working with SharePoint since 2006 in a variety of clients and industries.