Skip to content

Instantly share code, notes, and snippets.

@promatik

promatik/facebook-share.html

Created April 15, 2013 02:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save promatik/5385323 to your computer and use it in GitHub Desktop.
Save promatik/5385323 to your computer and use it in GitHub Desktop.
Download ZIP
Simple Facebook Share Button, very easy to replicate. Example here: http://promatik.no.sapo.pt/data/facebook-share.html
Raw
facebook-share.html
<!DOCTYPE html>
<html>
<head>
<title>Simple Facebook Share Button</title>
<style>
.fb-share-div {
float: left;
height: 18px!important;
border-radius: 3px;
border: 1px solid #CAD4E7;
background-color: #ECEEF5;
cursor: pointer;
color: #3B5998;
font-family: "Trebuchet MS";
line-height: 18px;
font-size: 11px;
}
.fb-share-div:hover {
border: 1px solid #9DACCE;
}
.fb-share-div > div {
width: 15px;
height: 15px;
margin: 2px;
background-image: url("https://s-static.ak.fbcdn.net/rsrc.php/v2/yI/x/1dQf_ATK831.png");
float: left;
}
.fb-share-div > span {
margin: 0 6px 0 2px;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.each($(".fb-share"), function () {
$(this).html('<div class="fb-share-div"><div></div><span>'+$(this).attr("action")+'</span></div>')
.on("click", function(){window.open($(this).attr("shareURL"), "_blank", "width=670, height=340");});
});
});
</script>
</head>
<body>
<div class="fb-share" shareURL="https://www.facebook.com/sharer/sharer.php?u=http://promatik.no.sapo.pt/data/facebook-share.html&amp;t=Facebook Share Button" action="Share"></div>
<br /><br />
<div class="fb-share" shareURL="https://www.facebook.com/sharer/sharer.php?u=http://promatik.no.sapo.pt/data/facebook-share.html&amp;t=Facebook Share Button" action="Partilhar"></div>
</body>
</html>
@promatik
Copy link
Author

After adding the Styles and Scripts to your project, add the share buttons wherever you want with the following code:

<div class="fb-share" shareURL="https://www.facebook.com/sharer/sharer.php?u=http://example.com" action="Share"></div>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment