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

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

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

طريقة تركيب هذه الإضافة :

1- أدخل إلى لوحة التحكم الخاصة بمدونتك على البلوجر، ثم اضغط على تخطيط و أضف HTML/JavaScript.

2- قم بنسخ و لصق الكود التالي داخل الأداة :

<style>
.rss-ST {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1KfCnHUPiVsKteOVKdcdcrDqgQsGpbXFWCYbA0e3fZ_RZpseZ9n4Xd-xnOZ96vDI2C5o9LrSVkBnmQYtD7EnZT3d8A9N1YDbw9tGuaOppf7DjrWFmrM2uMhw5oFCpB1il4PoVD5B12-WQ/s1600/RSS+-+Afkarpro.png) no-repeat;
height: 64px;
padding: 0px 20px 0px 80px;
margin-top: 5px;
}
.rss-ST:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUkQqP8iwsJd3fLDDk7Zzbgp0yQhHS2iqsUxSuDo3-lMSvMagAGD14VkY18EGJIvRYxphpy-pNIkmaCktt4kdoreYDph6njIZBH2VRhGoF1NP9DNRmWX1Nor0-jRohS6SlHFmgXk7MwYUu/s1600/RSS_Over+-+Afkarpro.png) no-repeat;
}
.twitter-ST {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-YI7AkcQpMH2wAHPjAW8Sxm4pO6_teJTFx-jOnDsYi3wzj7J2UkaAMokOpxsHDyDgnA0WzVx2hX-DZfH2S0BWrC59ZtZqDDoX5CWmsxC2ZI6E1WcBiYk-pSIYBg79wzj_BoQRGdfaAg9i/s1600/Twitter+-+Afkarpro.png) no-repeat;
height: 64px;
padding: 0px 20px 0px 80px;
margin-top: 10px;
}
.twitter-ST:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUqWPZ9HliUWe-inBYc36a2G3FMNkkggRnUOhQs5x04uodi9Kj0soL8xSw1IeDgypWLa10rHnin-bZSP5kRBi5KobFWiwzrJG4xUtDfgbsrRuXufUSM_9Zz93jGF20RbaiiaMDtN6TjGJ4/s1600/Twitter_Over+-+Afkarpro.png) no-repeat;
}
.facebook-ST {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6_hXdMPj-2FavZh6Lvz4WzUtxOxuqUfJYJdMx4RaQbxQ1ZPgIrX5fhF7D_WxliMVtjxe3yhrpRRhIY08Trb24CjzXm1CjzkbvjeFIQoF9n6tyuFkLRaJmU2Ggflr3oZcU_XmK6WcrYx4V/s1600/Facebook+-+Afkarpro.png) no-repeat;
height: 64px;
padding: 0px 20px 20px 80px;
margin-top: 10px;
}
.facebook-ST:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnOK_zRdIO-wwco2Bjl6am99eXi8ftoxpzVP9rRc7JDE7EeWv8SPk8PS8tt4EvwutGavR01mdFHG0JOqCv6lCDEcaQYSo0vA3vhNYDkYKX1RYtXYtxkRNPtlIrFQQkgD-gp617RHrYph1X/s1600/Facebook_Over+-+Afkarpro.png) no-repeat;
}
.follower-rss, .follower-twitter, .follower-facebook {
font-family: Georgia,  sans-serif, Times;
font-size: 1.5em;
font-style: italic;
color: #D3C5B1;
padding-top: 05px;
text-shadow: 1px 1px #B2A99D;
}
.follower-rss a, .follower-twitter a, .follower-facebook a {
color: #AA9C89;
}
.follower-rss a:hover{
color:#F47140;
}
.follower-twitter a:hover{
color:#43C7FF;
}
.follower-facebook a:hover{
color:#1071A4;
}
.follower-rss span {
font-size: 1.75em;
font-weight: bold;
font-style: italic;
}
.follower-twitter span {
font-size: 1.48em;
font-weight: bold;
font-style: italic;
}
.follower-facebook span {
font-size: 1.7em;
font-weight: bold;
font-style: italic;
}
</style>

<div class='rss-ST'>
<div class='follower-rss' dir="ltr">
<span>
<a href='http://feeds.feedburner.com/afkarpro'>500+</a>
</span>Readers</div>
</div>
<div class='twitter-ST'>
<div class='follower-twitter' dir="ltr">
<span>
<a href='http://twitter.com/AfkarPro' rel="nofollow">100+</a>
</span>Followers</div>
</div>
<div class='facebook-ST'>
<div class='follower-facebook' dir="ltr">
<span>
<a href='http://www.facebook.com/afkarpro.ap'>1000+</a>
</span>Fans</div>
</div>

3- بعد النسخ قم بالتعديلات التالية بما يناسب مدونتك :

afkarpro : غيره بالآيدي (id) الذي تستخدمه على Feedburner.
AfkarPro : غيره بإسم حسابك على تويتر.
afkarpro.ap : غيره بإسم صفحتك على الفيسبوك.

* و يمكنك أيضا القيام ببعض التغييرات الأخرى، كتغيير قيمة العداد أو أيضا الكلمات الوصفية للزر حسب رغبتك.


4- ثم قم بحفظ الإضافة

*! أتمنى أن أكون قد وفقت في إيصال المعلومة لكم بدون تعقيدات ;)
و إذا واجهت أي مشكل أو لديك أي استفسار لا تتردد في طرح سؤالك وذلك بالرد بتعليق، سأجيب بالتأكيد! إن شاء الله ...

و دمتم في رعاية الله وحفظه