Jump to content
NemoPS

[FREE MODULE] Facebook Open Graph Tags

Recommended Posts

Hello.

First of all thank You for your work. It is great and useful module.

Unfortunately I have a small problem and I don't know is it connected with the module or something else. The facebook share does't share my product image just some undefined part of my logo. When I use facebook open graph object debugger, it says that og:image should be larger and instead it will use ... The picture shown few lines below is the right picture of my product and when I open it, it shows the right size which is more then 200x200. The most strange thing is that when I use debugger tool for the same product once again it doesn't give me error anymore, and when I share it through my page everything is ok. Please explain me where the problem could be? And how can I solve this without debugging manually every single product of my store?

Thank You in advance.

Share this post


Link to post
Share on other sites

Hello again.

I opened the site two hours ago for you to view the problem. Now I am trying to share some of the products, and every one of the products looks to share with a picture in all social network buttons!?!? Is it possible that my site is in maintenance mode, and is not accessible from external ips to cause the problem?

Regards

Share this post


Link to post
Share on other sites

Hello Nemo,

 

I installed the module and it seems it does not work.

 

My problem is that when I share a product page on facebook it shares the block advertising image instead of product image.

 

Here is my site.

 

Is there any way to fix this issue ?

 

Thank You in advance.

Share this post


Link to post
Share on other sites

Hello Nemo and thanks for the quick reply.

 

The module is installed and i guess it is active to, this is the print screen.

When i saw that it does not work i have also tried to uninstall and instal it allover again, but nothing has changed .

 

I don't know if i'm doing something wrong or not.

 

What do you suggest  ?

 

Thank you again.

Share this post


Link to post
Share on other sites

I'm bugged, can you open the php file and replace wht WHOLE hookHeader function with

 

public function hookHeader($params)
{
 
return $this->header15($params);
 
}

Share this post


Link to post
Share on other sites

Hi!

I am having the same problem as srm200, module does not work. It appears in module positions, and seems to be trying to work because when I view page source in the FO the entire module is missing except for the comments, with a big blank space between them.

 

<!-- Nemops.com OpenGraph Module -->

 

<!-- /end Nemops.com OpenGraph Module -->

 

 

I have tried uninstalling/reinstalling and the fix you suggested for hookHeader, but nothing has worked. So afterward I found a way to  add some of the og: tags of my own, ignore those if you check any of my pages. 

 

PS version: 1.5.3.1

site: http://www.artofadornment.ca

 

 

-Elaine

Share this post


Link to post
Share on other sites

For some reason the page name is not being assigned.

If you look at the header15 method, you will see it's assigning an $og_type variable depending on the page. Can you try writing var_dump($this->context->controller->php_self); at line 340? it should dump the page name

Share this post


Link to post
Share on other sites

Nothing at all? It should dump the variable, you must be able to see it, if not in the page, in the html code

 

Add it before this:

 

if(isset($this->context->controller->php_self) )

Share this post


Link to post
Share on other sites

var_dump($this->context->controller->php_self);

 

Yeah, adding that did nothing. Initially I had it on the wrong line... line 340 for me is right above switch ($this->context->controller->php_self) { 

 

However I went back and added it above if(isset($this->context->controller->php_self) ) and still it did nothing. If my hunch is correct, that was supposed to display the raw code on either the FO page and/or the page's source, but it did neither. I only get the opening and closing comments. Something weird is definitely going on there, but unfortunately I have no idea what.

Edited by artofadornment

Share this post


Link to post
Share on other sites

Hi, i am in problem with this module. it is not working in prestashop version 1.6. what should i do for version 1.6 ? will you upgrade this module any future for prestashop 1.6 ?

Share this post


Link to post
Share on other sites

Hello!!

 

Thank you for share the module!!

 

I just have a problem...

 

it doesn't add the stock of the product to the Open Graph info.

 

I already ser to display the stock (my theme don't have that feature).

 

Do you know if i can do something about it?

 

Thanks!

 

Prestashop 1.5.6.o

www.leadrunway.com

Share this post


Link to post
Share on other sites

Sorry, i forget to explain.

 

Its in the case of Pinterest Rich Pins.

 

Also some startups, as Keep.com or similar use this features.

 

As feedback, for all european stores, the module send the info in Euros (or the default currency even if you have other currency options), and some webpages only accept the info in dollars, it will be awesome of this module send the info in all available currencies of the store.

 

Hope you can help us to become available in all platforms.

 

Thanks and keep going!

Share this post


Link to post
Share on other sites

Oh, I see, well I should add pinterest's own data in that case. As for the currency, yes it grabs the current one, not sure the ograph's product object can hold all currencies supported by the store

Share this post


Link to post
Share on other sites

Good morning, Nemo!

I didn't use your module, but I have Open Graph in my theme (Warehouse) and I didn't get a reply from author.
So I hope for you kind reply.

 

Please find results of checking meta tags of my web site (index page):

Description:  INDEX PAGE META DESCRIPTION 
Set=:  =utf-8
Viewport:  initial-scale=1, user-scalable=no, maximum-scale=1, width=device-width
Generator:  PrestaShop 
Robots:  index, follow 
Erty=og:title content=INDEX PAGE NAME - NAME OF MY :  INDEX PAGE NAME - NAME OF MY STORE
Erty=og:url content=http:*addr*:  *address.ru*  (*addr* - only part of address... Why?)
Erty=og:site_name content=NAME OF MY :  NAME OF MY STORE
Erty=og:type content=we:  website
Erty=og:description content=INDEX PAGE META DESCRI:  INDEX PAGE META DESCRIPTION

Erty=og:image content=http:*address.ru*imglogo:  http:*address.ru*imglogo.jpg  (there is no slash /. Why?)
 
As you can see there are some repeating of tags.
Please find results of checking meta tags of category page:
 
Description:  CATEGORY META DESCRIPTION 
Set=:  =utf-8
Viewport:  initial-scale=1, user-scalable=no, maximum-scale=1, width=device-width
Generator:  PrestaShop 
Robots:  index, follow 
Erty=og:title content=CATEGORY META TITLE - NAME OF MY :  CATEGORY META TITLE - NAME OF MY STORE
Erty=og:url content=http:*address.ru*7-potolochnye-sveti:  http:*address.ru*7-potolochnye-svetilniki
Erty=og:site_name content=NAME OF MY :  NAME OF MY STORE
Erty=og:type content=we:  website
Erty=og:description content=CATEGORY META DESCRI:  CATEGORY META DESCRIPTION
Erty=og:image content=http:*address.ru*imglogo:  http:*address.ru*imglogo.jpg 
 
CATEGORY META TITLE, NAME OF MY STORE, CATEGORY META DESCRIPTION, INDEX PAGE META DESCRIPTION and INDEX PAGE NAME are written by myself in settings instead of real description (for your easy reading).
 
Why are there repeating of tags? There is no simply TITLE tag of pages. There is no slashes in links. Why? Is it normal?
 
I sincerely hope you will reply...
 
Thank you very much in advance.

Share this post


Link to post
Share on other sites

Uh, can you share your site's url? I think I am missing the point here :D

Yes, of course: rumum.ru

I was checking yesterday with Facebook, it's seems to me works fine, but I'm not sure.

Thank you in advance.

Share this post


Link to post
Share on other sites

Try checking the module's presence in modules-> positions in the header hook

Yeah, I've confirmed that it's in there... Here's a screenshot:

29zr4ux.png

Share this post


Link to post
Share on other sites

That's really weird, are you using multistore?

Nope! Yeah, I'm not sure why your code isn't appearing... I tried hardcoding the og tags in my product page manually but I guess I'm not smart enough to do it successfully lol! 

Share this post


Link to post
Share on other sites

Hi,

 

I'm using Prestashop v1.6, this works great for Pinterest rich pins for single product, but doesn't work for product packs, not sure if anybody has sent this feedback yet.

 

But being able to list my products is good enough for me! :)

 

Thank you for offering the module for free.

Share this post


Link to post
Share on other sites

Hello. Thanks for this great free module!

 
I've found a small bug in the way the site name is removed from og:title, and I'm hoping you'll be able to update the module with the fix.

 
Currently the module's template psograph.tpl removes the site name using:

<meta property="og:title" content="{$meta_title|escape:'htmlall':'UTF-8'|replace:{' - '|cat:$og_site_name}:''}" />

The problem is that the title is HTML-escaped before removing the site name, so for my site the escaped meta title has an apostrophe in the form ' yet $og_site_name has the apostrophe in its original form ('). The fix for this issue is to perform the replacement prior to escaping:

<meta property="og:title" content="{$meta_title|replace:{' - '|cat:$og_site_name}:''|escape:'htmlall':'UTF-8'}" />

Share this post


Link to post
Share on other sites

Hi Nemo1,

 

I just tried your module (by the way, thank you for offering this to us for free!) without any success. The opengraph tags are not on the page, it seems. I'm using v 1.5.2. Here's an example page on my site: http://tinyhandsonline.com/scented-cinnamon-roll-necklace.html

 

Hello Nemo, It seems i am experiencing a similar issue. I have installed the module. and used chrome to view the header I can see all the og tags have been added. i can even see that OGimage has been assigned the appropriate image for the product page. 

However for some reason when i share the link the page logo is shown. any ideas?

 

facebook opengraph debugger is returning this error. Provided og:image could not be downloaded or is not big enough. Please use an image that's at least 200x200px and is accessible from Facebook. Image 'http://www.chi-k-clothing.co.uk/img/chi-k-clothing-1405118947.jpg' will be used instead.

 

which is a bit of a joke because the image facebook decided to use is the logo 350x99px and the image shown as og:image in the header is larger than 200x200px.

 

I have added below an image of the page header and the full info from facebooks opengraph debugger

 

Capture.JPG

 

 

Open Graph Object Debugger
Input URL, Access Token, or Open Graph Action ID
Debug
Warning
Critical Errors That Must Be Fixed
Bad Response Code URL returned a bad HTTP response code.
Warning
Errors That Must Be Fixed
Missing Required Property The 'og:type' property is required, but not present.
mXkuC3v0c2M.png
Open Graph Warnings That Should Be Fixed
Inferred Property The 'og:url' property should be explicitly provided, even if a value can be inferred from other tags. Inferred Property The 'og:title' property should be explicitly provided, even if a value can be inferred from other tags. Inferred Property The 'og:description' property should be explicitly provided, even if a value can be inferred from other tags. Inferred Property The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags. og:image could not be downloaded or is too small Provided og:image could not be downloaded or is not big enough. Please use an image that's at least 200x200px and is accessible from Facebook. Image 'http://www.chi-k-clothing.co.uk/img/chi-k-clothing-1405118947.jpg' will be used instead.
Edited by bigyiin

Share this post


Link to post
Share on other sites

hm, maybe the target image is not accessible for some reason? Talking about file permissions I mean

 

I fixed this issue. Preferences => Geolocation => geolocation by ip. I set it to off. It seems to block facebook scraper that reads the og tags. it also causes issues with gtmetrix. both return 503 errors when its switched on. fyi, i had all the appropriate facebook ip addresses white listed. 

Edited by bigyiin

Share this post


Link to post
Share on other sites

Hi,

 

thanks for the module!

 

However, I have similar problem like some other users: instead of a product image, there's a shop's logo and Facebook debugger shows me message: Provided og:image could not be downloaded or is not big enough. Please use an image that's at least 200x200px and is accessible from Facebook.

 

Here it seems that the right properties are defined: post-313915-0-26826900-1407947985_thumb.jpg

 

Geolocation is turned off.

 

All ideas are very much apperciated.

 

Thanks,

Hannes

Share this post


Link to post
Share on other sites

Hello,

 

thanks for your great module.

 

it works correctly in 1.5.6.2 with original theme.

 

I have alle the datas :

<meta content="og:product" property="og:type">
<meta content="Photophore métal blanc à l'oiseau" property="og:title">
<meta content="http://www.monsite.com/4449/2484.jpg" property="og:image">
<meta content="Mon SIte" property="og:site_name">
<meta content="Photophore réalisé en métal peint en blanc rehaussé d'un oiseau" property="og:description">
<meta content="9.95" property="product:price:amount">
<meta content="EUR" property="product:price:currency">
 

Share this post


Link to post
Share on other sites

Thanks for this great module,

sometimes when a module is not (yet) working it is due to caching systems, make sure you clear it all if it not working

Share this post


Link to post
Share on other sites

nice module, but I do small fix on psograph.php

				case 'product':
					$og_type = 'og:product';
					$this->assignProductOG();
					break;

to

				case 'product':
					$og_type = 'product';
					$this->assignProductOG();
					break;

*if you use PS 1.6 don't forget to unhook social sharing module from displayHeader, it will cause duplicate meta

Share this post


Link to post
Share on other sites

Hi,

 

Tks for your module, it works nice ;)

 

I want do a modification and I need help to do it...

 

When we share a product link, there are 2 possibilities for the picture shared :

1) A square of 114*114px at the left of the description

2) A rectangle of 484*252px upper the description

 

I do not know how Facebook chose the display format and I'd just like to be able to display the image at size rectangle only when it exists.

Clearly I need to create a format og_image_484x252 image would recover only original in this format images when it's possible.
Then it would have in the meta it is asked to show the og: image in the following descending order:
* Og_product_image_rectangle (for 484x252 image)
* Og_product_image (for 114x114 image)
* Og_image_logo_url (if no image found!)

 

Can you do me the modifications to do plz ?

Share this post


Link to post
Share on other sites

Just find this in the code

 

 $this->context->link->getImageLink($id_product, $id_cover['id_image']);

 

 

And add a third parameter for the image type, like in that case 'large'

 

 $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'large');

 

Same for the post above, but I think adding 3 images will create conflict actually. You just have to use this 3 times with 3 different image names and variables

Share this post


Link to post
Share on other sites

Just find this in the code

 

 $this->context->link->getImageLink($id_product, $id_cover['id_image']);

 

 

And add a third parameter for the image type, like in that case 'large'

 

 $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'large');

 

Same for the post above, but I think adding 3 images will create conflict actually. You just have to use this 3 times with 3 different image names and variables

Tks,

 

Can you develop what you want to do because I don't anderstand by "You just have to use this 3 times with 3 different image names and variables" ?

Share this post


Link to post
Share on other sites

@2lordbdp

like this

 

 

if($id_cover)
{
 
$cover_img1 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'large');
$cover_img2 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'small');
}
else { $cover_img1 = '';  $cover_img2 = '';}
 
@crowell: do you have other graph tags on the template?

Share this post


Link to post
Share on other sites

 

@2lordbdp

like this

 

 

if($id_cover)
{
 
$cover_img1 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'large');
$cover_img2 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'small');
}
else { $cover_img1 = '';  $cover_img2 = '';}

 

Not good after images generated before

2014-10-29_1150.png

 

I have replaced those lines by yours :

if($id_cover)

				$cover_img =  $this->context->link->getImageLink($id_product, $id_cover['id_image']);

			else $cover_img = '';
Edited by lordbdp

Share this post


Link to post
Share on other sites

2 questions :

 

1) on psograph.php, I put it :

// Product Image

			$id_cover = Product::getCover($id_product);

			

			if($id_cover)

				$cover_img =  $this->context->link->getImageLink($id_product, $id_cover['id_image']);

			else $cover_img = '';
			if($id_cover)
			{
 
				$cover_img1 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'large');
				$cover_img2 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'small');
			}
			else { $cover_img1 = '';  $cover_img2 = '';}

or it :

// Product Image

			$id_cover = Product::getCover($id_product);

			

			if($id_cover)
			{
 
				$cover_img1 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'large');
				$cover_img2 =  $this->context->link->getImageLink($id_product, $id_cover['id_image'], 'small');
			}
			else { $cover_img1 = '';  $cover_img2 = '';}

2) Where & How assign the image on the template ?

Share this post


Link to post
Share on other sites

The second one, then, below

 

 
$this->context->smarty->assign(array(
'og_product_price_amount' => number_format($product_price, 2), //todo include fix here?
'og_product_image' => $cover_img,
'og_product_price_currency' => $currency
));
 
to
 
 
$this->context->smarty->assign(array(
'og_product_price_amount' => number_format($product_price, 2), //todo include fix here?
'og_product_image' => $cover_img,
'og_product_image2' => $cover_img2,
'og_product_price_currency' => $currency
));

 

 

And in the template you can reference the second one as well. But I don't know if 2 are supported

Share this post


Link to post
Share on other sites

Dear Nemo, first of all my compliments for your works.

I downloaded PS Facebook OpenGraph Tags for my Prestashop 1.6.0.9

 - Position is ok

- module is active

- i have inserted this code 

 

<meta property="og:title" content="{$meta_title|escape:'htmlall':'UTF-8'}"/>

<meta property="og:site_name" content="{$shop_name|escape:'htmlall':'UTF-8'}"/>
<meta property="og:type" content="website">
<meta property="og:description" content="{$meta_description|escape:html:'UTF-8'}">
{if $page_name=='product'}
<meta property="og:image" content="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'large')}">
        {else}
<meta property="og:image" content="{$img_ps_dir}logo.jpg" />
{/if}
 
but is not working.
any idea?
best regards

Share this post


Link to post
Share on other sites

The second one, then, below

 

 
$this->context->smarty->assign(array(
'og_product_price_amount' => number_format($product_price, 2), //todo include fix here?
'og_product_image' => $cover_img,
'og_product_price_currency' => $currency
));
 
to
 
 
$this->context->smarty->assign(array(
'og_product_price_amount' => number_format($product_price, 2), //todo include fix here?
'og_product_image' => $cover_img,
'og_product_image2' => $cover_img2,
'og_product_price_currency' => $currency
));

 

 

And in the template you can reference the second one as well. But I don't know if 2 are supported

If I do your modifications I obtain a blank page everywhere.

Share this post


Link to post
Share on other sites