اضافات بلوجر- اضافة ازرار المشاركة اسفل المواضيع لمدونات بلوجر 12 موقع.

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

اضافة ازرار المشاركة لمدونات بلوجر-SOCIAL SHARE BUTTON For Blogger

• معاينة أزرار المشاركة

- 12 موقعا كاملا موجودة في اضافة ازرار المشاركة التي سوف نقوم بعرض أكواد Javascript وCSS المكونة لها داخل قالب بلوجر ، اضافة ازرار المشاركة معروضة بشكل جذاب وانيق لامثيل له بحيث تتيح لزوارك مشاركة موضوعك ، على اكبر ثلاثة مواقع على الانترنت ويوجد في اضافة ازرار المشاركة زر فيه قائمة ب 9 مواقع اخرى لايستهان بها.

اضافات بلوجر-إضافة أزرار المشاركات الإجتماعية لمدونات بلوجر فلات 2016

اضافة ازرار المشاركة لمدونتك مهم جدا وأهم من ذلك هو الحفاظ على سرعة تحميل الموضوع في القالب ازرار مشاركة الموضوع بسيطة وخالية ومن التكويدات التي يمكن أن تؤثر على قالب بلوجر الخاص بك ، لااطيل في الموضوع وسأبدأ في خطوات تنصيب ازرار المشاركة لذا من الأفضل أخد نسخة احتياطية لقالبك تحسبا لأي طارئ سوف نقوم بالدخول للقالب لاضافة ازرار المشاركة الموجودة في الصورة أعلاه .يمكنك تحميل اكواد الاضافة من هنا

• Css Share BUTTON
• Html Share BUTTON

1- الخطوة الأولى بعد أخد نسخة احتياطية لقالبك من زر البحث في مدونتك داخل اعدادات قالب بلوجر  ابحث عن الكود التالي 

</style> وقم بوضع كود CSS فوقه مباشرة .

 /* howarabi.blogspot.com Share Button */
.sharede,.howarabic_sharethis{position:relative;display:inline-block;}
.howarabic_sharethis{display:table;margin:40px auto 20px auto;text-align:center}
.howarabic_sharethis a.fb,.howarabic_sharethis a.gp,.howarabic_sharethis a.tw,.howarabic_sharethis span.pl{text-decoration:none!important;display:inline-block;margin:0 5px 5px 0;font-weight:400;border-radius:2px;color:#fff;text-shadow:none;padding:6px 12px;opacity:1;transition:all .3s}
.howarabic_sharethis a.gp {background:#f20000;}
.howarabic_sharethis a.fb {background:#516ca4;}
.howarabic_sharethis a.tw {background:#00baff;}
.howarabic_sharethis span.pl {background:#ff6600;}
.howarabic_sharethis a i{margin:0 5px 0 0}
.fbtea,.gotea,.plustea,.twtea{font-size:13px!important;vertical-align:middle}
.howarabic_sharethis a.fb:hover,.howarabic_sharethis a.gp:hover,.howarabic_sharethis a.tw:hover,.howarabic_sharethis span.pl:hover{color:#fff;opacity:.9}
.howarabic_sharethis a.fb:active,.howarabic_sharethis a.gp:active,.howarabic_sharethis a.tw:active,.howarabic_sharethis span.pl:active{box-shadow:inset 0 1px 0 rgba(0,0,0,.16)}
span.pl{color:green;cursor:pointer}
#share-menu,ul.post-meta{display:none}
.dropdown-menu{position:absolute;bottom:100%;right:5px;z-index:99;float:left;min-width:100px;padding:5px 10px;margin:0;font-size:13px;text-align:left;list-style:none;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #ddd;border-radius:3px;}
.dropdown-menu li{list-style:none!important;margin:0!important;padding-left:0!important;line-height:1.8em!important}
.dropdown-menu li a{color:#333!important;font-weight:400;display:block}
.dropdown-menu li a:hover{color:#F89406!important}
ul#share-menu{margin:10px 0;padding:5px 15px} 

2- الخطوة الثانية بنفس الطريقة قم بالبحث عن الكود التالي <data:post.body/> الكود تجده مكررا ربما مرتين أو ثلاث مرات الذي نحتاجه في اضافة ازرار المشاركة هو الكود الأخير لذا كن حذرا في هاته الخطوة لتضيف ازرار المشاركة بنجاح داخل قالبك.
- بعد ايجادك للكود قم بوضع الكود التالي تحته مباشرة
- ملاحظة : اذا كنت تريد استبدال ازرار المشاركة عليك بحذف كود ازرار المشاركة الموجود داخل قالب بلوجر الخاص بك سابقا.

 <script type='text/javascript'>
//<![CDATA[
var siteurl = window.location.href;
  document.write('<div class="howarabic_sharethis"><div class="sharede"> \
<a class="gp social-popup" href="https://plus.google.com/share?url=' + siteurl + '" target="_blank" title="Share to Google+">\
    <i class="fa fa-google-plus gotea"></i> Google</a> \
<a class="fb social-popup" href="https://www.facebook.com/sharer/sharer.php?u=' + siteurl + '" target="_blank" title="Share to Facebook">\
    <i class="fa fa-facebook fbtea"></i> Facebook</a> \
<a class="tw social-popup" href="https://twitter.com/intent/tweet?text='+encodeURIComponent(document.title)+'&url='+siteurl+'" target="_blank" title="Share to Twitter">\
    <i class="fa fa-twitter twtea"></i> Twitter</a> \
    <span class="pl" data-target="#share-menu"><i class="fa fa-plus plustea"></i> More</span> \
<ul class="dropdown-menu" id="share-menu"> \
    <li><a class="social-popup" href="javascript:pinIt();">Pinterest</a></li> \
    <li><a class="social-popup" href="//www.digg.com/submit?url=' + siteurl + '" target="_blank" title="Share This On Digg">Digg</a></li> \
    <li><a class="social-popup" href="//www.linkedin.com/shareArticle?mini=true&amp;url=' + siteurl + '" target="_blank" title="Share This On Linkedin">Linkedin</a></li> \
    <li><a class="social-popup" href="//www.stumbleupon.com/submit?url=' + siteurl + '&amp;title='+encodeURIComponent(document.title)+'" target="_blank" title="Share This On Stumbleupon">Stumbleupon</a></li> \
    <li><a class="social-popup" href="//delicious.com/post?url=' + siteurl + '&amp;title='+encodeURIComponent(document.title)+'" target="_blank" title="Share This On Delicious">Delicious</a></li> \
    <li><a class="social-popup" href="http://www.tumblr.com/share/link?url=' + siteurl + '&name='+encodeURIComponent(document.title)+'&description='+encodeURIComponent(document.title)+'" target="_blank" title="Share This On Tumblr">Tumblr</a></li> \
    <li><a class="social-popup" href="http://bufferapp.com/add?text='+encodeURIComponent(document.title)+'&url=' + siteurl + '" target="_blank" title="Share This On BufferApp">BufferApp</a></li> \
    <li><a class="social-popup" href="https://getpocket.com/save?url=' + siteurl + '&title='+encodeURIComponent(document.title)+'" target="_blank" title="Share This On Pocket">Pocket</a></li> \
    <li><a class="social-popup" href="http://www.evernote.com/clip.action?url=' + siteurl + '&title='+encodeURIComponent(document.title)+'" target="_blank" title="Share This On Evernote">Evernote</a></li> \
    </ul> \
</div><div class="clear"></div></div> \
');
$(document).ready(function(){$(".pl").click(function(){$("#share-menu").slideToggle("fast")})});
function pinIt(){var t=document.createElement("script");t.setAttribute("type","text/javascript"),t.setAttribute("charset","UTF-8"),t.setAttribute("src","https://assets.pinterest.com/js/pinmarklet.js?r="+99999999*Math.random()),document.body.appendChild(t)};
//]]>
</script>
<div style='clear:both;'/> 

- بعد قيامك باضافة اكواد ازرارالمشاركة قم بحفظ القالب ولديك خياران اما أن تعلق لأن اضافة ازرار المشاركة نجحت معك أو أن تعلق لأنها لم تنجح ونعيد النظر في الأمر ، في كلتا الحالتين قم بدعم مدونتنا سلامي آخر كلامي