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

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

كيفية اضافة هذه القطعه الى مدوناتكم

    انتقل إلى لوحة تحكم مدونتك
     HTML/Javascript إختر "تخطيط" ثم إضافة أداة ثم اختر      والآن الصق داخل المستطيل الكود التالي

<style>
.SG-tweter-header {
background: #000 url(http://softglad.at.ua/widgets/black-bg.jpg);
}
.SG-tweter {
 width: 266px;
 background-color: #ffffff;
 font-family: Arial, Helvetica, sans-serif;
 border-radius: 0;
}
.SG-tweter .SG-tweter-header {
 padding: 10px;
 height: 73px;
}
.SG-tweter .SG-tweter-header .screen-name h1 {
 color: #fff;
 margin: 0;
 font-size: 16px;
 text-transform: capitalize;
 font-family: 'Helvetica', sans-serif;
}
.SG-tweter .SG-tweter-header .screen-name h2, .SG-tweter .SG-tweter-header .screen-name h3 {
 color: #ffffff;
 margin: 0;
 font-size: 12px;
 font-family: 'Helvetica', sans-serif;
 background: none;
}
.SG-tweter .SG-tweter-header .screen-name {
 margin-top: 20px;
 width: 150px;
 float: left;
}
.SG-tweter .SG-tweter-header .profile-image {
 width: 70px;
 height: 70px;
 float: right;
}
.SG-tweter .SG-tweter-header .profile-image img {
 width: 70px;
 height: 70px;
 border-radius: 40px;
}
.SG-tweter .twitter-summary {
 background-color: #f9f9f9;
 height: 60px;
 position: relative;
}
.SG-tweter .twitter-summary ul {
 display: table-row;
 height: 60px;
 width: 100%;
 margin: 0;
 padding: 0;
 text-align: center;
 padding: 15px 0px;
}
.SG-tweter .twitter-summary ul li {
 background: #0AB7E2;
 list-style-type: none;
 font-size: 12px;
 padding: 0px 6px;
 text-align: center;
 vertical-align: middle;
 display: table-cell;
 color: #fff;
 width: 84px;
 -webkit-transition: .5s;
 -moz-transition: .5s;
 -ms-transition: .5s;
 -o-transition: .5s;
 transition: .5s;
 border:0 ;
}
.SG-tweter .twitter-summary ul li:hover {
 background: #9808AC;
 -webkit-box-shadow: 0px 5px 5px 0px #666;
 -moz-box-shadow: 0px 5px 5px 0px #666;
 -ms-box-shadow: 0px 5px 5px 0px #666;
 -o-box-shadow: 0px 5px 5px 0px #666;
 box-shadow: 0px 5px 5px 0px #666;
}
.SG-tweter .twitter-summary ul li a {
 color: #fff;
 text-decoration: none;
}
#boxs {
 display:none;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="http://softglad.at.ua/widgets/twitter-badge.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
 $("#box").dwseeTwitterBox({
 'screenname':'albaadani1',
 })
})
</script>
<div id="box">
</div>

وبالاخير قم باسبتدال ما باللون albaadani1 باسم حسابك في تويتر
الان قم بحفظ الاداه ومبرووووك عليك الاضافه

By glok

Similiar tagsاضافات بلوجرتويتر