اضافة اداة تابعني عبر الشبكات الاجتماعية بشكل ذهبي وجذاب

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

الخلاصة : الشبكات الاجتماعية لها دور في جلب زوار كثر لمدونتك كما انها تعطي بصمة احترافية على مدونتك .. ولتتمكن من اضافتها تابع الشرح 

صورة الاضافة :

 اداة تابعني عبر الشبكات الاجتماعية بشكل ذهبي

نمر الى الشرح :
1- اذهب الى لوحة التحكم الخاصة بك
2-قم باضغط على تخطيط 
3- ثم اضافة اداة 
4- اختر html javascript
5- اضف الكود التالي : 
<style>
/*Social Networks Widget Dev By (www.blogger-araby.blogspot.com */

.Social-Networks-Sherif{
padding:0px;
margin:1px;
text-align:center;
direction:rtl;
}
.Social-Networks-Sherif:hover{
padding:0px;
margin:1px;
text-align:center;
direction:rtl;
transform:rotate(360deg);
-ms-transform:rotate(360deg); /* IE 9 */
-moz-transform:rotate(360deg); /* Firefox */
-webkit-transform:rotate(360deg); /* Safari and Chrome */
-o-transform:rotate(360deg); /* Opera */
transition: all 1s;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.sherif {
text-align:center;
background:rgb(216, 230, 235);
border:1px solid rgb(159, 150, 250);
-webkit-border-radius:10px;-moz-border-radius:10px;-o-border-radius:10px;-ms-border-radius:10px;border-radius:10px;
}
.sherif1 {
font-family:tahoma;
text-align:right;
margin:2px;
background:none repeat scroll 0% 0% rgb(235, 235, 235);
border:1px solid rgb(200, 200, 200);
-webkit-border-radius:10px;-moz-border-radius:10px;-o-border-radius:10px;-ms-border-radius:10px;border-radius:10px;
}
/*Social Networks Widget Dev By (www.blogger-araby.blogspot.com */
</style>


<div class='sherif'>
<a rel='nofollow' href="GPLUS_URL" target="_blank"><img class='Social-Networks-Sherif' title="تابعنى عبر جوجل بلس" src="http://1.bp.blogspot.com/-LJU0eb2FAbE/UEyS_nKtgdI/AAAAAAAAAgI/n8cEZNB7kEo/s1600/google-plus-icon.png" /></a>

<a rel='nofollow' href="FACEBOOK_URL" target="_blank"><img class='Social-Networks-Sherif' title="تابعنى عبر الفيس بوك" src="http://3.bp.blogspot.com/-hvd3aVxpOnI/UEyS9WjCcuI/AAAAAAAAAf4/9Nj3bpO5etg/s1600/facebook-icon.png" /></a>

<a rel='nofollow' href="TWITTER_URL" target="_blank"><img class='Social-Networks-Sherif' title="تابعنى على تويتر" src="http://1.bp.blogspot.com/-QVDq4YUm0so/UEyTC69Se0I/AAAAAAAAAgQ/vfgIICdo17k/s1600/twitter-icon.png" /></a>

<a rel='nofollow' href="FEED_URL" target="_blank"><img class='Social-Networks-Sherif' title="تابعنى عبر الخلاصة" src="http://3.bp.blogspot.com/--JnAfAtwHm8/UEyS-NyaaeI/AAAAAAAAAf8/R8rjWjmDKzg/s1600/feed-icon.png" /></a>

<div class='sherif1'>
<small>
<a rel='dofollow' href='http://www.blogger-araby.blogspot.com'>إضافات بلوجر</a></small>
</div>
</div>

ملاحضة ضرورية :

بعد لصقك للكود قم بتغير لروابط التالية ( لون الأحمر ) الى روابط خاصة بك :

Gplus_Url رابط حسابك فى جوجل بلس

Twitter_Url  رابط حسابك فى تويتر

Facebook_Url رابط صفحتك او حسابك على الفيس بوك

FEED_URL رابط خلاصات موقعك او رابط حسابك فى feedburner

قدد تتساأل ما مميزات الاضافة !
مميزات :

1- الاضافة متوافقة مع جميع المتصفحات 

2- إضافة تتميز بالخفة والسرعة ولا تأثر فى سرعة المدونة

3- تتميز بأيقونات  ذات ألوان ذهبية جذابة

4- مصممة بتقنية html و اللتقنية الاحترافية Css3

5- بها خاصية الدوران عند مرور الماوس على الأيقونة 

6- متوافقة مع محركات البحث بحيث انى أضفت وسم النوفولو

وفي النهاية أتمنى ان تكون الاضاف قد نالت اعجابك , لأي استفسار أنا في انتضار تعليقك والسلام عليكم ورحم الله تعالى وبركاته والى اللقاء في اضافة جديدة باذن الله .