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

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

لمعاينة الإضافة
إضغط للمشاهدة

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

1. نتوجه إلى التخطيط
2. ثم إلى أداة Html/JavaScript
3. ثم نقوم بوضع هذا الكود

<style>
.social_item-wrapper {
float: right;
width: 48%;
text-align: center;
margin-left: 4% !important;
margin-bottom: 10px !important;
color: #fff;
}
.social_item-wrapper:nth-child(2n+2) {
margin-left: 0 !important;
}
#sidebar .widget {
margin-bottom: 35px;
}
.social_item {
position: relative;
display: block;
height: 107px;
padding: 10px;
overflow: hidden;
}
.social_icon {
font-size: 2rem;
display: inline-block;
margin-top: 5px;
margin-bottom: 9px;
}
.social_num {
line-height: 44px;
width: 100%;
height: 41px;
font-size: .875rem;
display: inline-block;font-family: Electrolize,ge_dinar_tworegular;
}
a.social_item.social_facebook {
background: #3F5B9B;
}
.fa-facebook.social_icon ~ .social_num {
background: #2E4372;
}
li.social_item-wrapper:hover .fa-facebook.social_icon ~ .social_num {
background: #3F5B9B;
}
li.social_item-wrapper:hover .social_facebook {
background: #2E4372;
}
a.social_item.social_twitter {
background: #1C97DE;
}
.fa-twitter.social_icon ~ .social_num {
background: #1571A5;
}
li.social_item-wrapper:hover .fa-twitter.social_icon ~ .social_num {
background: #1C97DE;
}
li.social_item-wrapper:hover .social_twitter {
background: #1571A5;
}
a.social_item.social_youtube {
background: #E22020;
}
.fa-youtube.social_icon ~ .social_num {
background: #B31919;
}
li.social_item-wrapper:hover .fa-youtube.social_icon ~ .social_num {
background: #E22020;
}
li.social_item-wrapper:hover .social_youtube {
background: #B31919;
}
a.social_item.social_dribbble {
background: #E82159;
}
.fa-dribbble.social_icon ~ .social_num {
background: #B51A45;
}
li.social_item-wrapper:hover .fa-dribbble.social_icon ~ .social_num {
background: #E82159;
}
li.social_item-wrapper:hover .social_dribbble {
background: #B51A45;
}
a.social_item.social_rss {
background: #E86321;
}
.fa-rss.social_icon ~ .social_num {
background: #C2521B;
}
li.social_item-wrapper:hover .fa-rss.social_icon ~ .social_num {
background: #E86321;
}
li.social_item-wrapper:hover .social_rss {
background: #C2521B;
}
a.social_item.social_google-plus {
background: #E82C2C;
}
.fa-google-plus.social_icon ~ .social_num {
background: #BF2424;
}
li.social_item-wrapper:hover .fa-google-plus.social_icon ~ .social_num {
background: #E82C2C;
}
li.social_item-wrapper:hover .social_google-plus {
background: #BF2424;
}
a.social_item.social_linkedin {
background: #0275B6;
}
.fa-linkedin.social_icon ~ .social_num {
background: #02669E;
}
li.social_item-wrapper:hover .fa-linkedin.social_icon ~ .social_num {
background: #0275B6;
}
li.social_item-wrapper:hover .social_linkedin {
background: #02669E;
}
a.social_item.social_instagram {
background: #8E714D;
}
.fa-instagram.social_icon ~ .social_num {
background: #6F583C;
}
li.social_item-wrapper:hover .fa-instagram.social_icon ~ .social_num {
background: #8E714D;
}
li.social_item-wrapper:hover .social_instagram {
background: #6F583C;
}
a.social_item.social_pinterest {
background: #CA2027;
}
.fa-pinterest.social_icon ~ .social_num {
background: #AB1B21;
}
li.social_item-wrapper:hover .fa-pinterest.social_icon ~ .social_num {
background: #CA2027;
}
li.social_item-wrapper:hover .social_pinterest {
background: #AB1B21;
}
a.social_item.social_tumblr {
background: #3a5c7e;
}
.fa-tumblr.social_icon ~ .social_num {
background: #36465D;
}
li.social_item-wrapper:hover .fa-tumblr.social_icon ~ .social_num {
background: #3a5c7e;
}
li.social_item-wrapper:hover .social_tumblr {
background: #36465D;
}
</style>


<div class="widget-content socialcounter"><ul class="social-counter"><li class="social_item-wrapper"><a href="#" class="social_item social_facebook"><i class="fa fa-facebook social_icon"></i><br /><span class="social_num">215K</span></a></li><li class="social_item-wrapper"><a href="#" class="social_item social_twitter"><i class="fa fa-twitter social_icon"></i><br /><span class="social_num">115K</span></a></li><li class="social_item-wrapper"><a href="#" class="social_item social_youtube"><i class="fa fa-youtube social_icon"></i><br /><span class="social_num">215,635</span></a></li><li class="social_item-wrapper"><a href="#" class="social_item social_dribbble"><i class="fa fa-dribbble social_icon"></i><br /><span class="social_num">14K</span></a></li><li class="social_item-wrapper"><a href="#" class="social_item social_linkedin"><i class="fa fa-linkedin social_icon"></i><br /><span class="social_num">556</span></a></li><li class="social_item-wrapper"><a href="#" class="social_item social_google-plus"><i class="fa fa-google-plus social_icon"></i><br /><span class="social_num">200K</span></a></li><li class="social_item-wrapper"><a href="#" class="social_item social_instagram"><i class="fa fa-instagram social_icon"></i><br /><span class="social_num">152,500</span></a></li><li class="social_item-wrapper"><a href="#" class="social_item social_rss"><i class="fa fa-rss social_icon"></i><br /><span class="social_num">5124</span></a></li></ul></div>

تخصيص الإضافة:

1. قم بتغيير # بروابط المواقع الخاصة بك والتي ستجدها على هذا الشكل "#"=href .
2. مبروك عليك الإضافة

• إذا واجهت أي مشكلة بالإضافة لا تبخل علينا بطرحها في تعليق.