icon Open Graph Protocol
Created by Orckestra

Show technical information

How to implement Open Graph Protocol

It takes two steps to implement the Open Graph Protocol meta tags on your website:

  1. Adding Open Graph Protocol Meta Tags via the ad-hoc page meta type
  2. Adding the function to render the meta data on the page

How to add Open Graph Protocol meta tags

  1. Right-click a page and click Add metadata field.
  2. Add the Open Graph Protocol Meta Tags meta type to a page and specify the scope of their use (starting page, whether to inherit on sub pages).
  3. Edit a page with this meta data and fill out the fields:
    • Type: The type of your object. Default is 'website' (please see "Object Types").
    • Title: The title of your object as it should appear within the graph. Default is current page title.
    • Image: The URL to an image that represents your object within the graph. The image must be at least 50px by 50px and have a maximum aspect ratio of 3:1. Supported formats: PNG, JPEG and GIF.
    • Description: A one to two sentence description of your page. Default is current page description.
  4. Save the changes.

How to add the Open Graph Protocol function

  1. Edit a page where you want the tags to appear or a page template the pages are based on.
  2. Add the  Composite.Web.Html.Meta.OpenGraphProtocol function ( Insert > Function) or insert the following code on the page/template:
    Expand code
  3. If necessary, specify optional parameters:
    • SiteName: A human-readable name for your site.
    • FacebookAdmins: A comma-separated list of IDs of the Facebook users who administer this page. You must set this parameter if you want to use the Open Graph Protocol meta tags with the Like button.
    • FacebookApplicationIDs: A comma-separated list of Facebook Platform application IDs if used.

Important Notes

  • You must specify one or more IDs of Facebook users that administer the page in the Admins parameter if you want to use the Open Graph Protocol meta tags with the Like button.