I have a list of facts
I want people to be able to share each individual fact with a custom pic.
Is this possible?
Looked at sharer but it does not seem to work any more it jsut seems to use the url and not the other parameters.
<a target="_blank" href="http://www.facebook.com/sharer/sharer.php?s=100&
p[url]=http://google.com&
p[images][0]=http://myimage.png&
p[title]=This is the title&
p[summary]=This is the summary">
<img src="img/button-facebook-like.png" alt="Facebook like" />
</a>
It is only possible to share a specific URL nowadays, Facebook takes the Open Graph tags of that URL for the title, description and image.
Open Graph tags: http://ogp.me/
Related
I know the title is not worded properly but I do not know how best to summarize my issue.
I have a ShareThis button installed on my site and an older Facebook Share Button.
When I share any page on my site, both the ShareThis and the Facebook share pop-ups show a thumbnail version of the site's Home Page.
I want the thumbnail to show the current page being shared.
How do you make that happen? Is it even possible to do?
Social sharing sites like Facebook and LinkedIn tend to respect schema.org schemas. So I tend to slap SoftwareApplication on my body then use a hidden div, putting what I want shared in there. You could manually (or programmatically) take a snapshot of the page and include it in the schema div to have it display as the image.
Here's what it looks like from one of my sites:
<body itemscope itemtype="http://schema.org/SoftwareApplication">
<!-- SoftwareApplication information -->
<div style="display: none;">
<h1 itemprop="name">Dache - Distributed Caching For .NET Apps</h1>
<img itemprop="image" src="/images/logo.png" />
<p itemprop="description">Fast, scalable .NET distributed caching with meaningful performance metrics for your managers and a simple API for your development team.</p>
</div>
...
Facebook in particular uses their OpenGraph technology. Here's an article on configuring what appears when your site is shared on Facebook.
I can't see any solutions out there that allow this specific request without a lot of scripting or meta tags so I'm hoping there's a simple way to do this.
I'm looking for a custom share links for all four social networks. Let me give a concrete example.
If someone clicks on a twitter icon link on my site, they're clicking the following:
<a href="https://twitter.com/home?status="Welcome to my site and tell all your friends! #sitename #mysiterules http://bit.ly/site">
<img src="twitter.png">
</a>
it will go to Twitter's site and produce the following:
This allows someone to very quickly promote my site with a custom message that they can change if they like but there's no effort involved outside of clicking the icon link.
This is exactly what I want to do with the other three social networks, with a custom message and links. They can also pull the default logo of my site which twitter can't do.
How can I accomplish this?
I recommend you use the proper social sharing buttons like we implemented in on our live campaign page, but here is some code I stole from a mockup of the campaign page.
<div class="leader-half kids0514-share">Share this on:
<img src="images/en/share_mail.jpg" alt="email">
<img src="images/en/share_fb.jpg" alt="facebook">
<img src="images/en/share_tweet.jpg" alt="twitter">
<img src="images/en/share_pin.png" alt="pinterest">
<img src="images/en/share_plusone.jpg" alt="google plus">
</div>
Not all social sharing buttons are created equal, some have more functionality and even old versions you can still use. Pinterest is pretty minimal. I recommend using the official buttons and full structured meta data, not doing it the way this snippet from the mockup does.
On Facebook you are not allowed to share a prefilled message according to Platform Policy 2.3: "Ensure that all content in the user message parameter is entered by the user. Don’t pre-fill. This includes posts, messages, comments, and captions."
If you want people to share on Facebook I would suggest using the Share button: https://developers.facebook.com/docs/plugins/share-button/
I want to pass in parameters to the facebook share dialog. Currently, the codes below allows me to fix my title, description and website url. however, it does not work for my image. The image doesn't appear at all.
<a href="#" onclick="window.open(
'http://www.facebook.com/sharer.php?s=100&p[title]=a title&p[summary]=a description &p[url]=http://www.linkhere.com&p[images][0]=http://www.linkhere.com/image.jpg',
'facebook-share-dialog',
'width=626,height=436');
return false;">
Share </a>
Please help!!
There's a quite a few products and services on this site I manage. They all have a Facebook share dialog. However, when clicking on the share button (for all of them), an empty Facebook dialog box appears:
My code is exactly what is given on the facebook site:
<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>
Any ideas on what could be causing this?
Thanks to +phwd over in the #facebook freenode chatroom for the answer:
My link was wrong. I should have included this in my original post. Here's what I had before:
https://www.facebook.com/sharer/sharer.php?title&url=http%3A%2F%2Fwww.some_site.com%2Fsome_page
I needed to do 2 things to fix this:
Remove title
change url to u
So it comes out like this:
https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fwww.some_site.com%2Fsome_page
I'm using custom AddThis buttons to share things in Twitter and Facebook... for Twitter share I use:
addthis:templates="{ twitter: ' {{title}} # {{url}} via #agenciauzzye' }"
I know that for the Facebook custom description, title, url, image and other things I must have to use meta tags. The problem is that I have a blog with one static page and all the content (posts) are loaded inside one div with AJAX. The main page is a posts list where I have the buttons to share each post...
How do you guys share content in Facebook with AddThis without set up the meta tags???
The only solution I found is to use direct Facebook share URL, without pass by AddThis code (and so, without log for analysis). Something like:
<a onClick="window.open('http://www.facebook.com/sharer.php?s=100&p[summary]=<?php echo rawurlencode(striptags(abrev_texto(get_output($descricao),1000,"p"," ...",true)));?>&p[title]=<?php echo rawurlencode(get_output($post->titulo));?>&p[url]=<?php echo rawurlencode(ROOT_SERVER . ROOT . "blog/" . $urlAux); ?>&&p[images][0]=<?php echo rawurlencode($imageShare);?>','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)"></a>
You can see more details in http://blog.uzzye.com
Luckily the Facebook developers were smart enough to realize they cannot predict every type of web page on the internet. Instead, they offer a few simple meta tags that control how this information is passed to Facebook:
title: <meta name=”title” content=”The title of the link being shared” />
short description: <meta name=”description” content=”A description of the page” />
optional thumbnail image: <link rel=”image_src” href=”http://example.com/images/image.jpg” />
That’s all you need to tell Facebook what to populate in the link details when someone shares your page with others on Facebook.