Skip to content
Johan Janssens edited this page Sep 25, 2022 · 17 revisions

OpenGraph makes it so much easier and more convenient to share your pages on social networks such as Facebook and Twitter. With Joomlatools Pages, OpenGraph support is provided out-of-the-box. You can also override or define custom tags for OpenGraph and Twitter Cards from within your pages.

Table of Contents

Default properties

Default properties are taken from the page frontmatter.

  • og:type defaults to website
  • og:image defaults to page >> image
  • og:title defaults to page >> title
  • og:description defaults to page >> summary
  • og:url defaults to the page URL

To add OpenGraph metadata to a page both the og:type and og:image properties must be also defined.

Custom properties

Properties can be added, or custom values for defaults can be defined, by specifying them in the page frontmatter metadata

Example:

metadata:
   'og:type': article  
   'og:author': john doe

Global properties

Default and additional properties can be configured and added in your configuration file using the metadata config option.

Example:

return array(
   'metadata' => [
        'og:site_name' => 'Joomlatools',
        'og:image'     => '/images/default_card.jpg',
        'twitter:site' => '@joomlatools',
        'twitter:card' => 'summary_large_image',
     ]
);

The image should be a site absolute image path or an URL. If it's a path, the path will be transformed into an URL when the metadata is rendered.

Disabling OpenGraph

OpenGraph support can be disabled by setting the 'og:type' metadata property to false.

return array(
   'metadata' => [
        'og:type'  => false
     ]
);

Using Twitter Cards

We make use of the OpenGraph properties supported by Twitter. For more info, please see this guide.

Specific Twitter properties need to be defined either in the page frontmatter or in the global configuration.

Clone this wiki locally