Виджет "Присоединяйся в соц.сетях"

Всем привет. Давно я вас не радовала, новыми постами. Исправляюсь. Решила поделиться с вами одним виджетом который вы могли увидеть на моем блоге.
Если я правильно поняла Diana T, то он ей понравился, и я решила им поделиться возможна такой блок еще кому то захочется.
Чем он удобен? Тем что  читатель, который захочет присоединиться к вам  в одной из соц сетей, окажется на вашей старичке, где сможет добавить вас в друзья. А если  после каждого написанного нового поста вы твитнете или фейссбукните лайкнете, то он увидит ваш твит или лайк у себя на страничке и  заглянет прочитать ваш новый пост.
 Что  содержит этот блог: Адрес вашей страничке на Facebook, адрес Twitter, адрес вашего RSS, и подписку RSS.
 Вот сам виджет, он большой:)

<!--BloggingeHow Subscription Widget-->
 <style>
body {
    color: #434343;
    font: 12px/20px Arial,Helvetica,sans-serif;
}
#sidebar .widget {
    background-color: #F5F5F5;
    margin: 15px 0;
    padding: 4px;
    position: relative;
}

#sidebar .widget .head {
    text-shadow: 0 1px 0 #FFFFFF;
}
#sidebar .widget .box {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3_96snKcz43fy5mUTm8yscUC7Vp_i1tImUIayN2DS2EatlxWZuTFowPZpVGaZ4VwfcEyPShMUQtiPlX8Qqn1H6AF4r8w8hXvOoPQZPqGOynI6wvUhr09K-PLJfLrLRDbwpTbIF8Dx6DI/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
    padding: 8px;
}
#sidebar .widget .box-out {
    background-color: #FFFFFF;
    border-bottom: 1px solid #E5E5E5;
    padding: 1px;
}
.clearfix:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
}
#sidebar .widget .box {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3_96snKcz43fy5mUTm8yscUC7Vp_i1tImUIayN2DS2EatlxWZuTFowPZpVGaZ4VwfcEyPShMUQtiPlX8Qqn1H6AF4r8w8hXvOoPQZPqGOynI6wvUhr09K-PLJfLrLRDbwpTbIF8Dx6DI/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
    padding: 8px;
}
.clearfix {
    display: block;
}
.clearfix {
    display: inline-block;
}
.clearfix:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
}
.email_rss {
    border-bottom: 1px solid #E5E5E5;
    margin-bottom: 5px;
    position: relative;
}
.social_links, .email_rss {
    padding: 5px 0 10px;
    width: 100%;
}
.clearfix {
    display: block;
}
.fan_box {
    background-color: #F5F5F5;
    margin: 15px 0;
    padding: 4px;
    position: relative;
}
.fan_box .full_widget {
    background-color: #FFFFFF;
    border: 1px solid #E5E5E5;
}
.fan_box .full_widget .connect_top {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3_96snKcz43fy5mUTm8yscUC7Vp_i1tImUIayN2DS2EatlxWZuTFowPZpVGaZ4VwfcEyPShMUQtiPlX8Qqn1H6AF4r8w8hXvOoPQZPqGOynI6wvUhr09K-PLJfLrLRDbwpTbIF8Dx6DI/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
    padding: 8px;
}
.fan_box .full_widget .connections {
    background-color: #FFFFFF;
    border-bottom: 1px solid #E5E5E5;
    padding: 5px 1px 1px;
}
.fan_box .full_widget .connections_grid {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3_96snKcz43fy5mUTm8yscUC7Vp_i1tImUIayN2DS2EatlxWZuTFowPZpVGaZ4VwfcEyPShMUQtiPlX8Qqn1H6AF4r8w8hXvOoPQZPqGOynI6wvUhr09K-PLJfLrLRDbwpTbIF8Dx6DI/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
    padding: 6px;
}
.fan_box .full_widget .connections .total {
    margin: 4px 0 4px 8px;
}
.fan_box .profileimage {
    background-color: #FFFFFF;
    border: 1px solid #E5E5E5;
    display: inline;
    margin-right: 10px;
    padding: 5px;
}
.fan_box .full_widget .connections_grid a img {
    border: 1px solid #FFFFFF;
}
.fan_box .full_widget .connections_grid a img:hover {
    border: 1px solid #000000;
}
.social_links, .email_rss {
    padding: 5px 0 10px;
    width: 100%;
}
.social_links a {
    background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPcOxnS0NGodJuJjXsl8ojApxFDSWN5-8rdwAKo4lDX2fS0AKROpXDBslPFXcXWDpqdRgtfF16vAdBHeegsAtkWScaDtMymHjTfra4lPJcXE2nkTAI8c99yvDhSqrcAO-U5hY8VNPnSI/s1600/social.png");
    background-repeat: no-repeat;
    color: #999999;
    display: inline;
    float: left;
    font-size: 11px;
    margin-bottom: 0;
    padding-top: 45px;
    text-align: center;
    text-decoration: none;
    width: 67px;
}
.social_links a:hover {
    color: #000000;
    text-decoration: underline;
}
a#side_fb {
    background-position: -173px 0;
}
a#side_tw {
    background-position: -81px 0;
}
a#side_rss {
    background-position: 8px 0;
}
a#side_email {
    background-position: -267px 0;
}
#geek {
    background: url("4.bp.blogspot.com/-JJL5i3WAtEA/UDip4G3DxhI/AAAAAAAAF7A/fa1vmnxMt38/s1600/social.png") no-repeat scroll -387px -363px transparent;
    bottom: -1px;
    display: block;
    height: 117px;
    position: absolute;
    right: -22px;
    text-indent: -9999em;
    width: 94px;
}
.email_rss {
    border-bottom: 1px solid #E5E5E5;
    margin-bottom: 5px;
    position: relative;
}
.email_rss span {
    font-size: 11px;
}
#subscribe-form {
    margin-top: 5px;
}
#subscribe-form #newsletter {
    border: 1px solid #CCCCCC;
    padding: 5px;
    width: 150px;
}
#subscribe-form #newsletter:focus {
    background-color: #F5F2D3;
    border: 1px solid #000000;
}
#subscribe-form .btn {
    background-color: #7EB4CF;
    border: 1px solid #2F6A89;
    box-shadow: 3px 3px 0 #6DA5C1 inset, -3px -3px 0 #6DA5C1 inset;
    color: #FFFFFF;
    cursor: pointer;
    display: inline;
    float: right;
    font-size: 12px;
    font-weight: 900;
    line-height: 12px;
    padding: 5px 8px;
    position: relative;
    text-shadow: 0 1px 0 #000000;
    z-index: 999;
}
#subscribe-form .btn:hover {
    background-color: #4E9CC4;
}
#subscribe-form span {
    background-color: #4E9CC4;
    display: inline;
    float: left;
    margin-right: 10px;
    padding: 3px;
}
h3 {
font-family: MgOpenModata;

    font-weight: ;
}
#sidebar .widget .head p {
    color: #99999;
    font-size: 11px;
    line-height: 15px;
    padding: 0;
}
</style>
<div id="counter" class="widget">
<div class="inner clearfix">
<div class="box-out">
<div class="head box">
<h3>Будь в кусе</h3>
<p> Присоединяйся к блогу.</p>
<div class="social_links clearfix">
<a id="side_fb" class="png_bg dysocial" rel="nofollow" title="Join studying-blogin.blogspot on Facebook" href="http://www.facebook.com/anna.krivetka" >Facebook</a>
<a id="side_tw" class="png_bg dysocial" rel="nofollow" title="Join studying-blogin.blogspot on Twitter" href="https://twitter.com/shefer851" >Twitter</a>
<a id="side_rss" class="png_bg dysocial" rel="nofollow" title="Subscribe to studying-blogin.blogspot via RSS" href="http://feeds.feedburner.com/blogspot/lYYAT" >RSS</a>
<a id="side_email" class="png_bg dysocial" rel="nofollow" title="Subscribe to studying-blogin.blogspotvia Email RSS" href="http://feeds.feedburner.com/blogspot/lYYAT">Email</a>
</div></div></div></div></div>

То, что выделено красным замените на адрес своих страничек и RSS.
На этом все! До новых встреч.
P.S виджет позаимствован из зарубежного блога http://www.bloggingehow.com