Open Graph protocol - adding tags useful?

[Mister Denial]

Hi everyone,

 

I was wondering if there is a point to add the Open Graph protocol tags to product pages - are there any benefits to that, and has anyone experience with this?

 

I'd really like to hear your thoughts on this.

 

Dan

[yaniv14]

I think that those tag will be good just for social media, like if you have a like button in product page, by adding the og tags you can determine which name,description,image, url etc.... will be passed on to share in facebook, same thing for gplus, twittwe ....

[vekia]

In my opinion social networks are important thing in e-commerce today, so i can go ahead and say that OG tags are necessary

event if you don't want to integrate your shop with facebook ... Why? Because when someone will add and url to your shop to own timeline, without OG tags it may looks weirdy....

[Dh42]

Here is some what of an example f what you get by adding them, http://blog.dh42.com...age-in-og-tags/

 

EDIT:

The main point is you want to control your brad image across all platforms. Control is important, you want people to see what you want to show them, not what a linter picks up and shows them.

[Presta Ecommerce]

I'll add that those are important nowadays. I only have good experience with them and strongly recommend.

[Mister Denial]

Thanks everyone for the feedback! I have started adding the OG tags used by Facebook, but I am wondering if there would also be a point in adding the microformats used by Google, for example? Does anyone use multiple tag formats, or would that be counter-productive?

[Dh42]

Put the microformats as well, they are basically two different kinds of tags used for two different purposes. OG tags are generally for social type sites like FB, reddit, Stumble upon. While the microformats describe data being sent to search engines to make your site "richer" for the search engines. 

[DARKF3D3]

Hi Dh42, i'm trying to follow your guide to add the OpenGraph to my website.

I done the second part (adding the code to the header) without any problem but i don't understand what to do with the first part.

I din't understand where to place this code:

public function preProcess()
    {
 
        $product = new Product($_GET['id_product'], false, intval($cookie->id_lang));
    if (Validate::isLoadedObject($product))
        self::$smarty->assign('product', $product);
 
    $images = $product->getImages(intval($cookie->id_lang));
    foreach ($images AS $k => $image)
        if ($image['cover'])
        {
            $cover = $image;
            $cover['id_image'] = intval($product->id).'-'.$cover['id_image'];
            $cover['id_image_only'] = intval($image['id_image']);
        }
        if (!isset($cover))
        $cover = array('id_image' => Language::getIsoById($cookie->id_lang).'-default', 'legend' => 'No picture', 'title' => 'No picture');
    self::$smarty->assign('cover', $cover);
    }

So I tried downloading your file and placed in override/classes but when i put it my shop stop working.

 

 

I'm using prestashop 1.4.9.

[Dh42]

It either needs to go as an override of your frontcontroller or direcectly into your frontcontroller. If you search your front controller for preprocess, you should see the spot. 

[DARKF3D3]

The problem is that i don't understand where they must be placed.

I try to look in the folder override/classes and i see there's a file named "_FrontController.php", that to enable it you should remove the _. I try to remove it but i broke my website, if there's that file my website doesn't works.

[DARKF3D3]

I think it should works because on its guide i read "Please note, this method only works with 1.4 versions of Prestashop.", I hope on all version of 1.4 like mine that's the 1.4.9.

[Dh42]

In your shop, open you classes/frontcontroller.php and look for this 

public function preProcess()
    {
}

Paste this code between the two brackets

 $product = new Product($_GET['id_product'], false, intval($cookie->id_lang));
    if (Validate::isLoadedObject($product))
        self::$smarty->assign('product', $product);
 
    $images = $product->getImages(intval($cookie->id_lang));
    foreach ($images AS $k => $image)
        if ($image['cover'])
        {
            $cover = $image;
            $cover['id_image'] = intval($product->id).'-'.$cover['id_image'];
            $cover['id_image_only'] = intval($image['id_image']);
        }
        if (!isset($cover))
        $cover = array('id_image' => Language::getIsoById($cookie->id_lang).'-default', 'legend' => 'No picture', 'title' => 'No picture');
    self::$smarty->assign('cover', $cover);

So that it looks like the code above. You are looking at around line 443. 

[DARKF3D3]

Thanks Dh42, 

it's correct that now on products page in header it show this?

<meta content="http://www.nome-sitot.it/613-1141-large/Array.jpg" property="og:image">

 

The shop is in signature.

Edited February 24, 2021 by DARKF3D3 (see edit history)

[Dh42]

The url is strange, but oddly enough it works, have you checked with the facebook linter?

[NemoPS]

What are you using in the template? just the variable?

[technoschool]

No idea which tags you are mentioning.. SEO or coding tags

[DARKF3D3]

Sorry for the delay but i haven't seen the notify of reply.

 

The url is strange, but oddly enough it works, have you checked with the facebook linter?

I don't find a way to test on facebook, i notice the problem because some user told me, but i'm not very pratical with facebook and i don't know where to go to see if image it's correct when i add the like... Google plus button seem to be ok, because it open a frame with the correct image. If you want to try facebook it's the website in signature.

 

What are you using in the template? just the variable?

 

I don't know, i think it's the same as prestashop base 1.4.9 theme... Where i can see that?

[vekia]

 

I don't find a way to test on facebook, i notice the problem because some user told me, but i'm not very pratical with facebook and i don't know where to go to see if image it's correct when i add the like... 

https://developers.facebook.com/tools/debug/ - insert there url to any product page (or anything else) you want and hit "Debug" button.

[DARKF3D3]

Thanks vekia, i tested some products with the tool you linked and all show correct image and also name and other infos, so i think it's all correct.

[Ire Tech USA]

Thank you very much for the contribution, everything works fine for sharing on Facebook can watch the stream in this url Ire-Tech Store: http://goo.gl/DZQZ73

Thank you and good day.