Post by sketchi » Tue Mar 15, 2011 4:29 pm

@vang: I think this thread gives some clues as to the solution of the problem of not being able to call product data such as the SKU or image in the header template:

http://forum.opencart.com/viewtopic.php ... =0#p141521

Maybe your PHP skills are more solid than mine so you can figure out how to adapt this solution to the header template rather than the product template? *fingers crossed*

User avatar
New member

Posts

Joined
Wed Sep 22, 2010 5:04 pm

Post by vang » Wed Mar 16, 2011 11:35 am

@dogacankanat ... yeah, I agree with you. Whether we like it or not, social is the trend. Not only social, but mobile as well. So, I'm looking at making a mobile site off of my current store. Just wish I had coding skills. :( I can probably make due with CSS, but it has its drawbacks.
I think the Facebook comments will be easier than the fbconnect. You can probably just make a new tab and the add the code for fb comments. Then just turn off (in admin) or remove the code for the current reviews system from the product.tpl. I added a Disqus comment tab to my product page.
Keep us updated on your fbconnect adventure and let us know how it goes. I'll keep working on it too and keep you posted.

@sketchi ... dogacankanat had the solution to my problem. Instead of using the Image or SKU, he used the SEO data which worked like a charm.
It wasn't stated before, at least I don't think it was, but the Opengraph tags should be placed in your header.tpl file, not your product .tpl file. This would put the Opengraph protocol in your header. Did I understand you correctly, or did I miss something?
Of course, it still doesn't help if you are trying to pull the SKU data. :(

http://www.aboveclothing.com


User avatar
New member

Posts

Joined
Mon May 11, 2009 8:22 am


Post by sketchi » Wed Mar 16, 2011 2:56 pm

@vang: Using the SEO data isn't going to work for me as all my images in this case use the SKU in the name. Also, I don't want to force my clients to name the images one way or the other (or enter the SKU in the SEO field), so the ultimate solution would be to call the image whatever it's called.

Calling the image from the product template has never been a problem getting to work as far as I'm concerned, but since meta tags need to sit in the head section it needs to be in the header template as you say, and that's what I don't know how to acheive... :'(

User avatar
New member

Posts

Joined
Wed Sep 22, 2010 5:04 pm

Post by KuriN » Wed Mar 16, 2011 6:32 pm

Hey,

I put in the code just as you said, but nothing appears on the product pages. It just adds some space between "average rating" and "Quantity"

Any ideas?

Edit -> fixed that, but the problem mentioned above with the wrong picture is still there. I read everithing posted but it is very hard for me to uderstand. Can somebody please write the solution as simple as possible?

Thanks a lot in advance!

New member

Posts

Joined
Mon Jan 31, 2011 6:15 pm

Post by itrends » Thu Mar 17, 2011 4:33 am

Just adding my post here so I get updates on this. I'd love to install this on my site but until the image issue is fixed I'll wait :)

Active Member

Posts

Joined
Tue Jul 14, 2009 7:54 pm

Post by KuriN » Thu Mar 17, 2011 6:42 pm

I think I found another problem with this MOD. When I post a link on the fanpage of my website on facebook, the thumbnail doesn't appear at all.

It is great mod, but still some issues to clarify. Can somebody help us with this?

New member

Posts

Joined
Mon Jan 31, 2011 6:15 pm

Post by WSurfer » Tue Mar 22, 2011 6:39 am

Hello all!

I've been playing with FB Like button for a whole day and I still haven't figured out how to deal with main picture which is not displaying on FB wall when someone press like button at product.

I entered meta tags as:

On top of the header.tpl file

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml" dir="<?php echo $direction; ?>" lang="<?php echo $lang; ?>" xml:lang="<?php echo $lang; ?>" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml" >
Under meta tags

Code: Select all

<meta property="og:image" content="<?php echo $thumb; ?>" />



And when I open source code of my browser I get this error under meta property tag:

Code: Select all

<meta property="og:image" content="<b>Notice</b>: Undefined variable: thumb in <b>/var/www/vhosts/playroom.si/httpdocs/catalog/view/theme/studio/template/common/header.tpl</b> on line <b>25</b>" />
If someone knows how to define this variable then we should solve this problem without extra "FB" folders.

Can someone help me on this? Or have a suggestion?


Best regards

http://playroom.si


New member

Posts

Joined
Thu Mar 11, 2010 5:17 am

Post by sketchi » Thu Mar 24, 2011 4:58 pm

@WSurfer and anyone else trying to get the Facebook Like button to show the right image - an extension has just been posted where the solution can be found!

Take a look at the Facebook & Twitter Share extension: http://www.opencart.com/index.php?route ... on_id=1701

The only remaining issue I have now is to generate only one og:image tag rather than several if there are multiple product images, so the main image is always shown, but that's an issue I can live with for now :)

User avatar
New member

Posts

Joined
Wed Sep 22, 2010 5:04 pm

Post by WSurfer » Thu Mar 24, 2011 7:19 pm

Hi sketchi!

Thank you for your reply!

Yup, I saw that there are multiple image meta tags, but for the most products it's working fine.

I just found one or two products on my site, where I always get related product picture.
it's this product: http://playroom.si/Onkyo-TX-SR-309


Maybe there should be a function, which would ordered to take only first picture, if more pictures are added to product.

but as you said... We can live with such small problem.


Thanks again

http://playroom.si


New member

Posts

Joined
Thu Mar 11, 2010 5:17 am

Post by KuriN » Mon Mar 28, 2011 11:09 pm

Hey Guys,

I saw the extension and the images are working fine there.

I have one questions, since i modified the product.tpl in view/theme/default, is it possible just to add this code in the header.tpl:

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>
I got this code from the extension's documents section.

I tried just putting it there but no success with the images on facebook. Is there a way to add it correctly and resolve this annoying problem?

New member

Posts

Joined
Mon Jan 31, 2011 6:15 pm

Post by WSurfer » Tue Mar 29, 2011 6:31 am

Hello KuriN

Please check this instructions and modifications:
Take a look at the Facebook & Twitter Share extension: http://www.opencart.com/index.php?route ... on_id=1701
Best

http://playroom.si


New member

Posts

Joined
Thu Mar 11, 2010 5:17 am

Post by vang » Tue Mar 29, 2011 11:11 am

Sorry Sketchi. You know how it is working on a site. You end up jumping around and getting focused on other things. Well, that's how it is with me any way. :(

I don't have the [MOD] you guys are using so I really can't tell you what and what is not included, but I was having the IMAGE problem as many of you are. It seems as if whoever made the [MOD] didn't include instructions on how to properly set-up your header file with the Opengraph Protocol that Facebook uses to gather the data from your page.
By using the Opengraph protocol set-up that we discussed earlier everything works great on my end.

This is how I set-up my meta tag for the image (in the header.tpl of course).
Thank you dogacankanat for the code! ;)

Code: Select all

<?php foreach ($links as $link) { ?>
<meta property="og:image" content="http://www.YOUR_DOMAIN.com/catalog/view/theme/YOUR_TEMPLATE/image/fb/<?php echo str_replace('http://www.YOUR_DOMAIN.com/', '', $link['href']); ?>.jpg"/>
<?php } ?>
We were never able to get the images pulled from the product page as hoped. It seems that "Addthis" can pull the image just fine, but I don't know how. ???
Anyway, I created an "fb" directory in my image directory (under my template), and uploaded my Facebook images there.
I had to use my product link to name the image file.
e.g. http://www.aboveclothing.com/Logos-V3-charcoal <-- I removed my URL and named my image Logos-V3-charcoal.jpg .

Here is the post to a Facebook wall:
Image
and here is the Facebook page that is created:
Image

I did this for each product. I don't have that many products right now, so it was not too difficult for me. I can see it being a pain if you have a lot of products.

Other than that, I really don't know what to tell you guys.
I was hoping we would have a better solution to pulling the image for Facebook, but apparently the right person hasn't seen this thread and shared it with us yet. :(

Do you want me to post what my header looks like?

http://www.aboveclothing.com


User avatar
New member

Posts

Joined
Mon May 11, 2009 8:22 am


Post by baha » Tue Mar 29, 2011 3:28 pm

If you don't have SEO friendly url's, you can also use this code:

Code: Select all

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo 'http://'.str_replace('&', '&',$_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"]); ?>" layout="button_count" show_faces="false" width="230" font=""></fb:like>
It doesn't use an iFrame, but the XFBML script.
You can customize your button here: http://developers.facebook.com/docs/ref ... gins/like/
(it also generates an iframe script)

I tested above code on OC 1.4.9.3
My store: http://www.qdeals.be

Newbie

Posts

Joined
Tue Mar 29, 2011 3:23 pm

Post by vang » Wed Mar 30, 2011 2:47 am

baha wrote:If you don't have SEO friendly url's, you can also use this code:

Code: Select all

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo 'http://'.str_replace('&', '&',$_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"]); ?>" layout="button_count" show_faces="false" width="230" font=""></fb:like>
It doesn't use an iFrame, but the XFBML script.
You can customize your button here: http://developers.facebook.com/docs/ref ... gins/like/
(it also generates an iframe script)

I tested above code on OC 1.4.9.3
My store: http://www.qdeals.be
Yeah, but this code by itself won't pull the correct image.
That's where everyone is having the problem.
You need to set-up your header with the correct Opengraph Protocol for Facebook to grab the right image.
Am I right on this? ???
This is the problem I was having.
Is this the problem everyone is having?

http://www.aboveclothing.com


User avatar
New member

Posts

Joined
Mon May 11, 2009 8:22 am


Post by KuriN » Thu Mar 31, 2011 6:44 pm

Yea, same here.

I tried various codes for the heading in search of the correct opengraph, but no success. Still there is problem with the images.

I am not a pro, but I'm pretty sure that one of the guys here can help us out.
You need to set-up your header with the correct Opengraph Protocol for Facebook to grab the right image.
That is the main problem!

New member

Posts

Joined
Mon Jan 31, 2011 6:15 pm

Post by joost.bijl » Sat Apr 02, 2011 3:36 am

The reason for the 'product not found' errors lies in the fact that the URL's fed to facebook are not encoded. Hence, if you have a & or ? in your product urls it doesn't work. This happens when you don't enter a seo url in a product.

To fix this add urlencode() to the facebook url:

Code: Select all

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode($this->model_tool_seo_url->rewrite(HTTP_SERVER . 'index.php?route=product/product&product_id='.$this->request->get['product_id'])); ?>&layout=standard&show_faces=false&width=280&action=like&colorscheme=light&height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:270px; height:35px;" allowTransparency="true"></iframe></td></tr>

Newbie

Posts

Joined
Sun Mar 13, 2011 11:48 pm

Post by hamza » Mon Apr 11, 2011 11:00 pm

hello
did you get any luck with the the integration of facebook connect to opencart
i'm trying to make it work but no results so far
i would really appreciate some help
thanks

Newbie

Posts

Joined
Mon Apr 11, 2011 10:50 pm

Post by KuriN » Wed Apr 13, 2011 4:24 pm

Nope, no luck yet. I tried everything i could, but still wrong image. I would appreciate help too... :)

New member

Posts

Joined
Mon Jan 31, 2011 6:15 pm

Post by madnlooney » Wed Apr 13, 2011 11:55 pm

is there any solution for the correct image?
vang wrote:Sorry Sketchi. You know how it is working on a site. You end up jumping around and getting focused on other things. Well, that's how it is with me any way. :(

I don't have the [MOD] you guys are using so I really can't tell you what and what is not included, but I was having the IMAGE problem as many of you are. It seems as if whoever made the [MOD] didn't include instructions on how to properly set-up your header file with the Opengraph Protocol that Facebook uses to gather the data from your page.
By using the Opengraph protocol set-up that we discussed earlier everything works great on my end.

This is how I set-up my meta tag for the image (in the header.tpl of course).
Thank you dogacankanat for the code! ;)

Code: Select all

<?php foreach ($links as $link) { ?>
<meta property="og:image" content="http://www.YOUR_DOMAIN.com/catalog/view/theme/YOUR_TEMPLATE/image/fb/<?php echo str_replace('http://www.YOUR_DOMAIN.com/', '', $link['href']); ?>.jpg"/>
<?php } ?>
Is only this code needed , is it added or is some deleted and this replace it? also is it changed in http://www.YOUR_DOMAIN.com/catalog/view/theme/YOUR_TEMPLATE/template/common/header.tpl

i have the like button working and shows the right item but like others it doesnt show the main picture of the item.
Sorry for all the questions

Newbie

Posts

Joined
Wed Apr 13, 2011 11:40 pm

Post by webpie it. » Sat Apr 16, 2011 12:02 am

Hi Guys
I have a similar problem with someones above.

I have the like button in my shop, but the wrong product image is being passed to Facebook, everything else is fine, just the dam product image.

Can someone help?

thnaks

Chris

Regards

Chris


Active Member

Posts

Joined
Mon Jan 31, 2011 7:28 pm
Who is online

Users browsing this forum: No registered users and 1 guest