15482721749897530
recent
أخبار ساخنة

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

الخط

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

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

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

اولا قم بالذهاب الي التخطيط 
وبعدها قم باضافة أداة HTML/JavaScript
وضع داخل الاداة هذا الكود 


<div class="trendy_counters">
<ul class="sc_vertical">
<li class="count-twitter"><a data-color-hover="#0084b4" style="background-color: rgb(51, 204, 255); padding: 10px;" class="icon" href="https://twitter.com/trendy_theme"><span class="fa fa-fw fa-twitter" style="font-size:24px; color:#fff" data-color-hover="#fff"></span><span class="items"><span data-color-hover="#fff" class="count" style="font-size:16px; color:#fff">117</span><span data-color-hover="#fff" class="label" style="font-size:12px; color:#fff">متابعين</span></span></a></li>
<li class="count-googleplus"><a data-color-hover="#ff9800" style="background-color:#ff9800; padding:10px;" class="icon" href="https://rss.com/"><span class="fa fa-fw fa-rss" style="font-size:24px; color:#fff" data-color-hover="#fff"></span><span class="items"><span data-color-hover="#fff" class="count" style="font-size:16px; color:#fff">0</span><span data-color-hover="#fff" class="label" style="font-size:12px; color:#fff">followers</span></span></a></li>
<li class="count-facebook"><a data-color-hover="#5E80BF" style="background-color:#3B5998; padding:10px;" class="icon" href="https://www.facebook.com/"><span class="fa fa-fw fa-facebook-official" style="font-size:24px; color:#fff" data-color-hover="#fff"></span><span class="items"><span data-color-hover="#fff" class="count" style="font-size:16px; color:#fff">0</span><span data-color-hover="#fff" class="label" style="font-size:12px; color:#fff">likes</span></span></a></li>
<li class="count-vimeo"><a data-color-hover="#0088cc" style="background-color:#00adef; padding:10px;" class="icon" href="https://vimeo.com/"><span class="fa fa-fw fa-vimeo" style="font-size:24px; color:#fff" data-color-hover="#fff"></span><span class="items"><span data-color-hover="#fff" class="count" style="font-size:16px; color:#fff">0</span><span data-color-hover="#fff" class="label" style="font-size:12px; color:#fff">lمتابع</span></span></a></li>
<li class="count-youtube"><a data-color-hover="#90030c" style="background-color:#bf2626; padding:10px;" class="icon" href=""><span class="fa fa-fw fa-youtube" style="font-size:24px; color:#fff" data-color-hover="#fff"></span><span class="items"><span data-color-hover="#fff" class="count" style="font-size:16px; color:#fff">0</span><span data-color-hover="#fff" class="label" style="font-size:12px; color:#fff">مشترك</span></span></a></li>
<li class="count-instagram"><a data-color-hover="#8a3ab9" style="background-color:#cd486b; padding:10px;" class="icon" href="https://instagram.com/nayon07"><span class="fa fa-fw fa-instagram" style="font-size:24px; color:#fff" data-color-hover="#fff"></span><span class="items"><span data-color-hover="#fff" class="count" style="font-size:16px; color:#fff">500</span><span data-color-hover="#fff" class="label" style="font-size:12px; color:#fff">متابع</span></span></a></li>
</ul>
</div>
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>
<style>
.trendy_counters:after {
clear: both;
content: '';
display: block;
}
.trendy_counters ul {
list-style: none;
margin: 0;
padding: 0;
clear: both;
}
.trendy_counters ul li {
text-align: center;
background: #f9f9f9;
}
.trendy_counters ul li a {
padding: 10px;
text-decoration:none;
}
.trendy-counters-per-row-2 ul li {
width: 50%;
float: left;
}
.trendy-counters-per-row-3 ul li {
width: 33.333%;
float: left;
}
.trendy-counters-per-row-4 ul li {
width: 25%;
float: left;
}
.sc_vertical a, .sc_vertical span:not(.fa) {
display: block;
text-align: center
}
.sc_horizontal a {
display: flex;
text-align: center;
align-items: center;
justify-content: center;
}
.sc_horizontal span {
margin-right: 3px;
}
.show-labels-No .label {
display: none !important;
}
.trendy-counters-icons-order {
padding: 10px;
background: #f6f6f6;
}
.trendy-counters-icons-order div {
background: #eaeaea;
display: inline-block;
margin-right: 5px;
padding: 10px;
}
.trendy-counters-icons-order div:hover {
cursor: move;
}
.trendy_counters ul li {
text-align: center;
background: #f9f9f9;
width: 33%;
float: left;
padding: 0;
}
</style>


وقم بتغيير ارقام المتابعين والمشتركين الي ارقامك وقم بحفظ الاداة وستكون قمت باضافة عداد المتابعين لمدونات بلوجر . 
   انتهي موضوع اليوم لاتنسي زيارة اقسام الموقع لمزيد من الشروحات واذا واجهتك اي مشكلة عموما في موقعك قم بكتابتها في صفحة اسألنا,  او اذا كنت تريد شرح معين عن  أي شي في بلوجر او SEO لاتتردد في كتابته في التعليقات    
ليست هناك تعليقات
إرسال تعليق

إرسال تعليق

نموذج الاتصال
الاسمبريد إلكترونيرسالة