Post by timmieboy » Thu Nov 15, 2012 9:06 pm

Hello,

I have a question, I have installed this and Facebook/Twitter is working fine. I only have another problem. When I click on a category and than on a product my template is totally ruined. The same happens when I click on a name of the supplier and that on a product. See picture what happens. The strange things is that it only happens in IE. I discovered that the problem shows when I add the header code. Unfortunately when I do not copy the code in the header facebook is not working anymore and it shows a random picture again.

Next to this, when I click on a facebook like button, still the wrong picture appears, why is that.

Any ideas what can be wrong, www.your-lifestyle.nl is my site.

Thanks

Attachments

error-product.jpg

error-product.jpg (37.26 KiB) Viewed 22257 times


Active Member

Posts

Joined
Thu Jun 10, 2010 2:56 am

Post by bones_ct » Mon Nov 26, 2012 5:14 am

I found a simple solution for the image to show on facebook like. It probably works on all open cart versions.
go to /catalog/view/theme/default/template/product/product.tpl

replace the first line from this:
<?php echo $header; ?><?php echo $column_left; ?><?php echo $column_right; ?>

to this:
<?php echo '<meta property="og:image" content="'.$rs_image1.'" />'.$header; ?><?php echo $column_left; ?><?php echo $column_right; ?>

and remove any og:image meta from the header file to avoid duplicates.
header file is : /catalog/view/theme/default/template/common/header.tpl

Newbie

Posts

Joined
Mon Nov 26, 2012 5:08 am

Post by timmieboy » Fri Nov 30, 2012 5:11 pm

Hi,

I have tried this, but I get this error:
Notice: Undefined variable: rs_image1 in /var/www/vhosts/your-lifestyle.nl/httpdocs/catalog/view/theme/OC04A00422/template/product/product.tpl on line 1

Something is not correct

Active Member

Posts

Joined
Thu Jun 10, 2010 2:56 am

Post by bones_ct » Sun Dec 02, 2012 4:59 pm

Maybe the $rs_image1 variable is not named like that on your code. Just search in the product.tpl for "img src" and in the first instance that you find see what's the php variable that builds that src, and use it instead of $rs_image1

Newbie

Posts

Joined
Mon Nov 26, 2012 5:08 am

Post by timmieboy » Tue Dec 11, 2012 6:01 pm

Hi, thanks, it is working but the next problem occurs, my text style is changing. So there is still going something wrong. I have changed it in the product.tpl of my template not the default one.

Active Member

Posts

Joined
Thu Jun 10, 2010 2:56 am

Post by tacno » Wed Mar 13, 2013 10:16 pm

Works in 1.5.4.1

Newbie

Posts

Joined
Wed Mar 13, 2013 10:15 pm

Post by gocreative » Fri Jun 07, 2013 10:26 am

Below was my solution in /catalog/view/theme/default/template/product/product.tpl:

Code: Select all

<?php
$find = '<head>';
$replace = '<head><meta property="og:image" content="'.$thumb.'" />';
echo str_replace($find,$replace,$header);
?>

<?php //echo $header; ?><?php echo $column_left; ?><?php echo $column_right; ?>
You could replace a different element instead of <head>, but that does the trick. You can of course also use this in any other page required.

For the sake of completeness, you might want to add these lines of code to your header.tpl file:

Code: Select all

<meta property="og:title" content="<?php echo $title; ?>">
<meta property="og:type" content="website">
<meta property="og:url" content="<?php echo $base; ?>">
<meta property="og:image" content="http://www.YOURWEBSITEHERE.com/og-image.jpg">
<meta property="og:site_name" content="<?php echo $name; ?>">
<?php if ($description) { ?><meta property="og:description" content="<?php echo $description; ?>"><?php } ?>
And you could then alter my above solution to replace the og:image property instead, like this:

Code: Select all

<?php
$find = '<meta property="og:image" content="http://www.YOURWEBSITEHERE.com/og-image.jpg">';
$replace = '<meta property="og:image" content="'.$thumb.'" />';
echo str_replace($find,$replace,$header);
?>

<?php //echo $header; ?><?php echo $column_left; ?><?php echo $column_right; ?>
This way you have a default opengraph image but you can override it with the product thumbnail (or whatever else you want).

User avatar
Active Member

Posts

Joined
Tue Jan 12, 2010 5:46 pm

Post by paketonlinestore » Fri Jun 28, 2013 11:47 am

I have a problem with ShareThis Button on one of my website, it won't fetch the product image while its definitely clear that the product image size is 300x300 and square. Here is the example link http://www.happymocha-shop.com/bed-cover I have put the open graph meta tags (og:title, og:type, og:url, og:image, etc) and managed to get the product description, url and title right but still no image. The Facebook Share Button somehow keep refusing to detect my product image while it was standing right there. I already tried so many things but none of them seem working.

I've used the Facebook Linter/Debugger in http://developers.facebook.com/tools/debug/ but still it refused to recognised my product image. It says that "Provided og:image is not big enough. Please use an image that's at least 200x200 px. Image 'logo.png' will be used instead."

This is horrifying, my product image size is 300x300 squared and it was standing right there on the page. The Facebook share button refuses to recognize my product thumbnail. How to fix this please help me.

I already have spent 3 days to fix this but still no luck up until now. Please help and thank you before.


Posts

Joined
Fri Jun 28, 2013 11:37 am

Post by gocreative » Sat Jun 29, 2013 6:43 am

Have you checked that the image is RGB and 72dpi?

User avatar
Active Member

Posts

Joined
Tue Jan 12, 2010 5:46 pm

Post by paketonlinestore » Sat Jun 29, 2013 12:14 pm

gocreative wrote:Have you checked that the image is RGB and 72dpi?
I've recheck it again, the original image in http://www.happymocha-shop.com/bed-cover even though it was 600x420 px size but the DPI is 200.

I then tried to upload another product http://www.happymocha-shop.com/bed-cover-8 and this one original image is 1000x1000px size and 72DPI, but still facebook couldn't fetch the image right. The Facebook linter/debugger still won't recognize the image ??? I have no idea why


Posts

Joined
Fri Jun 28, 2013 11:37 am

Post by syedilyasahmed » Sat Jul 13, 2013 3:23 am

Hi smash, it looks like you are the only one who knows all about facebook sharing ;). my issue, is I cant make the images show on when I paste my product url in facebook, the theme I bought has all the share buttons, but only problem is images does not sho. can you please help me out with this. thank you.


Posts

Joined
Sun Apr 07, 2013 12:46 pm

Post by gocreative » Sat Jul 13, 2013 6:27 am

syedilyasahmed, the product image doesn't show because the template file for the product page (/catalog/view/theme/default/template/product/product.tpl) doesn't assign the product thumbnail as the OpenGraph image. My code sample a few posts up from this will solve your problem.

After implementation, you'll need to clear Facebook's cached version of your page by pasting your link into the input here: http://developers.facebook.com/tools/debug

User avatar
Active Member

Posts

Joined
Tue Jan 12, 2010 5:46 pm

Post by alenivancec » Mon Dec 16, 2013 9:29 pm

Hello. I have ShareThis plugin on my opencart but image showing up does not work i tried all of the options above but it still doesent work. Can someone help me? The site url is http://biciklopedija.hr/

Newbie

Posts

Joined
Mon Dec 16, 2013 9:27 pm

Post by appaji » Tue Mar 11, 2014 7:44 pm

I like these instructions in detail. I need to add price and author details in addition to description to share with facebook users. how do I do that?

Newbie

Posts

Joined
Thu Jan 17, 2013 5:34 pm

Post by gocreative » Wed Mar 12, 2014 5:34 am

I'm not sure about the "author" since there is no such thing for products, however you could append the price to the description using the same method described above. For example instead of the $thumb variable, you would use $price (or whatever price variable you have in your template that you'd like to use).

User avatar
Active Member

Posts

Joined
Tue Jan 12, 2010 5:46 pm

Post by comprido » Tue Jul 01, 2014 5:24 pm

In your theme header.tpl:

Code: Select all

<!-- mod og:image para FB -->
<?php if ($thumb || $images) { ?>
<meta property="og:image" content="<?php echo $thumb; ?>">
<?php } else { ?>
<meta property="og:image" content="<?php echo $logo; ?>">
<?php } ?>
<!-- mod og:image para FB -->
In controller/common/header.php, just after: $this->data['name'] = $this->config->get('config_name'); :

Code: Select all

if (isset($this->request->get['product_id'])) {
			$product_id = (int)$this->request->get['product_id'];
		} else {
			$product_id = 0;
		}
		
		$this->load->model('catalog/product');
		$product_info = $this->model_catalog_product->getProduct($product_id);		
		$this->data['product_info'] = $product_info;
		if ($product_info['image']) {
				$this->data['thumb'] = $this->model_tool_image->resize($product_info['image'], $this->config->get('config_image_thumb_width'), $this->config->get('config_image_thumb_height'));
			} else {
				$this->data['thumb'] = '';
			}			
			$this->data['images'] = array();
This code fix the problem for me.

Attachments

ogimage_opencart.png

og:image facebook meta opencart - ogimage_opencart.png (251.06 KiB) Viewed 18398 times


Pedro Martin - websitesbuilder.com.au
Checkout my free extensions: https://www.opencart.com/index.php?rout ... r=comprido


User avatar
New member

Posts

Joined
Mon Sep 10, 2012 11:46 pm

Post by psycmos » Fri Jul 04, 2014 6:36 pm

Thanks a lot my friend! it works perfect and solve the problem!
In my case facebook share wrong thumb in opencart because it are always loading 100x100 thumb image.

After insert that code it fix my problem as works perfect to share the store and products!!!
Thanks a lot for share this info!!!

New member

Posts

Joined
Mon Nov 26, 2012 7:31 pm

Post by deal1668 » Tue Nov 18, 2014 12:29 pm

hi there,version 2.0 i can't fix this bug, can you help for version 2.0, pls help step by step ,thanks so much!

Newbie

Posts

Joined
Mon Nov 17, 2014 10:46 pm

Post by kanisvaa » Fri Nov 21, 2014 12:31 pm

Any update on this issue solution at 2.0 version ??

Newbie

Posts

Joined
Mon Jun 17, 2013 11:29 am

Post by aheen » Fri Nov 21, 2014 8:29 pm

does it work for opencart 1.5.6.4??

Newbie

Posts

Joined
Wed Nov 19, 2014 2:04 pm
Who is online

Users browsing this forum: No registered users and 2 guests