Current Post

Social Graph Protocol Version 2.0.0 Documentation

By: Neal on in General, Plugins - 6 Comments

Well it’s finally here version 2.0.0 of my Social Graph Protocol plugin, a lot has changed since I first created the plugin. Actually so much has changed with the open graph that I had to basically re-write the entire plugin so if your using a version prior to 2.0.0 I highly suggest that you upgrade to this newest version otherwise your going to have a lot of errors come up in the Facebook debugging tool and thing’s are not going to work correctly when a user clicks the like button on your website but if your using this newest version everything will be displayed perfectly.

For those of you who are new to the Social Graph Protocol plugin let me give you a quick run down of what it does. Basically it inserts meta tags into your websites posts and pages and when a user clicks the like or share button on your site it customizes the way your post or page shows up in that users news feed and timeline, for instance here are a couple pictures below displaying the behaviour of the plugin.

Social Graph Protocol Article Like Button

Social Graph Protocol Article Settings

The first image shows you what happens when a user clicks the like button on a particular article, this is basically a little preview as to what will show up in there news feed or in there timeline and the second image shows the settings used to obtain the title, image and description. The plugin is simply used to help you customize how your content will be shown on Facebook when a user shares or likes something on your website.

Additionally the plugin also enables your website to utilize Facebook Insights that allows you to see a lot of useful Analytics about your content, most importantly the demographics of your users. Anyway enough of the introductions and lets focus on where to get and how to use the plugin.

Where Do I Get The Plugin?

Well if your here chances are you’ve already found the plugin but just in case you haven’t than you can download it from the WordPress repository or you can jump into your WordPress admin panel, go to Plugins, click the add new button near the top and do a search for “Social Graph Protocol” and look for one who’s authors name is Adam Losier, after that click install, make sure it’s activated and your good to go.

Social Graph Protocol Version 2.0.0 – General Settings

After you’ve installed or upgraded to version 2.0.0 you’ll notice a link in your WordPress administration panel that will say “Social Graph”, this will be the general settings for this plugin, take a quick look at the image below to make sure your in the right spot.

Social Graph Protocol General Settings

As you can see from the image above there are three settings, one less than the previous versions, the first setting is your Website description, this is only required if you have left your websites tagline empty, you can see your websites tagline by clicking on the “Settings” link in your WordPress administration panel, it will be the second option in the list. You can over-ride your websites tagline by entering a description into this field. Basically all you want to do is write a quick little summary of your website as a whole.

The second option is a required one and that is a link to a screenshot of your website, usually your websites main page, there are two methods of entering a URL, you can manually enter one or you can click on the “Upload Image” button and use the pop-up to upload an image, once you upload an image simply click insert into post and the URL will auto-populate this field. It is highly suggested that you use a MASSIVE screenshot of your website, the bigger the better, I’m talking 1500 by 1500 pixels or more just as long as your image is not larger than 5MB you’ll be fine. The minimum requirements for the image is at least 200px by 200px although as previously stated the bigger the image the better, Facebook will automatically downsize the image to display correctly on smaller devices like a cell phone.

The last option is a comma separated list of Facebook user ids who have administrative access to your website or someone who will have control over your Facebook Insights, if your the only person working on your site than you can just enter in your own Facebook User ID. This is different from your Facebook URL and it can be obtained by visiting the Facebook Insights page, clicking on the green “Insights for your Website” link near the top right of the page and copying the long number in meta tag. The number your looking for is highlighted in the example image shown below.

Facebook Insights

After that all you have to do is click the “Save Settings” button and your done, even if you never enter in any post or page specific settings the plugin will automatically generate the open graph meta tags based upon your sites content, however its best if you do take a minute or two after the posts you think will generate the most traffic and fill out some additional settings as it will greatly increase the sharing of your content on Facebook.

Post and Page Specific Settings

I’m going to break this section down into separate posts over the next few weeks otherwise this documentation is going to become insanely long I’m going to cover what each and every object type is used for and what each and every attribute is used for that specific object type.

Understanding The Default Attributes Of The Social Graph Protocol Plugin
Using The Article Type With The Social Graph Protocol Plugin

Image Restrictions

It doesn’t matter if your adding an image in your posts or pages or adding an image in the general settings of this plugin, your going to want to set an image that is as large as possible, basically the bigger the image the better just as long as it is under 5MB in size, the minimum requirements for images is that they must be at least 200px by 200px however a 1500px by 1500px image or larger is actually suggested just as long as the file size is under 5MB.

Conclusion

So far this documentation is a little bit brief it’s just a very quick over-view of the general settings and what the plugin is used for, the most value you’ll learn from using this plugin is going to be the series of articles written showing you how to use all the different post types and page specific settings and how all of it connects to Facebook. Hopefully I’ll have enough time to sit down and hash out as many of those articles as possible I’ll update the section above with the links as I write them up.

If you need any help or have any questions feel free to ask them in the comments below I do read all comments and do my best to try and fix any bugs found and help out everyone using my software.

6 Comments

    • Alex Vance
    • Reader
    • July 23, 2013 at 9:14 pm

    Hey Adam. Is there a way to update the facebook title and description metadata on the homepage of a wordpress site if the homepage is not set to a wordpress page? I see that the description can get pulled in from the default settings, but what about the title?

    • Hey Alex,

      At the moment no the home-page is pretty basic it just uses the title you enter in as your website title under Settings->General it uses the first field as the title attribute. I’m going to hopefully be doing some updates to it again this week and weekend and I’ll add more ways that you can edit the title on the home-page I’ve known it was a little restrictive for awhile but haven’t quite had time to add some additional functionality. In the next update I’ll add in that feature though.

      I’m guessing it’ll be about a week to a week and a half from now before I push out the next update though.

    • Mike
    • Reader
    • August 19, 2013 at 10:00 am

    Hi, Great plugin!
    I’m trying to remove the plugin actions (especially og:description) for a custom page template.
    With the old version (1.2.*) the following code in the custom_header.php worked perfectly

    Tried various filters and remove_actions with the latest version, but I must be missing something

    The template is for a 3rd Party embed function. Main problem is “funky” og descriptions (e.g:var _ds_midx;
    if (!_ds_midx) {…….. see here for example – http://www.clearwaterrealestateonline.com/idx/mls-u7591837-redington_shores_fl_33708

    If you could point me in the right direction to suppress the og:description, or remove plugin action completely (whichever takes less of your time!) it will really be appreciated

    • Mike
    • Reader
    • August 19, 2013 at 10:10 am

    The sample code got stripped – here’s a link to a file http://www.graphicline.co.za/social-protocol-filters-sample.html

    • Hi Mike,

      If you open up the index.php file in the Social Graph Protocol plugin and comment out lines 1110 through 1118 it will not include the og:description tags but it will effect all pages on your site.

      Best bet is you could add an additional IF statement just after line 1118 to say something like

      if( $post->ID == ‘THE_PAGE_IN_QUESTION’ ) {
      unset($openGraphTags->attributes['og:description']);
      }

      Additionally remove_action(‘init’, ‘init_social_graph_protocol’); should work but you might have to give it a higher priority try remove_action(‘init’, ‘init_social_graph_protocol’, 1);

      For right now though there isn’t too much built into it plugin wise that can provide a seamless way for you to accomplish this but it’s good you brought it up because I’ll make a note and during my next update I’ll think of putting in various helper functions that developers can use on there end to restrict the output of the tags (Thing’s like not showing the og:description tag on certain posts or pages).

    • Mike
    • Reader
    • December 31, 2013 at 8:18 pm

    Hi Adam
    My apologies for taking so long to reply! I only just found your reply….. probably got lost among the e-mails
    I’ve been fiddling with your suggestions – no success YET, but will get stuck in again in a few days. I can work with your suggestions, maybe write a conditional rule into theme functions to only apply the mod to the custom page template, or the custom header template itself (that will also prevent any future plugin update over writing the changes to the plugin).

    This site is not the easiest to work with – the problem pages are only ‘sort of WordPress’ – using a 3rd party service that creates these particular pages. Changes take a while to filter through their caching system.

    While messing around today – I found the source of that odd description mentioned (I deleted the file with the sample code accidentally, so have redirected to a review of your plugin instead) in the theme template. I’ll try to mod the template then maybe the og: description will be blank – at least that’s better than that other thing.

    don’t want to do anything more tonight in case I mess something up and will be out most of day tomorrow

    Some commercial 3rd party services could learn a lot from devs like yourself who put out free open source plugins – at least they need to hire some decent coders – that particular plugin/service inserts their own og meta in the section – which is useless for the FB linter!

    My client will owe you a donation – probably only around mid year though

Come join the conversation!

We'd love to hear what you think.

Your email address will not be published. Required fields are marked *