Simple Facebook Meta Tags

Simple Facebook Meta Tags is an ultra-simple, lightweight WordPress plugin that easily fixes poor appearance of shared links to your web pages on Facebook. It requires no setup or configuration, and there is no admin dashboard page. All the proper values are gathered automatically.

DOWNLOAD HERE

This plugin automatically places the most relevant Facebook Open Graph (OG) meta tags into the head section of your web pages.

1. og:site_name = Your website’s title
1. og:url = The link to the current page
1. og:title = The title of the current page
1. og:type = The type of the website; website (Page) or blog (Post or Index)
1. og:description = The first three sentences of the page’s Post content
1. og:image = a link to the most relevant image.

The image chosen is…

1. The Featured Image, or if none…
1. The first Content image, or if none…
1. A default image you upload to your server’s home directory named “facebook_default_image” (.jpg or .png), or if none…
1. The site theme’s custom logo, or if none…
1. The custom header image, or if none…
1. No image meta tag will be output.

The code output looks like this…

Installation

1. Upload the plugin folder to the ‘/wp-content/plugins/’ directory
1. Activate the plugin through the ‘Plugins’ menu in WordPress

DOWNLOAD HERE

 

Frequently Asked Questions

How can I preview what my page will look like when shared on Facebook?

Use the page debugger tool here…

https://developers.facebook.com/tools/debug/sharing/

You can use this to adjust your page and then re-check it until it looks the way you want.

 

I’m not impressed. Why doesn’t the result look like it should?

Make sure you don’t have another plugin, like Jetpack, adding Open Graph tags too.

 

How can I force the link preview and/or image to be different from the page content?

Put a <div> tag at the top of the content area with your text and image within. Then add the CSS style display:none; to the <div>. Now the <div> won’t display on the page, but the meta tags will use this content.

For example:

<div style=”diplay:none;”>
Sentence one. Sentence two. Sentence three.
<img src=”myimage.png” />
</div>

Begin page content…

= How can I ask a question? =

Please contact me here.

= Can I add Twitter tags and others too? =

No, but I can for you. Please contact me.

Changelog

= 1.3 =
* Initial Release to Public

I’m a freelance web design and developer, video editor and graphic designer working under the name of Element Engage. I'm passionate about my work, helping those in need and anyone who could use my skills to make our world a better place. Beyond my career, I enjoy the outdoors, home improvement, my lovely wife Sarah and my red Mustang. I enjoy diversity and connecting with friends from around the world.

Tags: , ,

Leave a Comment

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

*
*