اضافه أزرار المشاركة بشكل جديد

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

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

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

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

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

<style> 
.rss-ST {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRK1sbpH21rOWMAL7Ink20g9vhwZsPl__WuWXlHRoTqguLNvskz4p2UUxsjzdVB8ZpbwsgS-1jzHCW-ZceHZI9UshwPApc0AbRVbJ2334VZfuE_XZ7kGVixBdexoUIx8xmbsN5CaAIJLWK/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/AVvXsEjWDDXtT7EwA2ILe7tGvaaohqrvN3fF3MV9TnkfoD6Q_Oo4hcPcknrQ5PHkPKgE0DD4wdb3NuztB5RVdHYQDblykUmmv51u8xxkGs94Y3t0YgUx64XQ6AlMwScSPEtIAGh2T1mXZCcKytQq/s1600/RSS_Over+-+Afkarpro.png) no-repeat;
}
.twitter-ST {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi56wm4_Rrbau1DtIfvjPGCYA4BQ2sOrxO3bWWtnWhKIyz3TtvkMEPEE_NOpdtbXGG0SuITP-ZhP_Lnd0au3bzvfSiJw7H5RZjKSVuo8aKzZskY8LRRjRgsNtBxarew77MB3zKvptK2ZiyX/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/AVvXsEi7xWPUhuAa1XT0XFuJwTDcx0Rrowm23pUK9AbAzfE4oRuUYiMkjpIAoBMIMEPVFVadrULOzbav84Fbh8kBzw79NBGBqKS6DJd5v240svmD05QRm17hPQLbAdR8eRQ4eT9SA20IjgsxiFFB/s1600/Twitter_Over+-+Afkarpro.png) no-repeat;
}
.facebook-ST {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnoa0XBK9jYFx9W7T7XlNKQ0cEwKPx3J8zO70EWpKEZN6N8AZNmDtRHZbKzV_fKCuwHzEVGWUJtz6cvleMmCvN99F_RJ8tqfChrGmk9-y3N-LAc9YVKcXTCCYqR_dJULUw0nHbOgEydQZG/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/AVvXsEh_UTNEBCJpQs9EmvQx_nJ7JVDtEfemIY97TR7ThBNRjLLnDRpNRsXguzwu9bW3mkLVQ1DImQ26RGxnfheI7TzAek2PaH2xyRHIvEo9Jbcgm9PVp2PRtLcRLDh-vZOsGUsL06SxQJKCdVZW/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- ثم قم بحفظ الإضافة 

شاركها مع أصدقائك!

تابعني→

Tweet

شارك! →