مرحبا بكم متتبعينا الأوفياء في تدوينة جديدة سنقدم لكم إضافة رائعة لمدوناتكم وهي أزرار مشاركة لمشاركة الموضوع بشكل جد مذهل نتكلم عن إضافة أساسية يجب أن تكون في أي مدونة فهي عبارة عن مصدر الزوار خاصتا الفيسبوط و التويتر حيث تعتبر الخيط الأول لكل مدونة لجلب المهتمين بمحتوك وأيضا تعطي المدونة رونقا متناسق و جذاب ولكي لا نطيل عليكم نترككم مع طريقة التركيب
- لوحة التحكم/القالب/تحرير html
- إبحث عن </head> وأضف فوقه هذا الكود
/* share button */h2.sharetitle{position:relative;overflow:hidden;margin:20px 0;font-size:120%;font-weight:700;padding:4px 8px;text-align:center;text-transform:uppercase;transition:all .5s ease-out}h2.sharetitle:before, h2.sharetitle:after {position:absolute;top:51%;overflow:hidden;width:50%;height:2px;content:'\a0';background-color:#ccc;}h2.sharetitle:before{margin-right:-50%;text-align:left;}h2.sharetitle span{position:relative;display:inline-block;padding:5px 10px;margin:0 10px;}.sharede,.sharebrow{position:relative;display:inline-block;}.sharebrow{display:table;margin:auto;text-align:center}.sharebrow a.fb,.sharebrow a.gp,.sharebrow a.tw,.sharebrow span.pl{text-decoration:none!important;display:inline-block;margin:0 0 5px 5px;font-weight:400;border-radius:2px;color:#fff;box-shadow:0 1px 0 rgba(0,0,0,.08);text-shadow:none;padding:4px 10px;opacity:1;transition:all .3s}.sharebrow a.gp {background:#f20000;}.sharebrow a.fb {background:#516ca4;}.sharebrow a.tw {background:#00baff;}.sharebrow span.pl {background:#ff6600;}.fbtea,.gotea,.plustea,.twtea{font-size:13px!important;vertical-align:middle}.sharebrow a.fb:hover,.sharebrow a.gp:hover,.sharebrow a.tw:hover,.sharebrow span.pl:hover{color:#fff;opacity:.9}.sharebrow a.fb:active,.sharebrow a.gp:active,.sharebrow a.tw:active,.sharebrow span.pl:active{box-shadow:inset 0 1px 0 rgba(0,0,0,.16)}span.pl{color:green;cursor:pointer}#share-menu{display:none}.dropdown-menu{position:absolute;top:100%;left:5px;z-index:99;float:right;min-width:100px;padding:5px 10px;margin:0;font-size:13px;text-align:right;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-right: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:#e8554e!important}ul#share-menu{margin:10px 0;padding:5px 15px}
ثم إبحث عن <data:post.body/> و أضف تحتها هذا الكود
<h2 class='sharetitle'><span>شارك الفائدة</span></h2>
<script type='text/javascript'>
//<![CDATA[
var siteurl = window.location.href;
document.write('<div class="sharebrow"><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="//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&url=' + siteurl + '" target="_blank" title="Share This On Linkedin">Linkedin</a></li> \
<li><a class="social-popup" href="//www.stumbleupon.com/submit?url=' + siteurl + '&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 + '&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")})});
//]]>
</script>
تعليقات: 0
إرسال تعليق