أيقونات مواقع التواصل الإجتماعي لمدونتك .. جديد

السلام عليكم و رحمة الله وبركاته :)

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

طريقة التركيب : 

اولا تتوجه الى تخطيط 

ثم اضافة اداة 

تضيف الكود وقم بحفظ الاضافة

كود الاضافة :

<ul class="spicesocialwidget">

<li class="facebook">

<a href="http://www.facebook.com/" rel="nofollow" target="_blank" title="facebook">

</a></li>

<li class="googleplus">

<a href="https://plus.google.com/" rel="nofollow" target="_blank" title="googleplus">

</a></li>

<li class="pinterest">

<a href="http://pinterest.com/" rel="nofollow" target="_blank" title="pinterest">

</a></li>

<li class="twitter">

<a href="http://twitter.com/" rel="nofollow" target="_blank" title="twitter">

</a></li>

<li class="rss">

<a href="http://feedburner.com/" rel="nofollow" target="_blank" title="rss">

</a></li>

<li class="skype">

<a href="http://www.skype.com/" rel="nofollow" target="_blank" title="Skype">

</a></li>

<li class="vimeo">

<a href="http://www.vimeo.com/" rel="nofollow" target="_blank" title="vimeo">

</a></li>

<li class="dribbble">

<a href="http://www.dribbble.com/" rel="nofollow" target="_blank" title="dribble">

</a></li>

<li class="flickr">

<a href="http://www.flickr.com/" rel="nofollow" target="_blank" title="flickr">

</a></li>

<li class="linkedin">

<a href="http://www.linkedin.com/" rel="nofollow" target="_blank" title="linkedin">

</a></li>

<li class="youtube">

<a href="http://www.youtube.com/" rel="nofollow" target="_blank" title="youtube">

</a></li>

</ul>

<style>

ul.spicesocialwidget {float:right;}

ul.spicesocialwidget li {float:left;list-style: none outside none;border:none;}

ul.spicesocialwidget li a{background-color:transparent;background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6ylvLCcVlLBl0btpDVYXbM0Vc7Bf4kALcsfERNHmGPQV_lUO0GToa58GPfwi4EblGxK4oAGR5cfTQaASQjJLtI8zpgfHk-p0TgR4tepdeQ2VsjMMeLv5sSU7-U-s-3ZA6djaNVcj48xMj/s1600/spice-social-gadget-sprite.png');background-repeat:no-repeat;background-size:auto 96px;border:0 none;color:white;direction:ltr;display:block; height:32px;overflow:hidden;text-align:left;text-decoration:none;text-indent:-999em;transition:all 0.2s ease 0s;width:32px}

.ie7 ul.spicesocialwidget li a, .ie8 ul.spicesocialwidget li a{background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6ylvLCcVlLBl0btpDVYXbM0Vc7Bf4kALcsfERNHmGPQV_lUO0GToa58GPfwi4EblGxK4oAGR5cfTQaASQjJLtI8zpgfHk-p0TgR4tepdeQ2VsjMMeLv5sSU7-U-s-3ZA6djaNVcj48xMj/s1600/spice-social-gadget-sprite.png' )}

ul.spicesocialwidget li.facebook a{ background-position:0 0}

ul.spicesocialwidget li.flickr a{ background-position:-32px 0}

ul.spicesocialwidget li.dribbble a{ background-position:-64px 0}

ul.spicesocialwidget li.googleplus a{ background-position:-96px 0}

ul.spicesocialwidget li.linkedin a{ background-position:-128px 0}

ul.spicesocialwidget li.pinterest a{ background-position:-160px 0}

ul.spicesocialwidget li.rss a{ background-position:-192px 0}

ul.spicesocialwidget li.skype a{ background-position:-224px 0}

ul.spicesocialwidget li.twitter a{ background-position:-256px 0}

ul.spicesocialwidget li.vimeo a{ background-position:-288px 0}

ul.spicesocialwidget li.youtube a{ background-position:-320px 0}

ul.spicesocialwidget li.facebook a:hover, #sidebar ul.spicesocialwidget li.facebook a:hover{ background-position:0 -32px}

ul.spicesocialwidget li.flickr a:hover, #sidebar ul.spicesocialwidget li.flickr a:hover{ background-position:-32px -32px}

ul.spicesocialwidget li.dribbble a:hover, #sidebar ul.spicesocialwidget li.dribbble a:hover{ background-position:-64px -32px}

ul.spicesocialwidget li.googleplus a:hover, #sidebar ul.spicesocialwidget li.googleplus a:hover{ background-position:-96px -32px}

ul.spicesocialwidget li.linkedin a:hover, #sidebar ul.spicesocialwidget li.linkedin a:hover{ background-position:-128px -32px}

ul.spicesocialwidget li.pinterest a:hover, #sidebar ul.spicesocialwidget li.pinterest a:hover{ background-position:-160px -32px}

ul.spicesocialwidget li.rss a:hover, #sidebar ul.spicesocialwidget li.rss a:hover{ background-position:-192px -32px}

ul.spicesocialwidget li.skype a:hover, #sidebar ul.spicesocialwidget li.skype a:hover{ background-position:-224px -32px}

ul.spicesocialwidget li.twitter a:hover, #sidebar ul.spicesocialwidget li.twitter a:hover{ background-position:-256px -32px}

ul.spicesocialwidget li.vimeo a:hover, #sidebar ul.spicesocialwidget li.vimeo a:hover{ background-position:-288px -32px}

ul.spicesocialwidget li.youtube a:hover, #sidebar ul.spicesocialwidget li.youtube a:hover{ background-position:-320px -32px}

</style>

}