أخر الأخبار
recent

اضافات بلوجر : اضافة اداة المتابعة عبر شبكات الإجتماعية بشكل مميز

بلوجر 2015, بلوجر عربي, اضافات بلوجر, اضافات بلوجر عربي, اضافات بلوجر 2015, اضافات, اضافة,
اضافات بلوجر : اضافة اداة المتابعة عبر شبكات الإجتماعية بشكل مميز

السلام عليكم جميعا 

اليوم اقدم لكم اداة المتابعة عبر شبكات الإجتماعية بشكل جديد ومميز مع عدد متابعينك علي مواقع التواصل الإجتماعي  وهي "فيسبووك ، تويتر ، جوجل+ " وهنا صورة الأداة . 
1> طريقة تركيب الإضافة علي مدونتك 
2> ادخل علي مدونتك ثم اضغط علي تخطيط
3> ثم اضغط علي HTML / javascript
4> الخطوة الاخيرة هي ان تقوم بنسخ الكود التالي وألصقة 
" ومبروك عليك الإضافة "

<style type="text/css">
.container {
  margin: 0px auto;
  width: 270px;
  text-align: center;
  float: center;
}
.btn-sbm {
  display: inline-block;
  vertical-align: top;
  position: relative;
  margin: 0 5px;
  padding-top: 40px;
  width: 75px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
}
.btn-sbm:active {
  margin-top: 3px;
}
.btn-sbm:active .btn-sbm-action {
  padding-bottom: 3px;
  -webkit-box-shadow: inset 0 -3px rgba(0, 0, 0, 0.15), inset 0 -1px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 -3px rgba(0, 0, 0, 0.15), inset 0 -1px rgba(0, 0, 0, 0.15);
}
.btn-sbm:active .btn-sbm-action:after {
  bottom: 3px;
}
.btn-sbm-count {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  line-height: 40px;
  font-size: 20px;
  letter-spacing: -1px;
  color: #555;
  text-shadow: 0 1px white;
  background: #e6eff5;
  border-width: 1px 1px 0;
  border-style: solid;
  border-color: #c5c5c5 #bbb;
  border-radius: 8px 8px 0 0;
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.03) 0%, transparent 40%);
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.03) 0%, transparent 40%);
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.03) 0%, transparent 40%);
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.03) 0%, transparent 40%);
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.18), 0 2px rgba(0, 0, 0, 0.07);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.18), 0 2px rgba(0, 0, 0, 0.07);
}
.btn-sbm-count:before, .btn-sbm-count:after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -6px;
  border: 6px solid transparent;
  border-top-color: #e6eff5;
}
.btn-sbm-count:before {
  margin-left: -7px;
  margin-top: 1px;
  border-width: 7px;
  border-top-color: rgba(0, 0, 0, 0.07);
}
.btn-sbm-action {
  display: block;
  position: relative;
  line-height: 32px;
  padding: 2px 0 6px;
  font-size: 18px;
  color: white;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  border: solid rgba(0, 0, 0, 0.18);
  border-width: 0 1px;
  border-radius: 0 0 8px 8px;
}
.btn-sbm-action:after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 6px;
  left: 0;
  right: 0;
  border-radius: 0 0 6px 6px;
  -webkit-box-shadow: inset 0 -1px 2px rgba(255, 255, 255, 0.25);
  box-shadow: inset 0 -1px 2px rgba(255, 255, 255, 0.25);
}
.btn-sbm-tweet {
  background: #83cfe8;
  background-image: -webkit-linear-gradient(top, #83cfe8, #6ebbd4);
  background-image: -moz-linear-gradient(top, #83cfe8, #6ebbd4);
  background-image: -o-linear-gradient(top, #83cfe8, #6ebbd4);
  background-image: linear-gradient(to bottom, #83cfe8, #6ebbd4);
  -webkit-box-shadow: inset 0 -6px rgba(0, 0, 0, 0.16), inset 0 -1px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 -6px rgba(0, 0, 0, 0.16), inset 0 -1px rgba(0, 0, 0, 0.15);
}
.btn-sbm-tweet:after {
  -webkit-box-shadow: inset 0 -1px 2px rgba(255, 255, 255, 0.5);
  box-shadow: inset 0 -1px 2px rgba(255, 255, 255, 0.5);
}
.btn-sbm-tweet + .btn-sbm-count {
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.12), 0 2px rgba(0, 0, 0, 0.04);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.12), 0 2px rgba(0, 0, 0, 0.04);
}
.btn-sbm-like {
  background: #6480bd;
  background-image: -webkit-linear-gradient(top, #6480bd, #3c5894);
  background-image: -moz-linear-gradient(top, #6480bd, #3c5894);
  background-image: -o-linear-gradient(top, #6480bd, #3c5894);
  background-image: linear-gradient(to bottom, #6480bd, #3c5894);
  -webkit-box-shadow: inset 0 -6px rgba(0, 0, 0, 0.15), inset 0 -1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 -6px rgba(0, 0, 0, 0.15), inset 0 -1px rgba(0, 0, 0, 0.2);
}
.btn-sbm-plus {
  background: #626262;
  background-image: -webkit-linear-gradient(top, #626262, #404040);
  background-image: -moz-linear-gradient(top, #626262, #404040);
  background-image: -o-linear-gradient(top, #626262, #404040);
  background-image: linear-gradient(to bottom, #626262, #404040);
  -webkit-box-shadow: inset 0 -6px rgba(0, 0, 0, 0.08), inset 0 -1px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 -6px rgba(0, 0, 0, 0.08), inset 0 -1px rgba(0, 0, 0, 0.3);
}
</style>

<div class="container">
<a class="btn-sbm" href="https://twitter.com/#" rel="author" target="_blank" title="تابعنا عبر التويتر">
      <span class="btn-sbm-action btn-sbm-tweet">تويتر</span>
      <span class="btn-sbm-count">150+</span>
    </a>
    <a class="btn-sbm" href="http://www.facebook.com/#" rel="nofollow" target="_blank" title="صفحتنا على الفايسبوك">
      <span class="btn-sbm-action btn-sbm-like">فايسبوك</span>
      <span class="btn-sbm-count">650+</span>
    </a>
    <a class="btn-sbm" href="https://plus.google.com/#" rel="author" target="_blank" title="تابعنا على جوجل+">
      <span class="btn-sbm-action btn-sbm-plus">جوجل+</span>
      <span class="btn-sbm-count">140+</span>
    </a><a href="http://web3r.blogspot.com/"></a></div>
 ولا تنسي ان تقوم بأستبدال رقم 150 بعدد متابعينك علي تويتر 
والرقم +140 قم بأستبدالة بعدد متابعينك علي جوجل+
والرقم +650 قم بأستبدالة ايضا بعدد متابعينك علي الفيسبوك
وإذا واجهتك اي مشكلة ضع تعليقك وسوف اتواصل معك 

ليست هناك تعليقات:

إرسال تعليق

يتم التشغيل بواسطة Blogger.