ﺍﺯﺭﺍﺭ ﺍﻟﻤﺸﺎﺭﻛﺔ ﺍﺳﻔﻞ ﺍﻟﻤﻮﺍﺿﻴﻊ ﺑﻠﻮﺟﺮ

الكاتب : Unknown

بتاريخ : 3:49 م

عدد التعليقات : 9

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

لابد بعد ذخولك الموضوع فانت تبحث عن اضافات و ادوات جميلة لتزيين مدونتك و اضافة ازرار مشاركة بشكل احترافي متجاوب و متوافق مع جميع الاجهزة لذلك اتيتكم اليوم بازرار مشاركة احترافية توضع اسفل المواضيع احترافية جدا باخر التقنيات و يوجد فيها زر المشاركة على فيسبوك ، تويتر، جوجل + و ايضا لانكدن و كل هذا بدون اي مقابل فقط هذفي هو مساعدة المدونين العرب فقط كما احتجت انا الى مساعدة من قبل .
و يمكنك طلب اجي اضافة سبق و انا رايتها او تريدنا ان نطرحها على الموقع و ضعها في تعليق و سوف نقوم بطرحها على الموقع انشاء الله ، و لن نبخل عنكم بشيء فلا تبخلو علينا بردودكم المشجعة و نشركم الموضوع لتعم الفائدة و الانضمام الى صفحاتنا على المواقع الاجتماعية ليصلك كل جديد الموقع و لكي نستمر بالعطاء و سوف نستمر انشاء الله .
لن اطيل عليكم سوف نمر الى تركيب الاضافة على المدونة كل ماعيك فعله هو الذخول الى المدونة ثم :
1ـ قالب / تحرير HTML

2ـ ابحث عن :

3 ـقم بلصق هذا الكود اسفله :

<br />
<style>
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
@import "//netdna.bootstrapcdn.com/font-awesome/3.0/css/font-awesome.css";
#buttons {
    width: 475px;
    overflow: hidden;
    margin: 20px auto -10px;
}
 
.social-sharing-title {
background: #555;
color: #ffffff;
text-align: center;
line-height: 47px;
font-size: 18px;
width: 643px;
height: 50px;
display: block;
font-weight: bold;
margin: 0 AUTO;
}
 
#buttons .button {
    float: left;
    margin-right: 10px;
    width: 110px;
    background:#E2E2E2;
    border: 1px solid #cbcbcb;
    border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 15px 5px 5px;
    box-sizing: border-box;
}
 
.button i {
    background: #353535;
    color: #eaeaea;
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    width: 40px;
    height: 40px;
    display: block;
    margin: 0 auto 10px;
    border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
 
.social-container {
    text-align: center;
    text-transform: uppercase;
    font-size: 18px;
    color: #353535;
    line-height: 54px;
    font-family: GESSTwoMediumRegular;
    background: #d8d8d8;
    width: 100%;
    height: 45px;
    box-shadow: inset 0 -2px 4px #c7c7c7;
    border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: relative;
    overflow: hidden;
}
 
.slide, .button i {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
 
.slide {
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15);
    border-radius: 0 0 22px 22px;
    -o-border-radius: 0 0 22px 22px;
    -ms-border-radius: 0 0 22px 22px;
    -moz-border-radius: 0 0 22px 22px;
    -webkit-border-radius: 0 0 22px 22px;
 /* top fix */
    transition: all 0.2s ease-in-out;
    position: absolute;
    height: 45px;
    width: 100%;
    top: -35px;
}
 
.slide::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 10px;
    box-shadow: inset 0 1px 0px #fdfdfd, 0 3px 0px #cdcdcd;
    border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #eaeaea;
    border: 1px solid #cbcbcb;
    box-sizing: border-box;
    bottom: 0;
}
 
.button:hover .slide {
    top: 0;
    border-radius: 3px;
}
 
.linkedin .IN-widget, .button iframe, .google #___plusone_0 {
    top: 1px;
    position: relative;
}
 
.twitter iframe {
    width: 79px !important;
}
 
.google #___plusone_0 {
    width: 60px !important;
}
 
.button.facebook:hover i, .facebook .slide {
    background: #305c99;
    color: white;
}
 
.button.twitter:hover i, .twitter .slide {
    background: #00cdff;
    color: white;
}
 
.button.google:hover i, .google .slide {
    background: #d24228;
    color: white;
}
 
.button.linkedin:hover i, .linkedin .slide {
    background: #007bb6;
    color: white;
}
 
.button.linkedin {
    margin-right: 0;
}
 
.credit {
   display: none;
}
 
.credit a {
   display: none;
}
#buttons {
width: 480px;
overflow: hidden;
margin: 20px auto -10px;
}
</style><br />
<b:if cond="data:blog.pageType == "item""><br />
<br />
</b:if><br />
<div class="social-sharing-title">
الرجاء مشاركة الموضوع لتعم الفائده على الجميع</div>
<div id="buttons">
<div class="facebook button" dir="ltr" style="text-align: left;">
<i class="icon-facebook"><br />
</i><br />
<div class="social-container fb">
<div class="slide">
<iframe allowtransparency="true" expr:src=""//www.facebook.com/plugins/like.php?href=" + data:post.url + "&send=false&layout=button_count&width=85&show_faces=false&action=like&colorscheme=light&font&height=21"" frameborder="0" scrolling="no" style="border: none; height: 21px; margin: 0px; overflow: hidden; width: 85px;"><br />
</div>
فيس بوك<br />
</div>
</div>
<div class='twitter button'>
 <i class='icon-twitter'/><br />
<div class='social-container tw'>
  <div class='slide'>
   <a class='twitter-share-button' data-hashtags='المايسترو' data-via='iTh3Maestro' href='https://twitter.com/share'><br />
غرد </a><br />
<script>
    !function(d,s,id){
      var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
      if(!d.getElementById(id)){
        js=d.createElement(s);
        js.id=id;
        js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
  </script><br />
</div>
تويتر<br />
</div>
</div>
<div class='google button'>
 <i class='icon-google-plus'/><br />
<div class='social-container tw'>
  <div class='slide'>
   <br />
<div class='g-plusone' data-size='medium'>
   </div>
<br />
<script type='text/javascript'>
    (function() {
      var po = document.createElement('script');
      po.type = 'text/javascript';
      po.async = true;
      po.src = 'https://apis.google.com/js/plusone.js';
      var s = document.getElementsByTagName('script')[0];
      s.parentNode.insertBefore(po, s);
    }
    )();
  </script><br />
</div>
جوجل +<br />
</div>
</div>
<div class='linkedin button'>
 <i class='icon-linkedin'/><br />
<div class='social-container tw'>
  <div class='slide'>
   <script src='//platform.linkedin.com/in.js' type='text/javascript'>
 lang: en_US
   </script><br />
<script type='IN/Share'/>
  </div>
لينكدان
 </div>
</div>
</div>
</b:if>

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

كلمات مفتاحية : (قوالب بلوجر ، قالب بلوجر ، قالب بلوجر تقني ، قوالب بلوجر 2015 ، درس بلوجر ، اضافات بلوجر ، قالب بلوجر اخباري )

ﺍﺯﺭﺍﺭ ﺍﻟﻤﺸﺎﺭﻛﺔ ﺍﺳﻔﻞ ﺍﻟﻤﻮﺍﺿﻴﻊ ﺑﻠﻮﺟﺮ

ياسر لموري

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

المشاركات الشائعة

عن المدونة

اعلان على الموقع

التسميات

ﺍﺯﺭﺍﺭ ﺍ​ﻟﻤﺸﺎﺭﻛﺔ ﺍﺳﻔﻞ ﺍ​ﻟﻤﻮﺍﺿﻴﻊ ﺑﻠﻮﺟﺮ

ياسر لموري

مواضيع قد تهمك :

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

المشاركات الشائعة

عن المدونة

اعلان على الموقع

التسميات

ﺍﺯﺭﺍﺭ ﺍﻟﻤﺸﺎﺭﻛﺔ ﺍﺳﻔﻞ ﺍﻟﻤﻮﺍﺿﻴﻊ ﺑﻠﻮﺟﺮ