[FREE MODULE] Facebook Open Graph Tags

12.6k · January 22, 2014

Social Media Marketing will be they Key to increase your website's rank in Search Engines and boost your visibility. If you share you products on Facebook, you might want to get 100% out of the Open Graph api, to display the right image, product name, site origin and more for the items you like!

Features

Totally FREE
Supports Pinterst RIch Pins!
Creates a complete set of Open Graph Tags for all pages
Price and currency information added to the og product object
Custom Images for each language
Manufacturers and Suppliers images too!

1.1k · January 24, 2014

Bonsoir,

Est-ce que votre module supporte prestashop 1.4.4.0 ?

Cordialement

12.6k · January 24, 2014

Hi!

No, it only works on 1.5. You can, however, manage to make it work if you change the image upload snippet

1.1k · January 24, 2014

How, please?

12.6k · January 24, 2014

It's long to explain, you have to be aware of how images were uploaded in 1.4, as 1.5 uses an imageManager class

February 1, 2014

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.

12.6k · February 1, 2014

It's really weird, can you link your website?

February 1, 2014

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

12.6k · February 3, 2014

It works for me now, I think it was the maintenance mode!

February 4, 2014

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.

12.6k · February 5, 2014

The module is not active, there are no opengraph tags in the site's html at the moment

February 5, 2014

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.

12.6k · February 5, 2014

So it seems!

Weird, it's simply not appearing in the front office!

February 5, 2014

It is better to uninstall and instal it again ? (i have done this before)

February 5, 2014

I have download it and install it all over again butt nothing changed.

12.6k · February 5, 2014

Clueless.

Try checking that it's actually there in modules, positions.

Prestashop version?

February 5, 2014

Yep its there prt sc1 prt sc2 .

PS version 1.5.1.0

Thank you again for your time.

12.6k · February 5, 2014

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

public function hookHeader($params)

{

return $this->header15($params);

}

February 5, 2014

I have did it but unfortunately nothing changed.

12.6k · February 5, 2014

It might be he prestashop version at this point.

$this->context->controller->php_self

might not be available on that version

February 5, 2014

I understand.

Is there something that can be done to resolve this issue ?

12.6k · February 5, 2014

I can't recall the alternative now, maybe it was a global $page_name ...?

February 5, 2014

Where can i change that ? Is there a chance for this bug to be fixed somehow ?

Thank you.

12.6k · February 5, 2014

I'll try to have a look when I have some time

February 26, 2014

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.

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

12.6k · February 27, 2014

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

February 27, 2014

I gave that a try but it did nothing. :/

12.6k · February 28, 2014

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) )

February 28, 2014

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 February 28, 2014 by artofadornment (see edit history)

12.6k · March 1, 2014

I'm clueless, as the tpl displays the hooking function runs, so that should be showing up as well :/

March 15, 2014

It appears that og:availability isn't created as part of the module. Is that something you can add?

12.6k · March 15, 2014

I'll add it to the TODOs Thanks for spotting!

May 1, 2014

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 ?

12.6k · May 1, 2014

What kind of issue are you having?

May 6, 2014

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

12.6k · May 7, 2014

Uh, I can't see any reference to product quantities here

https://developers.facebook.com/docs/payments/product/

May 7, 2014

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!

12.6k · May 7, 2014

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

May 20, 2014

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.

12.6k · May 21, 2014

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

May 21, 2014

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

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.

May 22, 2014

Thank you for this module , work great

May 23, 2014

for me dont works...the button share for facebook are without pic

12.6k · May 24, 2014

for me dont works...the button share for facebook are without pic

Can you share your site's url? Prestashop version?

June 11, 2014

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

12.6k · June 11, 2014

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

June 11, 2014

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:

12.6k · June 12, 2014

That's really weird, are you using multistore?

June 12, 2014

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!

12.6k · June 13, 2014

That's really strange. Do you have any php knowledge? you can try echoing out something from the hook method and see where it breaks

June 22, 2014

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.

12.6k · June 24, 2014

Right, packs! That's a nice catch, I'll see what I can do!

July 16, 2014

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'}" />

12.6k · July 17, 2014

Hey! Thanks for spotting! Updated

July 19, 2014

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

Open Graph Object Debugger

Input URL, Access Token, or Open Graph Action ID

Debug

Scrape Information

Response Code 503 Fetched URL http://www.chi-k-clothing.co.uk/shop/259-pink-strappy-dress.html?search_query=pink+strap&results=23 Canonical URL http://www.chi-k-clothing.co.uk/shop/259-pink-strappy-dress.html?search_query=pink+strap&results=23

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.

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 July 19, 2014 by bigyiin (see edit history)

12.6k · July 21, 2014

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

July 21, 2014

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 July 21, 2014 by bigyiin (see edit history)

12.6k · July 23, 2014

Ah! Thanks for sharing the solution!

August 13, 2014

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:

Geolocation is turned off.

All ideas are very much apperciated.

Thanks,

Hannes

12.6k · August 13, 2014

Any chance you are running something like mod_security?

August 14, 2014

Any chance you are running something like mod_security?

Thanks for answer. Nope, these modules are not enabled.

Any more ideas?

12.6k · August 15, 2014

Are you able to access the image directly from the browser?

August 15, 2014

Are you able to access the image directly from the browser?

Yes, no problem.

12.6k · August 15, 2014

clueless... any problems hotlinking the image somewhere? hotlink protection from your hoster? mod_security?

August 25, 2014

Hello,

thanks for your great module.

it works correctly in 1.5.6.2 with original theme.

I have alle the datas :

September 6, 2014

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

September 27, 2014

Hello everyone,

Quick question!

Can I use this module with Version 1.6.0.9 (latest)?

12.6k · September 27, 2014

Yup, sure you can

October 1, 2014

Yup, sure you can

OK, thank you ;-)

October 1, 2014

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

October 6, 2014

Hi Nemo1 i install you module to have Rich Pins but i have one problem.

I received this when i try rich Pins Validator:

It looks like your URL is missing some required info. Please check the documentation and add anything that's missing.

Thanks in advance.

12.6k · October 8, 2014

Link to your site?

October 8, 2014

I solved yesterday with a module.

Thanks anyway

October 22, 2014

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 ?

2k · October 23, 2014

How do I?

12.6k · October 24, 2014

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

October 24, 2014

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" ?

October 28, 2014

Very nice module, and thank you for it!
I have a small problem which I don't know how to solve, my website description doesn't appear when I link on fb. At the same time I can see the right description on https://developers.facebook.com/tools/debug/og/object/

Is it fb and I should just wait?

12.6k · October 29, 2014

@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?

October 29, 2014

@Nemo1

I think I do, I remember marking once my homepage in some google tool..

October 29, 2014

@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

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 October 29, 2014 by lordbdp (see edit history)

12.6k · October 31, 2014

But did you also assign the second image, and used it in the template?

October 31, 2014

I used https://www.google.com/webmasters/markup-helper/ and I installed PS Rich Snippets and Breadcrumbs , if rich snippets have any influence. Any idea why I can't see the description on fb?

October 31, 2014

But did you also assign the second image, and used it in the template?

yes.done.

12.6k · November 1, 2014

@lordbdp: weird, assigned like..?

@crowell: they should not interfere if they're the ones from my tut, hm

[FREE MODULE] Facebook Open Graph Tags

Recommended Posts

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites