اضافة الشبكات الاجتماعية بشكل رائع بلوجر

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

شرح طريقة تركيب الاضافة

1- من لوحة تحكم المدونه اختر تخطيط
2- اختر اضافة اداه فى المكان الذى تريده
3- اختر Html/Java

ثم ضع الكود التالي داخل الاداة

<style type="text/css">
/*--- socialnetwork by th3maestro.com ----*/
.maestrosocialnetwork {
background: #F8F8F8;
margin: 10px;
}
.maestrosocialnetwork ul {
padding: 10px;
overflow: hidden;
}
.maestrosocialnetwork li {
float: right;
width: 33.33%;
background: #F8F8F8;
text-align:center;
padding: 0;
transition:0.4s;
}
.maestrosocialnetwork a {
width: 100%;
text-align: center;
display: block;
text-indent: 9999em;
padding: 80px 0 0;
}
.maestrosocialnetwork li:hover {
transition:0.4s;
}
.maestrosocialnetwork .fb{background:#666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmzraPODPxeEUmQ1f62cag2-BwZv0z3p6FP4t3GqS816gqyAtSmgxK4Sk9WT2OGC2VUqObxCld9FOoBZz637noXLInFaYPiWrrbp4251wFWQeU6LQrF2K1tKWhmdlImANdqVuebEps9Yk/s1600/fb.png) no-repeat center 30%;}
.maestrosocialnetwork .fb:hover{background:#0C6DB4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmzraPODPxeEUmQ1f62cag2-BwZv0z3p6FP4t3GqS816gqyAtSmgxK4Sk9WT2OGC2VUqObxCld9FOoBZz637noXLInFaYPiWrrbp4251wFWQeU6LQrF2K1tKWhmdlImANdqVuebEps9Yk/s1600/fb.png) no-repeat center 30%;}
.maestrosocialnetwork .tw{background:#555 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPoEYi-jMnYFFjazwWG2_GZzzUligOsly0af0Tw4qf_z3IRax9k4TlgoF__fL_vpuTkd4g1ef5VFQzfXBNjv17Z9E6tn77yQ6SMxHUZWrRIi8noReGDUpSZ3_7I_KAP4bSB0q-zlkcmkE/s1600/twitter.png) no-repeat center 30%;}
.maestrosocialnetwork .tw:hover{background:#33b5e5  url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPoEYi-jMnYFFjazwWG2_GZzzUligOsly0af0Tw4qf_z3IRax9k4TlgoF__fL_vpuTkd4g1ef5VFQzfXBNjv17Z9E6tn77yQ6SMxHUZWrRIi8noReGDUpSZ3_7I_KAP4bSB0q-zlkcmkE/s1600/twitter.png) no-repeat center 30%;}
.maestrosocialnetwork .rss{background:#444 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMjRgZfZD5kLiZon7y8_c6MUEtnran8C6tpmz8_xrgsz47Cj4_LnJEyFVfKpCLlxM9SHaqDQCHznl3_oxO7WMXhK1Fa63srxNr3z8psuounqCOfguz48Dz4GJDv64eUyTuLpo2kIyON0g/s1600/rss.png) no-repeat center 30%;}
.maestrosocialnetwork .rss:hover{background:#ffbb33 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMjRgZfZD5kLiZon7y8_c6MUEtnran8C6tpmz8_xrgsz47Cj4_LnJEyFVfKpCLlxM9SHaqDQCHznl3_oxO7WMXhK1Fa63srxNr3z8psuounqCOfguz48Dz4GJDv64eUyTuLpo2kIyON0g/s1600/rss.png) no-repeat center 30%;}
.maestrosocialnetwork span {
float: right;
text-align: center;
width: 100%;
font:bold 14px arial;
color:#fff;
padding:0 0 5px
}
.maestrosocialnetwork p {
padding:10px 0;
text-align:center;
font:normal 14px ges;
color:#fff;
background: rgba(50, 50, 50, 0.47);
}
/*--- socialnetwork by th3maestro.com ----*/
</style>
<div class='maestrosocialnetwork'>
<ul>
<li class='fb'><a href='https://www.facebook.com/aouadi.ilyas'>فيسبوك</a><p><span>52,250</span>معجـب</p></li>
<li class='tw'><a href='https://twitter.com/ilyasse7555'>تويتر</a><p><span>14,321</span>متـابع</p></li>
<li class='rss'><a href='http://feeds.feedburner.com/tech1net'>الخلاصات</a><p><span>11,587</span>مشتـرك</p></li>
</ul>
</div>

ستجد الروابط التي يجب تغييرها في الاسفل غيرها بما تريد

ارجو ان تكون الاضافة قد اعجبتكم شكرا على متابعتكم