how to customize facebook share button with <div> element of page - facebook

I am having facebook share button. I am trying to display specific content of my page( element) to share on facebook.
<a title="Share this article/post/whatever on Facebook"
href="http://www.facebook.com/sharer.php?
u=the url you want to share
&t=title of the article/post/whatever"
target="_blank">
<img src="your/path/to/facebook-icon.png"
alt="Share on Facebook" />
I want to share content of my tag from web page to facebook wall.

Related

Post image to Facebook page with description

I am trying to find a way to post an image along with a description to a Facebook page. The idea is for users to submit a photo and a description to a website. Once the image is uploaded the user can then share the uploaded image with the description they've added on to a Facebook page.
I'm not sure if this is possible to do. I guess it's something Facebook's Graph API might help or maybe something like from this question (Facebook share button and custom text) would be enough:
<a title="send to Facebook"
href="http://www.facebook.com/sharer.php?s=100&p[title]=YOUR_TITLE&p[summary]=YOUR_SUMMARY&p[url]=YOUR_URL&p[images][0]=YOUR_IMAGE_TO_SHARE_OBJECT"
target="_blank">
<span>
<img width="14" height="14" src="'icons/fb.gif" alt="Facebook" /> Facebook
</span>
</a>

Creating a Facebook share button with customized url, title and image

Facebook used to allow custom parameters in the Facebook share button, but it is not working now. What I need is to create a Facebook share button which will have a custom title, url, image, description, etc. It cannot be done using meta tags because there are multiple share buttons on a single page. Each should have a different title, urls, images etc. I heard it can be done using the Facebook app - using app id or something.
I tried this but it's not working:
<a title="send to Facebook"
href="http://www.facebook.com/sharer.php?s=100&p[title]=YOUR_TITLE&p[summary]=YOUR_SUMMARY&p[url]=YOUR_URL&p[images][0]=YOUR_IMAGE_TO_SHARE_OBJECT"
target="_blank">
Unfortunately, it appears that we can't post shares for individual topics or articles within a page. It appears Facebook just wants us to share entire pages (based on url only).
There's also their new share dialog, but even though they claim it can do all of what the old sharer.php could do, that doesn't appear to be true.
And here's Facebooks 'best practices' for sharing.
This is the code as 2017:
<i class="fa fa-facebook-square"></i>
Share on Facebook
Facebook now takes all data from OG metatags.
NOTE: This code assumes you have OG metatags on in site's code.
Source
Use facebook feed dialog instead of share dialog.
Example:
https://www.facebook.com/dialog/feed?app_id=1389892087910588
&redirect_uri=https://scotch.io
&link=https://scotch.io
&picture=http://placekitten.com/500/500
&caption=This%20is%20the%20caption
&description=This%20is%20the%20description
Crude, but it works on our system:
<div class="block-share spread-share p-t-md">
<a href="http://www.facebook.com/share.php?u=http://www.voteleavetakecontrol.org/our_affiliates&title=Farmers+for+Britain+have+made+the+sensible+decision+to+Vote+Leave.+Be+part+of+a+better+future+for+us+all.+Please+share!"
target="_blank">
<button class="btn btn-social btn-facebook">
<span class="icon icon-facebook">
</span>
Share on Facebook
</button>
</a>
<a href="https://www.facebook.com/FarmersForBritain" target="_blank">
<button class="btn btn-social btn-facebook">
<span class="icon icon-facebook">
</span>
Like on Facebook
</button>
</a>
</div>

facebook sharer - wrong link / share home not page where share button is

I want to use a Facebook share button on a page in my website, but when I use the code on the Facebook documentation, the link shared is the link of the home of my website, not the link of the page where the share button is.
How can I change that?
<a href="#"
onclick="
window.open(
'https://www.facebook.com/sharer/sharer.php?u='+encodeURIComponent(location.href),
'facebook-share-dialog',
'width=626,height=436');
return false;">
Share on Facebook
</a>

Facebook share button is scraping a different page's info

I have this code for a Facebook custom share button:
<script>
function fbs_click() {
u=location.href;
t=document.title;
window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');
return false;
}
</script>
<a rel="nofollow" href="http://www.facebook.com/share.php?u=<;url>" onclick="return fbs_click()" target="_blank" class="fb_share_link">
<img src="../../../../../image/photography/pics/fb-share.png" alt="Share this!" width="57" height="21" border="0">
</a>
This is supposed to scrape info from the page but for some reason it doesn't and it gets redirected to the site's main index.html.
I've tried adding facebook og tags and the extra code in the but to no avail.
Any thoughts?
EDIT: Having been told that the share function has been deprecated, I tried to do this with the feed dialog:
<a href="https://www.facebook.com/dialog/feed?link=http://www.travel2italy.com/Travel/Italy/Company/photography/index.html&picture=http://www.travel2italy.com/image/photography/pics/homepage/florence1-home.jpg&name=travel2italy.com&caption=Photo%20Gallery&description=A%20Beautiful%20photo%20of%20Florence&redirect_uri=http://www.travelive.com" target="_blank">
<img src="../../../../../image/photography/pics/fb-share.png" alt="Tweet this!" width="57" height="21" border="0">
</a>
but when i click on the link it takes me to facebook and says an error occured, wth?!:(
EDIT 2:
I wasn't aware that the app_id argument is needed, signed up for an app and it works now, but it strips away the #section I have at the end of the link (i want it to link to a specific slide in a slideshow)
EDIT 3:
Now some of the share buttons using the sharer do seem to work but don't pull all the photos off the page for me to choose the one i want, this is insane-o, could it just be a caching issue?

Social media share buttons don't redirect back to fan page iframe product page

A friend of mine added a store to my fan page that uses the iframe...basically putting a website inside a facebook frame. It has a SSL certificate. We added social media like buttons to each product page by using addthis.com code. See below. The code below works on the product page, however the problem is when you share it to facebook or google+, the link that is provided for that product, when clicked, takes the user to the hosting url where the zencart resides.
<link rel="image_src" href="<?php echo "http://" . $_SERVER['HTTP_HOST'] . "zencart1/images/" . $products_image; ?>" />
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_google_plusone" glusone:size="medium"></a>
<a class="addthis_button_pinterest_pinit"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true}; </script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-501a85992fdcfe86"></script>
<!-- AddThis Button END -->
Fan Page: https://www.facebook.com/TracyLoganDesigns
Go to the category Scarves - this is where I have a test product.
When you click on the product test link once it's been shared on facebook, etc, this is the link it goes to: http://firetreegraphics.com/zencart1...9#.UBrFH01lTjY
How can I set it up so that it will go back to the fan page url?
How can I set it up so that it will go back to the fan page url?
By not liking/sharing the product page hosted on your server, but the Facebook URL of your /page/app combination.
If you want to link to a specific product page inside of your app on Facebook (and not just the start page), then you have to use the app_data parameter inside of that link, and get it’s from the signed_request parameter once your app is loaded into the iframe on Facebook.