Facebook / Open Graph (og:description) / (og:title) tag fixes for VB 4.1.10+ by BOP5

[BirdOPrey5]

Brought to you by BirdOPrey5 / Qapla.com (http://www.qapla.com/mods/).

For some reason vBulletin 4.x does not use the thread's meta description when populating the open graph "description" tag that is read by Facebook and other social networking sites. Instead by default vBulletin uses your site default meta description that is set in Admin CP -> Settings -> Options -> Site Name / URL / Contact Details.

This default description is usually very generic whereas the thread description is the first few sentences of the thread and therefore usually far more useful to describe the page actually being shared than your generic site description.

Also even with the Facebook Platform enabled vBulletin doesn't provide an open graph title tag at all- while in practice this isn't a big deal as Facebook will default to the page title, as a matter of good practice it should be explicitly provided.

This mod fixes both issues. It will override the generic description with the thread's meta description which is based on the text of the first post. It also adds an explicit og:title tag.

New In Version 1.2.0 - The mod now also greatly improves the open graph tag description tag for blog entries. By default the description tag is the blog title followed by the username of the blog poster. With this mod the description becomes up to a 300 character preview of the actual blog entry instead. And the open graph title tag provided takes the form of blog title Posted By username.

Blog Demo: http://www.totallycommercials.com/entry.php?2-Farewell-Blockbuster-Video
Thread Demo: http://www.totallycommercials.com/showthread.php?55-CreditKarma-com-Gameshow-Commercial
(View page source or better yet, share on Facebook to see the differences. ;))

This mod is only for people with VB 4.1.10 or higher and only if you have the Facebook Platform enabled in your settings. It will do nothing if both of those do not apply to you.

There are no settings- just install the product and the mod is active.

To see the difference use the Facebook Debugger to look at the content scraped off a thread page before and after instillation-
Facebook Debugger is here: https://developers.facebook.com/tools/debug

------------------------------------------------------

Please "Mark as Installed" if you use this. :)
Donations always appreciated. :up:
Nominate MOTM if you LOVE it! ;)

[BirdOPrey5]

Reserved.

[bzcomputers]

Using 4.2.0 PL3 - For me the og:description did not change. Although it looked good already (first 150 chars. of the thread). The og:title property was added but the content is blank.

[BirdOPrey5]

Using 4.2.0 PL3 - For me the og:description did not change. Although it looked good already (first 150 chars. of the thread). The og:title property was added but the content is blank.

I wondered if the description change was a more recent issue... If your og:description is already correct no need for this obviously. Maybe the issue is limited to 4.2.1/4.2.2 - need to do more testing. Thanks for heads up

[CharlieDelta]

I am using 4.2.0 PL3 and it worked great!

Thank you for this BOP.

[BirdOPrey5]

Using 4.2.0 PL3 - For me the og:description did not change. Although it looked good already (first 150 chars. of the thread). The og:title property was added but the content is blank.

Weird. I tested this on a 4.2.0 forum with no other add-ons installed the default og:description was the site default. When i installed the mod it worked exactly as expected provided the better description and an og:title tag. Perhaps you already have some mod making the fix?

[BirdOPrey5]

I am using 4.2.0 PL3 and it worked great!

Thank you for this BOP.

Thanks for letting me know!

[bzcomputers]

Weird. I tested this on a 4.2.0 forum with no other add-ons installed the default og:description was the site default. When i installed the mod it worked exactly as expected provided the better description and an og:title tag. Perhaps you already have some mod making the fix?

Figured it out and you are correct. It is the unreleased Dragonbyte SEO I'm beta testing which was already doing this.

[sv1cec]

Installed, and it works as advertised.

If only my FB-Connect button was working too!!!!!!!!

[I.G.O.T.A.]

Installed and voted for MOTM!

[sv1cec]

OK, I solved my Connect button issue and I made a small change to this hack, so that it covers all pages of the site. Here is the code I used.


if (THIS_SCRIPT == 'showthread')
{
global $thread;
$og_array['og:description'] = $thread['meta_description'];
$og_array['og:title'] = $thread['title'];
}
else
{
$og_array['og:title'] = "Enter the title of your site here";
}

[BirdOPrey5]

OK, I solved my Connect button issue and I made a small change to this hack, so that it covers all pages of the site. Here is the code I used.


if (THIS_SCRIPT == 'showthread')
{
global $thread;
$og_array['og:description'] = $thread['meta_description'];
$og_array['og:title'] = $thread['title'];
}
else
{
$og_array['og:title'] = "Enter the title of your site here";
}


That may be OK for people with just the vB 4.x forum, but I would not recommend it for people with the VB 4.x Suite as Blog and CMS articles will then lose their custom titles.

[sv1cec]

Obviously Joe is right about this (not using my code shown above, if you are using vBSuite.

However, being the stubborn person I am, I keep trying to figure out how to fill the og: array with the proper values.

So far, here is what I have come up with:


if (THIS_SCRIPT == 'showthread')
{
global $thread;
$og_array['og:description'] = $thread['meta_description'];
$og_array['og:title'] = $thread['title'];
}
if (THIS_SCRIPT == 'entry' OR THIS_SCRIPT == 'blog')
{
global $blog, $bloginfo;
if ($blog['message'] != "")
{
$og_array['og:description'] = $blog['message'];
}
else
{
$og_array['og:description'] = "BBB";
}
$og_array['og:title'] = $bloginfo['title'];
}


So far, the og:title parameter is filled by the $bloginfo['title'] variable and that's a good thing. However, the og:description doesn't seem to get updated from $blog['message'].

I am using the blog_show_entry template as a guide line, and in there, it appears that the proper variable to use is indeed $blog['message'], but that is obviously not set, when the script above loads?? I do not understand.

Interestingly enough, the vbcms articles automatically get the proper og:description (the article text itself, but their title comprises of the site title and then the title of the article. I wonder if there is a way to use only the article's title.

[ZUCCO]

Looks cool, thanks

[BirdOPrey5]

sv1cec, and everyone-

I went ahead and upgraded this to version 1.2.0- it now adds full support for a blog description (limited to 300 characters if need be) and a better blog title.

The blog title is now formatted "blog title Posted By username"

And the "Posted By" uses the default vBulletin phrase so it will translate to whatever language your forum uses.

I did a lot of research on using it for Articles- it does not appear worth the effort- the way Articles are coded you simply can't get the title or preview text where the facebook open graph text is built. It could be done but would likely need additional plugins- but besides that Articles have a meta description option that you can fill in yourself and if available vBulletin does use the meta description as the open graph description on Article pages.

[Spangle]

I've got a 4.2.2 forum, and have just installed this, but it doesn't seem to be working, I've gone from the Thread title to the URL and from the generic meta description to nothing !

https://www.facebook.com/groups/footballounge/

[BirdOPrey5]

I've got a 4.2.2 forum, and have just installed this, but it doesn't seem to be working, I've gone from the Thread title to the URL and from the generic meta description to nothing !

https://www.facebook.com/groups/footballounge/

The Facebook Debugger says the problem is your Facebook Image-

https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fwww.footballlounge.net%2Fsho wthread.php%3F8766-Sullivan-admits-Carroll-regret

The image must be a full absolute URL, with the http at the front, not the relative path you have.

[Spangle]

The Facebook Debugger says the problem is your Facebook Image-

https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fwww.footballlounge.net%2Fsho wthread.php%3F8766-Sullivan-admits-Carroll-regret

The image must be a full absolute URL, with the http at the front, not the relative path you have.
Thats fixed it thanks !

[Dilldogs]

I am using vb 4.1.7 is there anyway you could get this to work for 4.0 and higher?

[BirdOPrey5]

I am using vb 4.1.7 is there anyway you could get this to work for 4.0 and higher?

The problem is the hook this runs on does not exist in the code until 4.1.1.0.

If You want I suppose you can add the hook manually.

You'll need to edit 2 things.

First, edit your includes/functions_facebook.php file

Find the line:
return $og_array;

And directly ABOVE that add the line:
($hook = vBulletinHook::fetch_hook('fb_opengraph_array')) ? eval($hook) : false;

Then save and re-upload the file. I suggest you rename the original on your server so you have a backup before you upload the changed file. Rename if to something like functions_facebook_old.php (make sure you keep the .php extension)

Then edit this product's .xml file before you import it to product manager.

Find:
4.1.10

and change it to

4.0.0

and save the file and import it.

It *should* work.

Also note- you'll never be able to edit the plugin in plugin manager because your vBulletin version doesn't know the hook exists and won't let you re-save the plugin in the correct hook. Not that you should have any reason to edit the plugin, just keep it in mind.

[RamdonGhai]

How can we get this to work with CMS articles. Why would someone overlook something like this?

[RamdonGhai]

edit* I tried to do it came to a fail, and then saw your post on why it's harder to get the article title value in the head.

Has anyone written a script that gets the value of thread title for the requested cms article and inserts that into the og array?

I'm sure it's a dirty solution, but I have no idea why vbulletin thought this wouldn't be a useful patch.

[BirdOPrey5]

The og title tag isn't that important, if not present the page title is used instead- I only threw it in since it was only 1 line of code for the blogs/threads... It isn't worth the effort to add it for CMS articles in my opinion.

[ckgb]

Any plans on extending this very useful modification to Social Groups?

Thank you

[Gripi]

Hello..

I saw this two is blank when i open a thread and view source:

<meta property="og:description" content="" />

<meta property="og:title" content="" />

Is it normal? i'm using 4.2.1

[BirdOPrey5]

Any plans on extending this very useful modification to Social Groups?

Thank you

Not really because usually social groups aren't publicly accessible in my experience so never really thought much about Facebook sharing. I suppose I can look into it for those who have guest visible socialgroups.

Hello..

I saw this two is blank when i open a thread and view source:

<meta property="og:description" content="" />

<meta property="og:title" content="" />

Is it normal? i'm using 4.2.1

No it's not normal- it may be the result of another modification. Do you by chance have installed VSa - Forums Online CountUp installed?- I found out recently that mod causes such problems with the Facebook Open Graph array.

[Gripi]

Hello..

No.. i didnt install the VSa - Forums Online CountUp mods, i'm using this mods:

GlowHost - Spam-O-Matic
Spam Hammer 1-Series
[OzzModz] First Post On All Pages Per Thread/Forum
SevenSkins Image Resizer
Rotating Banner System
Separate Sticky and Normal Threads

[sv1cec]

Have you switched on the Facebook options, in the Options/Facebook Admin page?

[BirdOPrey5]

Hello..

No.. i didnt install the VSa - Forums Online CountUp mods, i'm using this mods:

GlowHost - Spam-O-Matic
Spam Hammer 1-Series
[OzzModz] First Post On All Pages Per Thread/Forum
SevenSkins Image Resizer
Rotating Banner System
Separate Sticky and Normal Threads

Please post or PM a link to a thread on your site.

[ozzy47]

Hello..

No.. i didnt install the VSa - Forums Online CountUp mods, i'm using this mods:

GlowHost - Spam-O-Matic
Spam Hammer 1-Series
[OzzModz] First Post On All Pages Per Thread/Forum
SevenSkins Image Resizer
Rotating Banner System
Separate Sticky and Normal Threads

Joe if it is [OzzModz] First Post On All Pages Per Thread/Forum let me know.

Gripi, are you using the Atakan one, or mine? Separate Sticky and Normal Threads

[Gripi]

Have you switched on the Facebook options, in the Options/Facebook Admin page?

Yes.. switched on

Please post or PM a link to a thread on your site.

PM-ed.. thank you.

Joe if it is [OzzModz] First Post On All Pages Per Thread/Forum let me know.

Gripi, are you using the Atakan one, or mine? Separate Sticky and Normal Threads

Hello..

I already disable the "[OzzModz] First Post On All Pages Per Thread/Forum", but still blank.

And i use the Atakan for the Separate Sticky and Normal Threads

[ozzy47]

Ok glad top hear it is not a conflict with one of my mods, hopefully Bop5 will figure it out for you.

[jb-net]

Thanks for your great work!

Is there a way to integrate the metatags without having to activate facebook in the AdminCP and enter an FB App ID?

[BirdOPrey5]

Not with this mod.

[rkhyd]

Great.. fixed the problem for me..donated some $ :D

[fxdigi-cash]

do we still need this mod ?? because there a lot of facebook fixes all around here!

[VHLinks]

Do you by chance have installed VSa - Forums Online CountUp installed?- I found out recently that mod causes such problems with the Facebook Open Graph array.

Just curious if we ever found a work around for this?

[BirdOPrey5]

No. Sorry.

[mykkal]

Hi there I have a question. Is there a way to integrate this with the mobile style? I see the facebook "like" button vb natively installs but for whatever reason this mod doesn't seem to add the sharing options to the mobile style. Thats an issue for me because 64% of my traffic is mobile.

[BirdOPrey5]

Hi there I have a question. Is there a way to integrate this with the mobile style? I see the facebook "like" button vb natively installs but for whatever reason this mod doesn't seem to add the sharing options to the mobile style. Thats an issue for me because 64% of my traffic is mobile.

Are you sure? This mod just adds more details to the open graph tags in the header (doesn't add sharing options...) and those tags do indeed work in the mobile style on my test site.

Example random link to a random thread and mobile style: http://www.qapla.com/mods/showthread.php/1337-Good-Work-but?styleid=13

If you look at the source of the page all the og tags are there with the relevant title and descriptions.

Maybe you are thinking of my More Sharing Options TNG mod?

[mykkal]

Are you sure? This mod just adds more details to the open graph tags in the header (doesn't add sharing options...) and those tags do indeed work in the mobile style on my test site.

Example random link to a random thread and mobile style: http://www.qapla.com/mods/showthread.php/1337-Good-Work-but?styleid=13

If you look at the source of the page all the og tags are there with the relevant title and descriptions.

Maybe you are thinking of my More Sharing Options TNG mod?

Yes I was... i apologize. I will immediately post in the thread for that thread.

[Crispin Proctor]

This did not work for me as it conflicted with another plugin (VsaBanners). I see other's had the same problem but with other plugins.

The fault is not with this plugin but with the other plugins which use globacl_start as hook and call vB_Template::Create. This causes the template to rerender which then breaks things.

Seeing as global_start is depreciated the tip was to change the bad plugin to use parse_templates which I did and everything worked!


thanks for the plugin - makes for better OG details. :)

[elsa23]

Hi, for this topic :
http://forum-elodiefrege.com/mediatheque-d-elodie-frege/espace-audiovisuel/13216-elle-fr-linterview-beaute-dans-le-dressing-elodie-frege-mai-2017-a.html

og:description become :
<meta property="og:description" content="ELLE.fr : L'interview beaut? / Dans le dressing? d#8217;Elodie Fr?g? --- Mai 2017 -----" />

instead of:
<meta property="og:description" content="ELLE.fr : L'interview beaut? / Dans le dressing d'Elodie Fr?g? --- Mai 2017 -----" />

How to fix that please

(see attachment please or directly on my link because it does not paste correctly here)

[BirdOPrey5]

I'm sorry but I don't have any way to test on non-English languages. The functions used likely aren't multibyte character compatible.

[elsa23]

I'm sorry but I don't have any way to test on non-English languages. The functions used likely aren't multibyte character compatible.

I reactivated english language, you can take a look please

[BirdOPrey5]

Hello,

I am sorry, you misunderstand. Whether English is enabled or not is not the issue. The problem is this mod is just not compatible when content uses non-English or multibyte characters.