[Beta] Dynamic Facebook and Twitter Meta Tags

A place for MOD Authors to post and receive feedback on MODs still in development. No MODs within this forum should be used within a live environment!
Scam Warning
User avatar
Volksdevil
Registered User
Posts: 2415
Joined: Sun Oct 03, 2010 2:03 pm
Location: Lancashire, UK
Name: Neil

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by Volksdevil »

Cheers Jeff, I'll have a look at that. I actually only just noticed this too. The tag {S_META_DESCRIPTION} doesn't seem to work/populate anything within the HTML.

EDIT: Scrub that, I was looking at a post with no text content. Doh!

EDIT2: Yep, the fix is working. Everything seems to be fine. 8-)

PS: Is it normal for the facebook debugger to say this for video?
og:video Array of length: 1
{
"url": "http:\/\/www.youtube.com\/watch?v=FWEuhvnvEGU"
}
As it also says this at the bottom of the debugger page:
When this URL is shared on facebook, it is treated as a certain type. By putting meta tags on this page, you can influence how it is shared.
Video status Video embedding on Facebook enabled
My phpBB Extensions
Finally found great Website Hosting from :arrow: KUALO!
Do NOT use 123-reg.co.uk - Incapable of running phpBB!
:ugeek: TekNeil - Streamer on Twitch | My Volkswagen Corrado G60
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

that is correct. The og:video meta tag has three other variables that can be used. When you use all three, the other variables become part of the array.

The other three are:

Code: Select all

    <meta property="og:video:type" content="application/x-shockwave-flash">
    <meta property="og:video:width" content="398">
    <meta property="og:video:height" content="224">
You can manually install if you want. I leave them out since facebook uses their own sizes.

jeff
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.
User avatar
Theriddler1
Registered User
Posts: 451
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by Theriddler1 »

great thanks for the video support.

Is is possible to only grab the youtube video id to use in the meta's

that way it is possible to do much better sharing with video especially for the image meta for facebook

Code: Select all

<meta property="og:type" content="video">
<meta property="og:image" content="http://i1.ytimg.com/vi/video_id here/maxresdefault.jpg">
<meta property="og:video" content="http://www.youtube.com/v/video_id here?version=3&autohide=1">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video:width" content="1280">
<meta property="og:video:height" content="720">
Theriddler - Former Moderator @ phpBB.nl | phpBBservice.nl Team-member
Image My Extensions | buy me a beer Image
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

Theriddler1 wrote:great thanks for the video support.

Is is possible to only grab the youtube video id to use in the meta's

that way it is possible to do much better sharing with video especially for the image meta for facebook

Code: Select all

<meta property="og:type" content="video">
<meta property="og:image" content="http://i1.ytimg.com/vi/video_id here/maxresdefault.jpg">
<meta property="og:video" content="http://www.youtube.com/v/video_id here?version=3&autohide=1">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video:width" content="1280">
<meta property="og:video:height" content="720">
You can edit the code to change the BBCode searched for from [video and [/video to [youtube and [/youtube. this will only pick up the youtube bbcode within the posting.

The other video meta tags are static and can be added manually to the header.
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.
User avatar
Theriddler1
Registered User
Posts: 451
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by Theriddler1 »

jcocking wrote:You can edit the code to change the BBCode searched for from [video and [/video to [youtube and [/youtube. this will only pick up the youtube bbcode within the posting.

The other video meta tags are static and can be added manually to the header.
Yes agree but then still it gives me the full youtube url

and then the output will be

Code: Select all

<meta property="og:image" content="http://i1.ytimg.com/vi/http://youtu.be/0B0hmevx1R8/maxresdefault.jpg">
it should be:

Code: Select all

<meta property="og:image" content="http://i1.ytimg.com/vi/0B0hmevx1R8/maxresdefault.jpg">
this seems to work for Grabing only the ID of the youtube video (slightly modified)
source

Code: Select all

if (strpos($row['post_text'],'[youtube') !== false) {
		if (preg_match('/youtube\.com\/watch\?v=([^\&\?\/]+)/', $row['post_text'],$id)) {
		$value = $id[1];
		} if (preg_match('/youtube\.com\/v\/([^\&\?\/]+)/', $row['post_text'],$id)) {
		$value = $id[1];
		} if (preg_match('/youtu\.be\/([^\&\?\/]+)/', $row['post_text'],$id)) {
		$value = $id[1];
		}
		$sMetaBBCVideo[] = $value;
}
but the only problem is that the output of {S_BBC_VIDEO_URL} now giving me:

<meta property="og:image" content="http://i1.ytimg.com/vi/0B0hmevx1R8[/maxresdefault.jpg">

after the video id there is a bracket but it shouldn't be there

Code: Select all

[
i can't seem to find how to remove that bracket.
Theriddler - Former Moderator @ phpBB.nl | phpBBservice.nl Team-member
Image My Extensions | buy me a beer Image
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

On the preg_match lines where you have /youtube. change it to [/youtube.

Jeff
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.
User avatar
Theriddler1
Registered User
Posts: 451
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by Theriddler1 »

jcocking wrote:On the preg_match lines where you have /youtube. change it to [/youtube.

Jeff
when changed i got

Code: Select all

[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1365: preg_match() [function.preg-match]: No ending matching delimiter ']' found
Theriddler - Former Moderator @ phpBB.nl | phpBBservice.nl Team-member
Image My Extensions | buy me a beer Image
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

The reg expression you are using for preg_match is including the last bracket. I do not know where you got the regex and I personally hate re-engineering regex. One of the suggestions I would make is to use mod to obtain a clean result from the post text. Then perform you additional code on the result sets:

Code: Select all

if (strpos($row['post_text'],'[video') !== false) {
	preg_match_all('%\[video[a-z0-9:][^\]]*\](.*?)\[/video%', $row['post_text'],$sMetaResult);
	//
        // Insert your code here and use the result $sMetaResult['1'] as your input.  
        // $sMetaResult['1'] is a clean string that has the data 
        // that exsits between the [video] and [/video] bbcodes. You can change the "video" to any bbcode
        // you want to strip data from
        //
        foreach ($sMetaResult['1'] as $value) {
		$sMetaBBCVideo[] = $value;
	}
}
So your code would look something like:

Code: Select all

if (strpos($row['post_text'],'[youtube') !== false) {
	preg_match_all('%\[youtube[a-z0-9:][^\]]*\](.*?)\[/youtube%', $row['post_text'],$sMetaResult);
        if (preg_match('/youtube\.com\/watch\?v=([^\&\?\/]+)/', $sMetaResult[1],$id)) {
             $value = $id[1];
         }
        // etc.........
	$sMetaBBCVideo[] = $value;
}
This should work.

jeff
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.
User avatar
Theriddler1
Registered User
Posts: 451
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by Theriddler1 »

thank you jeff for taking the time to look at this and your support

i've got the code from here: http://stackoverflow.com/a/9785191

when i changed the code to this:

Code: Select all

if (strpos($row['post_text'],'[youtube') !== false) {
   preg_match_all('%\[youtube[a-z0-9:][^\]]*\](.*?)\[/youtube%', $row['post_text'],$sMetaResult);
        if (preg_match('/youtube\.com\/watch\?v=([^\&\?\/]+)/', $sMetaResult[1],$id)) {
        $value = $id[1];
        } 
		if (preg_match('/youtube\.com\/v\/([^\&\?\/]+)/', $sMetaResult[1],$id)) {
		$value = $id[1];
		} 
		if (preg_match('/youtu\.be\/([^\&\?\/]+)/', $sMetaResult[1],$id)) {
		$value = $id[1];
		}
		$sMetaBBCVideo[] = $value;
}
then i get the following:

Code: Select all

[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1366: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1369: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/viewtopic.php on line 1372: preg_match() expects parameter 2 to be string, array given
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 5267: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3997)
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 5269: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3997)
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 5270: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3997)
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 5271: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3997)
Theriddler - Former Moderator @ phpBB.nl | phpBBservice.nl Team-member
Image My Extensions | buy me a beer Image
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

My boards are setup to accept video from numerous sources, so I do not have a way to test this. This should work.

Code: Select all

  if (strpos($row['post_text'],'[youtube') !== false) {
    preg_match_all('%\[youtube[a-z0-9:][^\]]*\](.*?)\[/youtube%', $row['post_text'],$sMetaUtubeResult);
    foreach ($sMetaUtubeResult['1'] as $value) {
      preg_match('/youtube\.com\/watch\?v=([^\&\?\/]+)/', $value,$id);
      preg_match('/youtube\.com\/v\/([^\&\?\/]+)/', $value,$id);
      preg_match('/youtu\.be\/([^\&\?\/]+)/', $value,$id);
      $sMetaBBCVideo[] = $id[1];
    }
  }
I prefer not to do custom coding for free for other people's businesses. If you are going to mash up two sources of codes, you will need to learn basic php coding.

jeff
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.
User avatar
Theriddler1
Registered User
Posts: 451
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by Theriddler1 »

spot on jeff :) it works!

Thank you for helping me, maybe you could use this for the new version of your mod.
Theriddler - Former Moderator @ phpBB.nl | phpBBservice.nl Team-member
Image My Extensions | buy me a beer Image
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

The downside of changes you made is it only supports Youtube. The mod that is listed in the prerequisites, supports about 35 different video websites.

jeff
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

At this time there are no known bugs. All the major feature enhancements have been implemented.

jeff
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.
User avatar
Theriddler1
Registered User
Posts: 451
Joined: Sat Aug 27, 2011 11:00 pm
Location: NL
Name: Theriddler❶

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by Theriddler1 »

jcocking wrote:The downside of changes you made is it only supports Youtube. The mod that is listed in the prerequisites, supports about 35 different video websites.

jeff
true but youtube is the only bbcode we use and this works perfect, maybe you could add that to the mod as an add-on.

the meta's used at our site in combination with the code:

Code: Select all

<!-- //**** Dynamic Facebook Mod - http://www.cocking.com/dynamic-facebook-twitter-meta-tags-phpbb// -->
<meta property="og:locale" content="{S_USER_LANG}" />
<meta property="og:locale:alternate" content="en_US" />
<meta property="og:site_name" content="{SITENAME}" />
<meta property="og:url" content="{U_CANONICAL}" />
<meta property="og:title" content="<!-- IF SCRIPT_NAME eq 'viewtopic' -->{TOPIC_TITLE}<!-- ELSE -->{SITENAME}<!-- ENDIF -->" />
<meta property="og:type" content="<!-- IF S_BBC_VIDEO_URL -->video<!-- ELSE -->article<!-- ENDIF -->" />
<!-- IF S_IMAGE_ATTACH_ID -->
<meta property="og:image" content="{BOARD_URL}download/file.php?id={S_IMAGE_ATTACH_ID}&mode=view" />
<!-- ELSEIF S_BBC_IMAGE_URL -->
<meta property="og:image" content="{S_BBC_IMAGE_URL}" />
<!-- ELSEIF S_BBC_VIDEO_URL -->
<meta property="og:image" content="http://i1.ytimg.com/vi/{S_BBC_VIDEO_URL}/0.jpg" height="360px" width="480px" />
<!-- ELSE -->
<meta property="og:image" content="http://www.your-site-url-here/your-logo-here200x200.png" />
<!-- ENDIF -->
<!-- IF S_META_DESCRIPTION -->
<meta property="og:description" content="{S_META_DESCRIPTION}" />
<!-- ELSE -->
<meta property="og:description" content="{SITE_DESCRIPTION}" />
<!-- ENDIF -->

<!-- IF S_BBC_VIDEO_URL -->
<meta property="og:video" content="http://www.youtube.com/v/{S_BBC_VIDEO_URL}?autohide=1&version=3" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:width" content="580" />
<meta property="og:video:height" content="360" />
<!-- ENDIF -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@your-twitter-account-name-here" />
<meta name="twitter:url" content="{U_CANONICAL}" />
<meta name="twitter:title" content="<!-- IF SCRIPT_NAME eq 'viewtopic' -->{TOPIC_TITLE}<!-- ELSE -->{SITENAME}<!-- ENDIF -->" />
<!-- IF S_META_DESCRIPTION --><meta name="twitter:description" content="{S_META_DESCRIPTION}" />
<!-- ELSE -->
<meta name="twitter:description" content="{SITE_DESCRIPTION}"/>
<!-- ENDIF -->
<!-- IF S_IMAGE_ATTACH_ID -->
<meta name="twitter:image" content="{BOARD_URL}download/file.php?id={S_IMAGE_ATTACH_ID}&mode=view" />
<!-- ELSEIF S_BBC_IMAGE_URL -->
<meta name="twitter:image" content="{S_BBC_IMAGE_URL}" />
<!-- ELSEIF S_BBC_VIDEO_URL -->
<meta name="twitter:image" content="http://i1.ytimg.com/vi/{S_BBC_VIDEO_URL}/0.jpg" />
<!-- ELSE -->
<meta name="twitter:image" content="http://www.your-site-url-here/images/your-logo-here.png" />
<!-- ENDIF -->
<!-- //*** Dynamic Facebook Mod END ***// -->
notice that the twitter meta's has not yet changed because of the long wait approval for the player.

Though this mod would be much greater if every post on phpbb could be shared (share button to each post)
then it doesn't matter if it's the first or the last but every single post could be shared, don't know if it's possible since every post has their own post id and facebook scrapes the whole page looking for the meta's, so guesing something like as soon someone clicks on the share button the meta's will be filled.

I think this is a much needed modification if this is even possible. I like the work done so far appreciate your fast en very helpfull support and will keep following your progress and suggestions/ideas from others and you.

have a great weekend!
Theriddler - Former Moderator @ phpBB.nl | phpBBservice.nl Team-member
Image My Extensions | buy me a beer Image
jcocking
Registered User
Posts: 197
Joined: Wed Jun 08, 2005 6:47 pm

Re: [Beta] Dynamic Facebook and Twitter Meta Tags

Post by jcocking »

Theriddler1 wrote:
jcocking wrote:The downside of changes you made is it only supports Youtube. The mod that is listed in the prerequisites, supports about 35 different video websites.

jeff
true but youtube is the only bbcode we use and this works perfect, maybe you could add that to the mod as an add-on.
Your specific board modifications do not warrant to be considered a mod add-on. Sorry.
Theriddler1 wrote: Though this mod would be much greater if every post on phpbb could be shared (share button to each post)
then it doesn't matter if it's the first or the last but every single post could be shared, don't know if it's possible since every post has their own post id and facebook scrapes the whole page looking for the meta's, so guesing something like as soon someone clicks on the share button the meta's will be filled.

I think this is a much needed modification if this is even possible. I like the work done so far appreciate your fast en very helpfull support and will keep following your progress and suggestions/ideas from others and you.
If you want this mod, you will need to do one of the following:
  • Have Facebook and Twitter change their Share methodology. You will need them to stop using meta tags for the entire internet. They will need to create a model where each page will support mini-content areas that can be shared. Each mini-subsection of content will need to have their own individual type of meta tags to provide the share functionality.
  • Have phpBB change the forum model where each post is a separate page. A topic will be viewed as an index page and you will be required to click on each individual posts to read them. There can not be more than one post per page.
When you have accomplished one of these two tasks, the requested mod change will be an easy task. Let me know when you have completed one of the above tasks.

jeff
LotusElan.net is a fully responsive phpBB forum dedicated to the Lotus Elan Sportscars of the 1960s.

Return to “[3.0.x] MODs in Development”