📜 ⬆️ ⬇️

Website integration with Facebook through OpenGraph

Facebook OpenGraph When exchanging “food” for user traffic from content aggregators (search engines, social networks and other services), the publisher constantly asks the question: will the aggregator become the main source of information for my user? Losing one's identity in the common porridge of media resources, giving production results for free and not getting anything in return are risks that often restrain media managers in deciding on maximum publicity and openness.

In this sense, Facebook- announced support for OpenGraph seems somewhat provocative. The technology allows sites to export to the social network the profiles of all objects that they cover - persons, locations, products, organizations, works of art, etc. A user subscribing to any of these objects will be able to receive informational messages in NewsFeed , see these objects in their own interests and search results. Facebook has provided amazing opportunities, but at the same time it made me seriously think about the future of stand-alone media.

Sports.ru turned out to be the first Russian site that got involved in this adventure =) What problem we solve with the help of OpenGraph and what problems we faced - in the continuation of the article about the integration of the media project with the social network.

The entire editorial content of Sports.ru is strung on tags, many of which are encyclopedic objects: contain a photo, a dossier, a geographical location, statistics on sports performances, etc. For example, the news about the financial assistance of Lukoil and Gazprom during the transition to the autumn-spring system is tied to tags by Sergey Fursenko , the Premier League , the RFU , the first division , Gazprom , the second division , Lukoil . Each tag has a personal page on which all information on the object is collected.
We offer Facebook user to subscribe to the news of any of our tags (by the way, now there are more than 50,000) by clicking on the "Like" button, and receive a preview of the texts and photos of the chosen subject in your NewsFeed.

To make this subscription work, we solved the following tasks:

1. Added OpenGraph meta tags to tag pages
OpenGraph meta tags allow us to tell Facebook about the object: name, photo of the object, type of object (team, athlete, tournament, functionary, etc.), encyclopedic and technical data. For example, for the page of Spartak football club www.sports.ru/tags/1044511.html this description looks like this:

Meta-tags Facebook OpenGraph in the source code page Spartak on Sports.ru

At this stage, I recommend using Facebook Url Linter to test OpenGraph pages.

2. Added “I like” buttons on tag pages
The standard Like Button code is used, nothing specific.

Facebook button I like the page tag of the Uruguay national team on Sports.ru

When the first user clicks the “like” button, Facebook will check the page for OpenGraph meta tags and automatically put it on the Facebook Pages list. Although this page has an internal identifier for Social Graph ID , its physical address is outside of Facebook: into the space of the provider of OpenGraph objects.

Spartak OpenGraph page for Facebook user

After some time (more precisely, after a certain number of subscribers to the page) the object is recorded in the social graph and begins to appear in the search results.

Spartak OpenGraph page in Facebook search results

3. Created a news publishing application.
After the OpenGraph page has been fixed in a social graph, you can post announcements on its wall. To deliver the content to “slapped” our tags to subscribers, you can use your hands, or you can automatically. Naturally, we went the second way. The registered application works on the side of Sports.ru: it selects the latest materials from the site, splits them by tags and publishes news on the walls of the corresponding OpenGraph pages using the Graph API and stream.publish . As soon as a news, article or photo tied to one of our OpenGraph tags appears on Sports.ru, the application immediately publishes the content item on the wall of the corresponding page. The “logged in” user will see the following message in his feed:

Sports.ru news in Facebook feed published via OpenGraph

Developing all the mechanics of the project, we came across problems that we still have to solve in the near future:

1. No subscription monitoring interface
Facebook does not provide any interface for monitoring OpenGraph page subscriptions within a single application. Therefore, we will have to independently implement the internal statistics collection service for our tags (the number of Facebook subscribers, the amount of information being uploaded, the number of referrals, etc.)

2. Duplication of informational messages
During development, we stumbled upon a logical problem: several tags can be attached to news, and a user can subscribe to several tags, then there can be duplicate messages in his feed:

Duplicate Sports.ru news in Facebook feed published via OpenGraph

Unfortunately, this problem can only be solved by Facebook: “slapping” the same content received from several walls. They promise to solve the problem in the fourth quarter of 2010 , when the project is completed under the code name “minifeed2”.

3. Articles are also OpenGraph objects!
You need to add OpenGraph meta tags to the pages of our articles, after which they will appear in Facebook search results. Naturally, periodic publications via stream.publish for articles do not make sense.

We launched the project a month ago without any announcement, and so far it’s early to speak about the results expressed in transitions and manifestations of “virality”. About this, I think we will write separately, after a couple of months of operation . In any case, our expectations from the upcoming effect are the most optimistic =)

Source: https://habr.com/ru/post/105270/

All Articles