Sunday 25 November 2012

Create Your Own Social Media Buttons

Here are the scripts to create Social Media Buttons. These include Facebook like button, Tweet button & Google's 1+ button.


Google +

<html>
<head>
        <title>+1 demo: Basic page</title>
        <link rel=”canonical” href=”http://www.example.com” />
       <script type=”text/javascript” src=”https://apis.google.com/js/plusone.js”></script>
</head>
<body>
 <g:plusone></g:plusone> or <g:plusone size='medium' count='true' href='YOUR LINK TO +1' ></g:plusone>
</body>
</html>


Facebook

1, <fb:like send="false" href="http://glen-online.webege.com" layout="standard" width="80" show_faces="false" action="like" colorscheme="light"></fb:like>

<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

2, IFrame version

   <iframe src="http://www.facebook.com/antony.g.pinheiro" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:px">

Twitter

1, Tweet icon

<div style="position: relative; width: 835px; margin: 0px auto;"><div style="position: absolute; width: 15px; margin: 0 auto; margin-left: 545px; top: 35px; z-index: 999;">
   <a href="http://twitter.com/#!/Mima_Design"><img src="http://twitter-badges.s3.amazonaws.com/t_mini-c.png" alt="Follow Mima_Design on Twitter"></a>
</div></div>


No comments:

Post a Comment