Post by Smash » Sat Oct 01, 2011 1:30 am

Opencart 1.5.1 Facebook Share with Title, Product Image, Description, Product URL.

I've came up with a solution that works with http://www.opencart.com/index.php?route ... on_id=1701.
All original credit goes to Asif_mahmood for the original creation of Facebook & twitter share module.

I don't take any credit for his work, I was just like the rest of you trying to figure how to make this work between Facebook Posts with the correct Product Image.

Also this is for Facebook only, you can add Twitter by using Asif_mahmood Opencart Mod or by getting source code directly from Twitter.


Thanks and enjoy! ;D


Place the share button anywhere in your product TPL file.

Code: Select all

<a name="fb_share" type="icon_link" share_url="<?php echo CURRENT_URL; ?>">Share Me!</a> 
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">
</script>

Add this code to your catalog/controller/product/product.php file around line: 211

Find :

Code: Select all

foreach ($results as $result) {
				$this->data['images'][] = array(
					'popup' => $this->model_tool_image->resize($result['image'] , $this->config->get('config_image_popup_width'), $this->config->get('config_image_popup_height')),
					'thumb' => $this->model_tool_image->resize($result['image'], $this->config->get('config_image_additional_width'), $this->config->get('config_image_additional_height'))
				);

Add this just below:

Code: Select all

$this->document->addFBMeta('og:image', $this->model_tool_image->resize($result['image'], $this->config->get('config_image_additional_width'), $this->config->get('config_image_additional_height')) );
			
			}
********NEW FIX UPDATED**** 12-19-2011

At the top of your system/library/document.php

Replace this:

Code: Select all

<?php
final class Document {
	public $title;
	public $description;
	public $keywords;
	public $base;	
	public $charset = 'utf-8';		
	public $language = 'en-gb';	
	public $direction = 'ltr';		
	public $links = array();		
	public $styles = array();
	public $scripts = array();
	public $breadcrumbs = array();
With this:

Code: Select all

<?php
final class Document {
	public $title;
	public $description;
	public $keywords;
	public $base;	
	public $charset = 'utf-8';		
	public $language = 'en-gb';	
	public $direction = 'ltr';		
	public $links = array();		
	public $styles = array();
	public $scripts = array();
	public $breadcrumbs = array();
	public $fbMeta = array();


Then add this in the same system/library/document.php around line: 26

Find this:

Code: Select all

public function getKeywords() {
		return $this->keywords;
	}


Add this just below:

Code: Select all

public function addFBMeta($property , $content ) {
		$this->fbMeta[] = array(
			'property'   => $property,
			'content' => $content
		);			
	}
	
	public function getFBMeta () {
		return $this->fbMeta;
	}



Add this to your templates common/header.tpl file

At the top of your header.tpl find the meta description call:

Code: Select all

<?php if ($description) { ?>
<meta name="description" content="<?php echo $description; ?>" />
<?php } ?>

Replace it with this:

Code: Select all

<fb:share-button class="meta">
<meta name="medium" content="mult"/>
<?php foreach ($this->document->getFBMeta() as $fbMeta) { ?>
<meta property="<?php echo $fbMeta['property'] ?>" content="<?php echo $fbMeta['content']; ?>" />
<?php } ?>
<?php if ($description) { ?>
<meta name="description" content="<?php echo $description; ?>" />
<?php } ?>
</fb:share-button>

That's it your done!! Fully tested and working 100% in Opencart 1.5.1
http://www.doawebdesigns.com

Attachments

fb-share-screenie.png

What the Share Looks Like - fb-share-screenie.png (109.38 KiB) Viewed 26850 times

Last edited by Smash on Tue Dec 20, 2011 2:58 am, edited 3 times in total.

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by Maansy » Sat Oct 01, 2011 5:40 am

Does the page validate correctly with this addon?

ALL Templates :: 1.5.1+ Templates :: 50%-75% PRICE DROP ONLY at OpencartStuff.com


User avatar
Active Member

Posts

Joined
Thu Jun 24, 2010 6:04 am


Post by Smash » Sat Oct 01, 2011 6:06 am

This is the only error when validating W3C.

<fb:share-button class="meta">

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by insan » Wed Nov 23, 2011 8:51 am

Thank you so much Smash.....

I've tried it in 1.4.9.4 and it works!!!

Thank you so much.....

Newbie

Posts

Joined
Wed Nov 23, 2011 8:48 am

Post by Smash » Wed Nov 23, 2011 8:55 am

Your welcome, glad I could help :)

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by insan » Thu Nov 24, 2011 9:46 am

is it the complete code?? :

Code: Select all

<meta name="medium" content="mult"/>
because i've got errors..just when i opened the home page. It appears at the top of home page:
Notice: Undefined property: Document::$fbMeta in /home/bismmcom/public_html/jual/system/library/document.php on line 52Warning: Invalid argument supplied for foreach() in /home/bismmcom/public_html/jual/catalog/view/theme/default/template/common/header.tpl on line 13
can you help me how to solve it?
thanks.

Newbie

Posts

Joined
Wed Nov 23, 2011 8:48 am

Post by Smash » Thu Nov 24, 2011 10:11 am

Can you send me both your document.php and header.tpl file ?

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by insan » Fri Nov 25, 2011 7:19 am

Smash wrote:Can you send me both your document.php and header.tpl file ?
Ok. Please check your PM inbox.
Thank you.

Newbie

Posts

Joined
Wed Nov 23, 2011 8:48 am

Post by d3z1gnr » Wed Dec 14, 2011 5:45 am

hey smash, this looks great. unfortunately getting the same error as insan. are you able to help?

mike

Mike Little
Director / Developer / Makes the coffee
Creative Digital Limited
http://www.creativedigital.co.nz


User avatar
Active Member

Posts

Joined
Mon Jan 18, 2010 2:59 pm
Location - Auckland, New Zealand

Post by d3z1gnr » Tue Dec 20, 2011 2:38 am

bump? not sure if anyone else is able to help... we are getting the exact same error as insan above.

Code: Select all

Notice: Undefined property: Document::$fbMeta in /home/bismmcom/public_html/jual/system/library/document.php on line 52Warning: Invalid argument supplied for foreach() in /home/bismmcom/public_html/jual/catalog/view/theme/default/template/common/header.tpl on line 13

Mike Little
Director / Developer / Makes the coffee
Creative Digital Limited
http://www.creativedigital.co.nz


User avatar
Active Member

Posts

Joined
Mon Jan 18, 2010 2:59 pm
Location - Auckland, New Zealand

Post by Smash » Tue Dec 20, 2011 2:49 am

Sorry for the late response. I've been slammed helping others.


I believe this is your issue:

Code: Select all

public $fbMeta = array();

In the document.php the top of your code should be this:

Code: Select all

<?php
final class Document {
	public $title;
	public $description;
	public $keywords;
	public $base;	
	public $charset = 'utf-8';		
	public $language = 'en-gb';	
	public $direction = 'ltr';		
	public $links = array();		
	public $styles = array();
	public $scripts = array();
	public $breadcrumbs = array();
	public $fbMeta = array();

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by d3z1gnr » Tue Dec 20, 2011 4:26 am

thanks heaps for you help smash!! we are still getting some odd images (including related products) going on facebook instead but at least the post is looking a lot better.

ps. we are using this for the "Like" button - so do get to choose which image as with shares.

Mike Little
Director / Developer / Makes the coffee
Creative Digital Limited
http://www.creativedigital.co.nz


User avatar
Active Member

Posts

Joined
Mon Jan 18, 2010 2:59 pm
Location - Auckland, New Zealand

Post by Smash » Tue Dec 20, 2011 4:33 am

d3z1gnr wrote:thanks heaps for you help smash!! we are still getting some odd images (including related products) going on facebook instead but at least the post is looking a lot better.

ps. we are using this for the "Like" button - so do get to choose which image as with shares.
The reason for this issue is because of Facebook.
Try sharing a product that you haven't tried to share before with this mod. You should see it working perfectly.

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by d3z1gnr » Tue Dec 20, 2011 5:55 am

yes i think you are right. we have done some more testing and it is working as expected. nice!!

Mike Little
Director / Developer / Makes the coffee
Creative Digital Limited
http://www.creativedigital.co.nz


User avatar
Active Member

Posts

Joined
Mon Jan 18, 2010 2:59 pm
Location - Auckland, New Zealand

Post by Smash » Tue Dec 20, 2011 7:42 am

d3z1gnr wrote:yes i think you are right. we have done some more testing and it is working as expected. nice!!
Good to hear, I'm glad it's working as expected.

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by drezh » Mon Apr 16, 2012 4:13 am

i use 1.5.1.3 and dont work for me :(

Newbie

Posts

Joined
Sun Jan 22, 2012 2:11 am

Post by Smash » Mon Apr 16, 2012 10:58 am

drezh wrote:i use 1.5.1.3 and dont work for me :(
It works in 1.5.1.3, I'm currently using it here: http://www.missconstrued.com

Chomp Digital

Website: http://www.chonpdigital.com
Google+: https://plus.google.com/108959837460610412406?prsrc=2
Twitter: http://www.twitter.com/ChompDigital
Image


Newbie

Posts

Joined
Fri Sep 02, 2011 8:10 am
Location - AZ

Post by pooks » Mon Apr 30, 2012 3:36 am

Its not working for us but I'd be happy to buy social icons as extension like the ones you had in the screenshot

New member

Posts

Joined
Tue Mar 27, 2012 1:42 am

Post by getwasimin » Sun Oct 14, 2012 4:15 pm

The website encountered an error while retrieving https://www.facebook.com/sharer/sharer. ... c.facebook. It may be down for maintenance or configured incorrectly.


this is the problem i am facing while sharing to facebook, please help me.

Newbie

Posts

Joined
Sun Oct 14, 2012 4:12 pm

Post by ralphstirrat » Thu Nov 15, 2012 12:50 am

Great add on thanks

http://colbrook.co.uk


Active Member

Posts

Joined
Wed Aug 29, 2012 7:53 pm
Who is online

Users browsing this forum: No registered users and 3 guests