إضافة أزرار مواقع التواصل الإجتماعي بشكل ميترو لمدونة بلوجر
 

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

إضافة أزرار مواقع التواصل الإجتماعي بشكل ميترو لمدونة بلوجر

لإضافتها اتبع الخطوات التالية :

1- ادخل الى مدونتك عن طريق الرابط التالي:

http://blogger.com/

2- اذهب الى لوحة التحكم تم اضغط على تخطيط

3- تم اضغط على اضافة أداة ، HTML/JavaScript

ثم الصق الكود التالي:































/*Metro UI Social Profile Widget v2.0 by Tech Prevue Labs


Distributed under license CC BY-NC-ND 3.0 INT



Please keep license information intact while using this widget*/



.metro-social{width:285px}



.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}



.metro-social .fb,.tw,.gp,.fd{z-index:7;float:left;margin:1px;position:relative;di splay:block}
.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}


.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:140px;height:70px}


.metro-social .gp{background:url(//goo.gl/oT0kF) no-repeat center center #da4a38;width:140px;height:69px}


.metro-social .fd{background:url(//goo.gl/ncoLY) no-repeat center center #e9a01c;width:282px;height:69px}


.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}


.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}


.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}


.metro-social li:hover .fd{background:url(//goo.gl/JFGqn) no-repeat center center #e9a01c}






4- الأن قم بتغير ما لون بالازرق بحساباتك