كيفية إضافة مشاركة الاجتماعي بسيطة تحت مشاركاتك

بسم الله الرحمن الرحيم
كما تعلمون ان ازرار المشاركة الاجتماعية لبلوجر من اهم الأضافات التي تساعد على جلب الزوار , وأيضا تعطي الدون رغبة فى العمل هذا وتزيده فخرااا
ومن اهم الأضافات المشاركة الفيس بوك وتويتر وجوجل بلس والبريد الالكتروني , ويمكنك اضافتها بسهولة
وفى هذه التدوينة سأقوم بشرح اضافتها فى مدونتك الخاصة بك اسفل المواضيع . تابعوني .....

الذهاب الى بلوجر
فتح القالب
نبحث عن ]]></b:skin>
نضع الكود التالي بعده

div#social-sharing   { 
width:550px; 
height: 90; 
background: radial-gradient(center center, circle cover, #ffffff, #f9f9f9); 
background: -o-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); 
background: -ms-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); 
background: -moz-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); 
background: -webkit-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); 
padding:10px; 
margin:0 auto; 
border: 1px solid #999; 
border-radius:5px; 
-webkit-border-radius:5px 5px 5px 5px; 
-moz-border-radius:5px 5px 5px 5px; 
-webkit-transition: all 0.6s ease-out; 
-moz-transition: all 0.6s ease-out; 
-o-transition: all 0.6s ease-out; 
-ms-transition: all 0.6s ease-out; 
transition: all 0.6s ease-out;
}
div#social-sharing:hover { 
-webkit-box-shadow: 1px 1px 3px #CCC inset; 
-moz-box-shadow: 1px 1px 3px #CCC inset; 
box-shadow: 1px 1px 3px #CCC inset; 
}
#social-sharing img { 
width: 35px; 
padding: 5px; 
border: 0; 
box-shadow: 0; 
display: inline; 
opacity:1; 
filter:alpha(opacity=1); /* For IE8 and earlier */ 
}
#social-sharing img:hover { 
-webkit-transition: all 0.6s ease-out; 
-moz-transition: all 0.6s ease-out; 
-o-transition: all 0.6s ease-out; 
-ms-transition: all 0.6s ease-out; 
transition: all 0.6s ease-out; 
opacity:0.6; 
filter:alpha(opacity=60); /* For IE8 and earlier */ 
}
.social-sharing-title { 
text-align: center; 
padding: 3px 10px 2px 0px; 
margin: 0 0px 0 0; 
color: #8d0303; 
text-transform: uppercase; 
line-height: 25px; 
vertical-align: middle; 
font-size: 14px; 
}

Note: You can change the Statement Text Color Highlighted in Red and the one highlighted in yellow which is the Background width with your own preference.

Search for this tag <data:post.body/> and add the following code below/after it.



<b:if cond='data:blog.pageType == &quot;item&quot;'><
center> 
<div id='social-sharing'> 
<div class='social-sharing-title'>Do You Like This ? Please Take Five Second To Share It!</div>
<!-- Facebook --> 
<a class='face-book' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share This On Facebook'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3811_nXL7_cLSIwnA_XKeFS9g_f5gRvmungBYmbwdd5m44xaqSuNJ0tNojUzvGgDmIBStkW80uaCIgu8fVQ7iVRk8Sign6ndW8oK6vhuoqZZpnYLQHCGZMvOOl9SRzkViB5vtulvjGN52/s1600/Facebook.gif'/></a>
<!-- Twitter --> 
<a class='twitter' expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Tweet This'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPMCSQwBKovK-X3-PCrtbzsgbo_UPiANBLn0huz7gToMJ3-5UFiBVApAxfFeX7y3c8UmOWYCN9Z6VMIDzvLdBzmPfyND3ov4U1q3DvNM8YMBiSc4LBd-TpeSz9oA_lIMs4FMFbQaB83Rhc/s1600/twitter_bird.gif'/></a>
<!-- Pinterest --> 
<a class='pint-er-est' href='javascript:void((function()%7Bvar%20e=document.createElement(&apos;script&apos;);e.setAttribute(&apos;type&apos;,&apos;text/javascript&apos;);e.setAttribute(&apos;charset&apos;,&apos;UTF-8&apos;);e.setAttribute(&apos;src&apos;,&apos;http://assets.pinterest.com/js/pinmarklet.js?r=&apos;+Math.random()*99999999);document.body.appendChild(e)%7D)());'><img alt='Pinterest' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHx3cfN98lteapDtgxZDUc19VWUYkaacINjlyJO7nk-9VNA37hbmttuVWegsCE43rp9NlA-Qh6GmXF3pFKyrCrnP372W25wvKK2mb-sJD2Yek89Yut2mWV88k_ttycanfnwnweDJDHluAi/s1600/Pinterest.gif'/></a>
<!-- Stumbleupon --> 
<a class='stumbleupon' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Stumble this'><img alt='StumbleUpon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvv0z4MGYSwBivuKcq4pvQBD8v0TqJoow3hWIRcgBA9xHlRLxySFyC4vECo1iA6h7VCUgVBBkYLNt4wfXURnMlakCHNrKeyLVULmEMXHGvewYddgIcgm6cV5wyvNuV4V4U4x7O1RFqsbGz/s1600/stumbleupn.gif'/></a>
<!-- Delicious --> 
  <a class='del-icio-us' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share This On Delicious'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirOdO9SQUC8MQzYOtmFvR_QwnchQFrj5O3rTT4q1IZpFODdJ30vR2J4nQElaTXW7O13HM44bYF9LMr5XneZLa-_UOGoye3MHVM9IXkitnBa_sNEKHA9JnfcyKIJPq8eLRkCOW7LAO4EHuM/s1600/Delicious.gif'/></a>
<!-- Reddit --> 
<a class='reddit' expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Bookmark this'><img alt='Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibQJYBIhdWc1zU32F12l4r4TOIefTjnQvhrkPFJbScI3JiwmUtXVMSKViOAxykkBA_tFc6sDrUj2UpDHceyFj1jszq4m2Z7wWsCehva42Twy4G66U7HKTT7AQGIaL2Heyv7PooeVYpcPi1/s1600/reddit.gif'/></a>
<!-- Digg --> 
<a class='digg' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' rel='nofollow' target='_blank' title='Digg This'><img alt='Digg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5mgWDc_0HvNj6vGlf6XVS9IcVpb3EyH7_fOgXKuXJUgcWS_8zUL0OXDnuZ13E772KPE8NyjZnGfF1Ge6sPfV32NtJUJpm2T0BZjTpAA7PgVhm138o6JfnWODvgar2y0fGlizSuT-c-DHj/s1600/digg.gif'/></a>
<!-- Email --> 
<a href='mailto:?Subject=My Blogger Tricks&amp;Body=Check out this site.. http://www.myblogger-tricks.com' rel='nofollow' target='_blank' title='Email This'><img alt='Email' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVNZdZSTzNHOugDjxUfmkO3KwaSfnP4OV987EOT-oVfHnV_ZwYFQlzH6a48LzD4JFT20Enwo1VbdLg8-H4jMGY_T6Mg6T2ixx7DA8e4NQn60rpwUx_ofBe_O14cyUGsmRgxw1_BSDhxYxW/s1600/email.gif'/></a>
<!-- addtoany --> 
  <a class='a2a_dd more' expr:href='&quot;http://www.addtoany.com/share_save?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank' title='Share On Others Networks'><script src='http://static.addtoany.com/menu/page.js' type='text/javascript'/><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBtJyDIqiglHP9YIri-x0LCLiHZlSRucq968ciY_vKpcstqBJGo7lpa3ArQhOeOqpotiW8UFrAQ2CqsxtF6BWHz9hD-0JWEqOCZc2h7-iqmlx1X_k7tpm0F5x48bcIEO6Yg2NY9vzodG7g/s1600/share-to-any.gif'/></a>
</div> 
</center>