(

3

)

Social Meta Tags Plugin

$ 19.00 Buy Now

Best Plugin to Optimise your SocialEngine Website for Social Media Channels

Global Settings

Configure various settings related to this plugin. Enable / disable open graph and twitter cards. Choose how you want to display the meta title and meta description when your web content is shared on social media.

Manage Meta Tags

Set meta title, meta description and meta image for both widgetized and non-widgetized pages available on a website. Option to enable / disable open graph and twitter cards for individual widgetized page.

Open Graph & Twitter Cards

Open Graph tags allows sharing of rich “graph” objects through website’s content on social media like Facebook, Google+, Pinterest. Similarly, Twitter Cards let you stand out from the crowd of tweets.

About the App

Every authentic website creates a lot of good content. Yes, content is king to make a website successful, but a king is powerless without followers. So, what’s the first thing that comes to mind when you want to reach a broader audience with your awesome new post? Sharing on social media, of course. The huge audiences of social media make them the best platforms for sharing, but do you know how to optimize that outreach potential?

By adding some simple social meta tags to your website, you can improve how your content is displayed on these social networks. This improves your visibility and increases your traffic by making your updates more appealing for both clicks and shares. After all, when you use the right image, descriptive text, and so on for a update on social media, you can improve engagement (including click-throughs) by often 100s of percent.

Why there is a need of Social Meta Tags?

1) To drive most of the web’s traffic
2) To improve conversions and click-through rates
3) Significant social advertising
4) Control in the way your content is displayed
5) Boost organic search engine rankings

Types Of Social Meta Tags

Open Graph Twitter Cards
Open Graph is a medium which allows sharing of rich “graph” objects through website’s content on social media like Facebook, Google+, Pinterest. Twitter Cards is a medium to populate media-rich fragment in tweets. But if Twitter robots cannot find any, Twitter uses Open Graph tags instead.

Open Graph

Open Graph is a medium which allows sharing of rich “graph” objects through website’s content on social media like Facebook, Google+, Pinterest. It provides a control on how website’s content should travel from that website to social media websites when a page is shared (or liked, etc.). In order to make this possible, information is sent via Open Graph meta tags in the "head" part of the website’s code. Now, other social media sites also are taking advantage of social meta tags. All of the other major platforms, Facebook, Pinterest, and Google+, recognize Open Graph tags.

Let’s take a look at the most important meta tags for Facebook, Google+, Pinterest and how to optimize them for better sharing.

Basic Format

<meta property="og:type" content="website" />
<meta property="og:title" content="TITLE OF YOUR POST OR PAGE" />
<meta property="og:description" content="DESCRIPTION OF PAGE CONTENT" />
<meta property="og:image" content="LINK TO THE IMAGE FILE" />
<meta property="og:url" content="PERMALINK" />
<meta property="og:site_name" content="SITE NAME" />

Open Graph Meta Tags

  • og:title

    • This tag is for defining your content’s title.
    • It serves a similar purpose as the traditional meta title tag in your code.
    • If Facebook doesn’t find the og:title tag on your page, it uses the meta title instead.
    • The text shown on a Facebook feed is in bold and extremely eye-catching. So, the title must be compelling, just like a good post title.
    • There is no limit on the number of characters, but it’s best to stay between 60 and 90. If your title is longer than 100 characters, Facebook will truncate it to only 88!
    • Example:
      <meta property="og:title" content="Your eye catching title here." />
  • og:url

    • This is tag is to set the canonical URL for the page you are sharing.
    • Define one page that all your shares will go to. It’s useful if you happen to have more than one URL for the same content.
    • Important note: URL provided is not shown on Facebook newsfeed, only domain is visible.
    • Example:
      <meta property="og:url" content="http://www.yourdomain.com" /> 
  • og:type

    • This is tag is to describe the kind of object you are sharing: blog post, video, picture, or whatever. The list to choose from is long.
    • This tag is important if your page has a “Like” button and represents a real-life object (like a book or a movie). It determines if your content will appear in a user’s interest section of her profile in the event she “Likes” it.
    • In most cases, you will use the “website” value, since what you are sharing is a link to a website.
    • If you don’t define a type, Facebook will read it as “website” by default.
    • Example:
      <meta property="og:type" content="website" /> 
  • og:site_name:
    • This tag is for defining that to whom the open graph of the content belongs to.
    • Mention your website’s name.
    • Example: <meta property="og:site_name" content="Your website name" />
  • og:description

    • This meta data descriptor is very similar to the meta description tag in HTML.
    • This is where you describe your content, but instead of it showing on a search engine results page, it shows below the link title on Facebook.
    • Unlike a regular meta description tag, it won’t affect your SEO. (So, don’t spend too much time figuring out how to sneak in keywords.)
    • You are not limited to a character count, but it’s best to use around 200 letters. In some cases, depending on a link/title/domain, Facebook can display up to 300 characters, but treat anything above 200 as something extra.
    • Example:
      <meta property="og:description" content="Your entertaining and descriptive copy here, if your meta description is good, use it." /> 
  • og:image
    • This is the most interesting Open Graph tag because a picture always helps content stand out. This is how you ensure that a particular thumbnail will be shown when your page is shared. It can be very helpful for your conversion rates.
    • Make sure you set the og:image you choose, otherwise Facebook will show something stupid like an unwanted ad banner scraped from the page, or nothing at all. We definitely don’t want that!
    • The most frequently recommended resolution for an OG image is 1200 pixels x 627 pixels (1.91/1 ratio). At this size, your thumbnail will be big and stand out from the crowd. Just don’t exceed the 5MB size limit.
    • If you use an image that is smaller than 400 pixels x 209 pixels, it will render as a much smaller thumbnail. It’s nowhere nearly as eye-catching.
    • One thing need to be remember: lace your text, or the most significant part of it, in the middle of the image. This matters because Facebook trims the sides of thumbnails.
    • Example:
      <meta property="og:image" content="http://www.yourdomain.com/image-name.jpg" /> 

Twitter Cards

Twitter actually has its own meta tags for Twitter Cards, but if Twitter robots cannot find any, Twitter uses Open Graph tags instead. Like Open Graph tags, Twitter Cards let you stand out from the crowd of tweets. They allow some additional content (such as photos, videos and other media) to be generated from your 140-character tweet. This makes the Tweet much more engaging than it might be otherwise.

Basic Format

<meta name="twitter:title" content="TITLE OF YOUR POST OR PAGE" />
<meta name="twitter:description" content="DESCRIPTION OF PAGE CONTENT" />
<meta name="twitter:image" content="LINK TO THE IMAGE FILE" />
<meta name="twitter:site" content="@USERNAME" />

Twitter Card Meta Tags

  • twitter:card

    • This tag works in a similar way to og:type. It describes the type of content you are sharing.
    • There are 7 options to choose from: summary, photo, video, product, app, gallery, and “large version” summary.
    • Depending on the type of content, the link at the bottom of tweet changes.
    • Get “View summary” for summaries, “View photo” for photos, etc. If this tag is not set, Twitter reads your link as a “Summary” by default.
    • Example:
      <meta name="twitter:card" content="summary" />
  • twitter:title

    • This basically does the same thing as its Open Graph counterpart.
    • Specify the title for your article that will show up in bold.
    • It’s smart to avoid repeating the same text you have in your tweet. Use up to 70 characters.
    • Example:
      <meta name="twitter:title" content="Your title here" />
  • twitter:description

    • This tag is used to write a descriptive lead to the page you are sharing.
    • As with Open Graph tags, don’t focus on keywords because they won’t matter for your SEO.
    • Create compelling copy that nicely complements your tweet and the title.
    • Twitter limits this part to 200 characters.
    • Example:
      <meta name="twitter:description" content="Your description here" />
  • twitter:url

    • This tag sets the canonical URL for the content you are sharing.
    • It is similar to og:url.
    • Example:
      <meta name="twitter:url" content="http://www.yourdomain.com" />
  • twitter:image

    • This tag is used to set the picture to go with your tweet.
    • Twitter allows two options, a card with a smaller or a larger picture. You decide which one you want in the type tag.
    • If you go for the large option, make sure it has a resolution of at least 280x150px and that the file size is not more than 1MB.
    • Add some text to the image to boost the message.
    • Example:
      <meta name="twitter:image" content="http://www.yourdomain.com/image-name.jpg" />
  • twitter:site:
    • This tag is to define that to whom the twitter card belongs to.
    • Associate your website’s twitter account.
    • Example:
      <meta name="twitter:site" content="@username" />

Sample Code

<meta property="og:title" content="Cinnamon's Hotel - SocialEngineAddOns" />
<meta property="og:description" content="Welcome to a place where senses are delighted and desires indulged. A place of colours, sounds and unexpected pleasures. A place where you pick the pace and you choose the mood. If you're looking to explore Bahamas or escape it, Cinnamon is your perfect h... Showcase page with its complete information through Page Profile. Perform various actions on the page such as: like, follow, become a member etc." />
<meta property="og:url" content="http://demo.socialengineaddons.com/cinnamonhotel" />
<meta property="og:image" content="https://demo.socialengineaddons.com/public/sitepage_photo/65/e6/e57f_53b9.png" />
<meta property="og:type" content="website" />
<meta property="og:locale" content="en_US" />
<meta property="og:site_name" content="SocialEngineAddOns - SocialEngine Demo" />
<meta property="fb:app_id" content="xxxxxxxxxxxxxxxxxx" />

<meta name="twitter:title" content="Cinnamon's Hotel - SocialEngineAddOns" />
<meta name="twitter:description" content="Welcome to a place where senses are delighted and desires indulged. A place of colours, sounds and unexpected pleasures. A place where you pick the pace and you choose the mood. If you're looking to explore Bahamas or escape it, Cinnamon is your perfect h... Showcase page with its complete information through Page Profile. Perform various actions on the page such as: like, follow, become a member etc." />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:url" content="http://demo.socialengineaddons.com/cinnamonhotel" />
<meta name="twitter:image" content="http://demo.socialengineaddons.com/public/admin/demo_page.png" />
<meta name="twitter:site" content="xxxxxxxxxxxxxxxxxx" />

Administration

  • Enable / disable Open Graph and Twitter Cards.
  • Four ways to use ‘Meta Title’ and ‘Meta Description’ for your website’s content being shared.
  • Set default website’s image to be used in the image meta tag of Open Graph and Twitter Cards.
  • Configure meta tags for both widgetized and non-widgetized pages:
    • Meta Title
    • Meta Description
    • Meta Image
  • Option to enable / disable Open Graph and Twitter Cards for particular widgetized page.

User Reviews

(

3

)
Another essential plugin
Recommended by olivier mandron on September 16th, 2017 at 9:29am

This plugin helps to share site's content with social networks a best way.
A good way to boost performances.
As usual, plugin's support is top level.
I recommend.

Excellent Plugin!
Recommended by Derek Owens on September 14th, 2017 at 7:28pm

We strongly recommend this plugin. By adding some simple social meta tags to our website, we were able to improve how our content is displayed. It improves our visibility and increases our traffic by making our updates more appealing for both clicks and shares. Also, we would like to thank Heena, Ritu, Riya, Naveen, Era and the entire SocialEngineAddOns for their great service. Thanks guys!

Social Engine Website finally good visible on other social platforms.
Recommended by Patrick Simons on September 7th, 2017 at 1:22pm

Your own Social Engine website visible on other social networks. Mega important. SEAO has also understood this and has therefore made this fantastic plugin. Actually, this plugin can not be missing, I'm very happy with it. It gives so much more possibilities. Big thumbs up, great work.

Support

Support is provided via the Support section of your SocialEngineAddOns Client Area from Monday to Friday, 9 AM to 7 PM (GMT + 05:30).

Resources

(

3

)

Social Meta Tags Plugin

$ 19.00 Buy Now
Contact Us