show shared image as thumbnail in facebook sharing in Laravel - facebook

I am trying to add share button to albums in website created in Laravel. I have used the code for share button that generated using facebook/developer. The albums are not fixed. It is displaying by fetching from database. So I changed code little to change the link of each album automatically as given below.
<div class="fb-share-button" data-href="http://mysite/albumphotos/{{$album->name}}" data-layout="button">
</div>
But if I try to share into my facebook account, it is showing some other images in my website. How can I show images in my particular album as thumbnail while sharing??
Can anyone help?

As mentioned by #CBroe, first things first:
Make sure you have the proper OG Meta Tags
Run one of the albums' link in the debugger and check if the crawler is pulling the right info
If the date from step 2 doesn't match what you are looking for, update your OG meta tags and try again.

Related

Website Facebook share show in carousel post format

Background
Lately, Facebook added a "carousel" ad format, showing multiple slides in a sponsored post. This is now available for non-business users too.
Facebook example of a carousel ad format
Meta annotation
I am looking for a way to "annotate" my website in a way that it will be showing a carousel in a Facebook post when the url is used in a post. Currently I am using Open Graph (og) meta tags for annotation.
HTML share link
Besides that, I'm looking for a way to add multiple "carousel slides" to a Facebook share link. Currently I am using the following html for Facebook share links:
<a
href="http://www.facebook.com/dialog/feed
?app_id=123
&link=http%3A%2F%2Fmy.url.com
&picture=http%3A%2F%2Fmy.url.com/img.jpg
&name=MyTitle
&caption=MyCaption
&description=MyDescription
&redirect_uri=http%3A%2F%2Fmy.url.com"
target="_blank"
>
Share on Facebook
</a>
Both ways result in the default post format. Can anyone help me with Facebook sharing in carousel format?
This is currently a feature that is being tested and it's not possible to apply for it.
Now this feature is live & when posting on a page select Image format and select carousal, you can add about 6 images to carousal & publish.

Facebook comment box display only website logo when user comment

I am using Facebook comment box in my website for commenting purpose on pictures, its working fine, i am also using a share button which is working fine too, but the problem is when its shared or users do commenting on the picture it is shared to their walls but a default website logo is shown there, i want to share the current picture on which user made comments or shared it ... I am posting it here because i couldnt find it on google or i was unable to make a query for google.. Thanks in advance
Test your link at https://developers.facebook.com/tools/debug to see what thumbnails are pulled in by facebook when shared.
To configure which thumbnail to show when an URL from your site is shared you have to add this property to your html source in the header.
<meta property='og:image' content='url to First Image in your Page etc'/>
More details about meta tags for FB at this link.

Dynamic facebook meta tags for fancybox in wordpress

I have a site developed in wordpress. There is a product category and there are posts assigned to it, now when a product is clicked, a fancybox opens up. I am trying to have facebook like for the products inside the fancybox using addthis. Now the problem is, when a product is liked a random image is shown instead of the product image. After much research found that I need to set up the facebook meta on the fly, but I am unable to figure out a way to achieve this task. As the page is not reloaded how can I set up the meta tags having the respective images for the products?
The site url is http://havmor.com/products/
Regards,
Joel James

How to limit thumbnail images on Fb share?

I am working on a wp blog site. Currently not using og tags at all.
I use the social sharing toolkit plugin to allow visitors to share articles on Facebook.
The problem:
When FB share box pops up, all of the images on the page are shown as thumbnail options to be published along with the article information. In some cases over 20 sometimes.
How can i specify only 1 image to be shown in the available thumbnail options?
I'd like to do this so that visitors don't, for example, select a meaningless image (such as page ad images or layout components)?
I tried using rel="image_src" as suggested but it made no difference.
Thanks.
This is working for me: I found out that even with OG meta tags Facebook Share plugin may present various thumbnails from my page, including all sorts of unwanted images. To work around it I add the wanted image with small size, first thing after the tag:
<img src="image_wanted_as_thumbnail.whatever" style="width:1px;height:1px;">
But I always use the OG meta tags as well.

Limiting the number of thumbnails on facebook share

So I want users to be able to share this link on facebook but I want only a specific picture to be the thumbnail for this sharing picture and no other images that appear on my web site
I read the documentation about facebook share and I got this
http://developers.facebook.com/docs/share
Basically what I understand is that
<link rel="image_src" href="thumbnail_image" / >
should do what I want. However, I cannot get this to work. My site is programmed using rails and, inside the layout, I have the above tag to take in an image url coming from a model instance.
Does anyone know how to use this properly? Am I misunderstanding something about this tag? I want to disable user from selecting through the images that I have on my page and just allow the user to share with only 1 image which I have to specify.
To specify a specific picture you will need to add open graph meta tags to your page. Take a look at http://developers.facebook.com/docs/opengraph/.
The open graph tag for your case is: og:image