• Posted by : Unknown 28 Mayıs 2013 Salı

    sosyal paylaş eklentisi 



    bugun sizlere yandan açılan sosyal paylaş eklentisi paylaşcamcam. bir    başka yazımda daha degişik bir sosyal paylaş eklentisi paylaşmışdım isterseniz burdan bakabilirsiniz.
    sosyal paylaş eyer uygulamayı beğendiyseniz uygulamamıza başlayalım.

    1 Adım blogger sitemize giriş yapıyoruz. konturol panelinde şablon kısmına tıklıyoruz  html düzenle diyip.
    Ctrl F yardımı ile  </head> kodunu aratıyoruz. buldugumuz   2 Adım açık olan kod penceresine ]]></b:skin>  kodunu aratıyoruz.  buldugumuz ]]></b:skin> kodu öncesine sizlere aşagıda verdigim kodu ekliyoruz.



    <script type='text/javascript'>
    window.onload = function socialButtons() {
    $(&#39;.social_site&#39;).hover(function() {
    $(this).stop().animate({
    left: &#39;0px&#39;
    },
    &#39;fast&#39;)
    },
    function() {
    $(this).stop().animate({
    left: &#39;-140px&#39;
    },
    &#39;fast&#39;)
    })
    }
    </script>
    <script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
    <script src='https://apis.google.com/js/plusone.js' type='text/javascript'>
    {lang: &#39;tr-TR&#39;}
    </script>
    <script src='http://connect.facebook.net/tr_TR/all.js#xfbml=1' type='text/javascript'/>
    <script src='http://code.jquery.com/jquery-1.6.2.min.js' type='text/javascript'/>






    3 Adım son ollarak </body> kodunu aratıyoruz.  buldugumuz </body>  kodu öncesi sizlere aşagıda verdigim kodları ekliyoruz.

     body .social_site {cursor: pointer;height: 64px;left: -140px;overflow: hidden;position: fixed;width: 200px;z-index: 10000;} 
    body .social_closed {left: -170px;}
    body .social_open {left: 0;}
    body .social_site .icon {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYv1tsvwSN2n3pMjjZOj6EVnhw0YVFtLdmdVeNiuVpq_hZTa0qZewjt4EtWbfWgWb7qrYSHjCImLYxOyznGbQVKxK_WxuhGM8vRxvkaHMJhFroWApsk2pAUYS2OGs9ooZgs8cE38kx5xM/s1600/social-sprite.png") repeat scroll 0 0 transparent;float: right;height: 64px;width: 60px;}
    body .social_site .tray {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYv1tsvwSN2n3pMjjZOj6EVnhw0YVFtLdmdVeNiuVpq_hZTa0qZewjt4EtWbfWgWb7qrYSHjCImLYxOyznGbQVKxK_WxuhGM8vRxvkaHMJhFroWApsk2pAUYS2OGs9ooZgs8cE38kx5xM/s1600/social-sprite.png") repeat-x scroll 0 0 transparent;float: right;height: 64px;width: 140px;}
    body .social_facebook {top: 205px;}
    body .social_facebook .icon {background-position: 60px -74px;}
    body .social_facebook .tray {background-position: -15px -74px;}
    body .social_facebook .tray p {
    display: block;height: 18px;line-height: 18px;margin-top: 4px;padding-left: 20px;}
    body .social_facebook .tray p a, body .social_facebook .tray p a:active, body .social_facebook .tray p a:visited {
    color: #FFF;text-shadow: 1px 1px 0px #077EAB; -webkit-text-shadow: 1px 1px 0px #1F366B; -moz-text-shadow: 1px 1px 0px #1F366B;display: block;font-size: 10px;width: 100%;text-decoration:none;}
    body .social_users {top: 340px;}
    body .social_users .icon {background-position: 60px -6px;}
    body .social_users .tray {background-position: -15px -6px;}
    body .social_users .tray p {display: block;height: 18px;line-height: 18px;margin-top: 4px;padding-left: 20px;}
    body .social_users .tray p a, body .social_users .tray p a:active, body .social_users .tray p a:visited {
    color: #FFF;text-shadow: 1px 1px 0px #313131; -webkit-text-shadow: 1px 1px 0px #2c2c2c; -moz-text-shadow: 1px 1px 0px #2c2c2c;display: block;font-size: 10px;margin-top: 0l;width: 100%;text-decoration:none;}
    body .social_gplus {top: 273px;}
    body .social_gplus .icon {background-position: 60px 71px;}
    body .social_gplus .tray {background-position: -15px -141px;}
    body .social_gplus .tray p {display: block;height: 18px;line-height: 18px;margin-top: 4px;padding-left: 20px;}
    body .social_gplus .tray p a, body .social_gplus .tray p a:active, body .social_gplus .tray p a:visited {color: #FFF;text-shadow: 1px 1px 0px #313131; -webkit-text-shadow: 1px 1px 0px #2c2c2c; -moz-text-shadow: 1px 1px 0px #2c2c2c;display: block;font-size: 10px;margin-top: 0l;width: 100%;text-decoration:none;}



    <div class='social_site social_users' id='social_link_users'><a><div class='icon'/></a> 
    <div class='tray bg_denovo'><p><a>Twitter&#39;da Takip Et</a></p>
    <p id='users_online_box'><iframe allowtransparency='true' class='twitter-follow-button' frameborder='0' scrolling='no' src='http://platform.twitter.com/widgets/follow_button.html#_=1320542107073&amp;align=&amp;button=blue&amp;id=twitter_tweet_button_0&amp;lang=tr&amp;link_color=&amp;screen_name=@BloggerYazari&amp;show_count=false&amp;show_screen_name=&amp;text_color=' style='width: 100px; height: 20px;margin-top: -15px;margin-left: 15px;' title=''/></p></div></div><div class='social_site social_facebook' id='social_link_facebook'><a><div class='icon'/></a>
    <div class='tray bg_denovo'>
    <p><a>Facebook&#39;ta Beğen</a></p>
    <div class='fb-like' data-href='http://www.facebook.com/Blogger.yazari' data-layout='button_count' data-send='false' data-show-faces='false' data-width='450' style='margin-left: 30px; margin-top: -20px;'/></div></div>
    <div class='social_site social_gplus' id='social_link_gplus'>
    <a href='#' target='_blank' title='Google+'><div class='icon'/> </a>
    <div class='tray bg_denovo'>
    <p><a>Google&#39;da Öner</a></p><p id='g_plus_box' style='margin-top: -10px;margin-left: 12px;'><g:plusone/></p></div></div>


    işlemimiz bitmişdir yurkarda kodlar icersinde kırmızı  ile işaretledigim yerleri kendinize göre düzenleyiniz iyi çalışmalar.
     

    Leave a Reply

    Subscribe to Posts | Subscribe to Comments

  • Copyright © 2013 - Hyperdimension Neptunia

    Blogger Ve Wordpress Tema Arşivi - Powered by Blogger - Designed by Johanes Djogan