Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 4 Next »

https://github.com/magesuite/opengraph

The module adds the possibility to add Open graph metatags for different kinds of pages (cms, category page, pdp). If custom values are not provided the module uses a meta title, meta description, and first available content image. The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook.

Installation

This module is a part of MageSuite metapackage

Installation if metapackage is not used:

composer require "creativestyle/magesuite-opengraph" ^1.0.0

Admin settings

Open graph settings are placed inside Social Media tab.

CMS page

Category Page

Product Page

Settings:

Name

Options

Comment

Open Graph Title

Custom title

The title of your article without any branding such as your site name.

If this field is empty, the value for "Meta Title" will be used. If "Meta Title" is also empty, page title will be used.

Open Graph Description

Custom description

A brief description of the content, usually between 2 and 4 sentences. This will displayed below the title of the post on Facebook.

If this field is empty, the value from "Meta Description" will be used.

Open Graph Image

Custom image

Try to keep your images as close to 1.91:1 aspect ratio as possible to display the full image in Feed without any cropping. Recommended size: 1200 x 630 pixels

Allowed file types: png, gif, jpg, jpeg, svg. Max file size 1MB. If this field is empty, the image from "Image Teaser" will be used.

Open Graph Type

article / website

Frontend

The module is enabled by default when installed.

On the frontend open graph prefix is added to the HTML tag.

<html lang="en"><head prefix="og: http://ogp.me/ns#">

General configuration can be found in:

Stores -> Configuration -> MageSuite -> Facebook -> Open Graph

Settings:

Is Enabled

 Yes No 

fb:app_id

If set, tag <meta property="fb:app_id" content="1234567890" /> is visible on every page

Default Image

If set, this image will be used as default Open Graph image tag

Custom values per page

The following open graph tags are added to the HEAD section:

Example of open graph tags:

<meta property="og:title" content="Home Page"/>
<meta property="og:description" content="New Yoga Collection. Get fit and look fab in new seasonal styles"/>
<meta property="og:image" content="https://d187yychpee5t0.cloudfront.net/static/version1660037879/frontend/Creativestyle/theme-creativeshop-test/en_US/images/logo.svg"/>
<meta property="og:image:type" content="image/svg+xml"/>
<meta property="og:image:alt" content="creativeshop Demo"/>
<meta property="og:url" content="https://demo.magesuite.io/"/>
<meta property="og:locale" content="en_US"/>
<meta property="og:type" content="article"/>

Backend

TODO - BE documentation and review of this documentation is needed

  • No labels