إضافة أزرار المشاركات الإجتماعية تحت كل مشاركة - مدونة الخبراء للبرامج
طريقة تركيب الإضافة
1- ادخل إلة مدونتك / واختر تحرير قالب
2- إبحث عن الوسم <data:post.body/>
3- ضع الكود التالي تحته
الكود
<style>ul.social {list-style:none;display:inline-block;margin:15px auto;}ul.social li {display:inline;float:left;background-repeat:no-repeat;}ul.social li a {display:block;width:50px;height:50px;padding-right:10px;position:relative;text-decoration:none;}ul.social li a strong {font-weight:400;position:absolute;left:20px;top:-1px;color:#fff;z-index:9999;text-shadow:1px 1px 0 rgba(0,0,0,0.75);background-color:rgba(0,0,0,0.7);-moz-border-radius:3px;-moz-box-shadow:0 0 5px rgba(0,0,0,0.5);-webkit-border-radius:3px;-webkit-box-shadow:0 0 5px rgba(0,0,0,0.5);border-radius:3px;box-shadow:0 0 5px rgba(0,0,0,0.5);padding:3px;}ul.social li.abfacebook {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf5mWuCoKvzAZbm6UxXyQ_ea6QMXZ0JrNxVhzrmieow23BzhKTjUvzr4xrXkwV7In64f6n71ylbxRBwtLfIKtfuq06GMWEY_zdrAw9wGMrkLvgHgf5fYsxzyo39YAx4h6PBKI6mbE6s7M/h120/pctoolstips.blogspot.com.png);}ul.social li.abtwitter {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzOz-yjiuudgdSx0x-WwGslYttfer0_33TvfAkHg7e4CqqE47JHC_WEqTzxtnrNYM4r1rb_gBbBeoKNXbi7GRIdirlXW7dCbmv2MrPJ2F1wai58y4iSuWKF6twg9znF6KEd86fgWXNvq8/h120/pctoolstips.blogspot.com.png);}ul.social li.abgoogleplus {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXbD799eNzoYYrshLyK2mrcXOMZtezU-1_cMl5sdVkP1GAHPtYgDguwQzJKutVoAYmVoOtKDURPVdHrQGh2YmTadJPw2sTbRdpDhKWEqNgs4tcKfpEMn81fbzqm7e3JrWrSwI8WqPIOhQ/h120/pctoolstips.blogspot.com.png);}ul li.abpinterest {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHX9-hvg0_kDVffDZs4vHxU1BrBNpMFgmA715brd9hnYnd6HGJVha2-FMaZTRoLSo-UpEH38pKYyYWzPVlzktKTllGfU0RNT0o94OvlZ3ZvYaM6pPyPf_4rah-xtHrtUItpFlfBT6iJQ0/h120/pctoolstips.blogspot.com.png);}ul.social li.abstumbleupon {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSYja6UCAXjCqdtR3XK0u_vC4cea3A-iRlY6Ay-PflsmpA1WBg04iw-0zPzuC_Aw9junzPiPcIQlirsK9qa-rLCyymVtAZEEaFjvlfUmiwBYME40ZN1DzcdUb8zzSQP5kxjhvSa58EzJo/h120/pctoolstips.blogspot.com.png);}ul.social li.abdig {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkipmUHHUNfbgmFkJ_Uh8UL4KH7hqrcEkLXD6h9d0jbTB63OCiJufPAtp6z5U7rOdHpMd7Dz4ERL3M1e7qg6oSSiEvmwRohmvAoxnItCRheeuo3hAbSpINem0V5NHklgxdQzupNckjZbk/h120/pctoolstips.blogspot.com.png);}ul.social li.ablinkedin {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5m06MND25oE99iTvcZUC3FqmxQ5RIrfy_wLoarECkpNyHqVes28JjVXuT6zePnIB2JF8eSTVcijA5HKSDkuh5f4E4JPOfmAfVoQe5vOKQaRWicBSvVMGWPZUQsNUjcnNGLPWKhCR1-6k/h120/pctoolstips.blogspot.com.png);}#animation:hover li {opacity:0.2;}#animation li {-webkit-transition-property:opacity;-webkit-transition-duration:500ms;-moz-transition-property:opacity;-moz-transition-duration:500ms;}#animation li a strong {opacity:0;-webkit-transition-property:opacity, top;-webkit-transition-duration:300ms;-moz-transition-property:opacity, top;-moz-transition-duration:300ms;}#animation li:hover {opacity:1;}#animation li:hover a strong {opacity:1;top:-10px;}</style><b:if cond='data:blog.pageType == "item"'><div style='font-size: 22px;'><b>شارك الموضوع مع أصدقائك.</b></div><ul class='social' id='animation'><li class='abfacebook'><a expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436');return false;' rel='nofollow'><strong>Facebook</strong></a></li><li class='abtwitter'><a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' target='_blank'><strong>Twitter</strong></a></li><li class='abgoogleplus'><a expr:href='"https://plusone.google.com/_/+1/confirm?hl=en&url=" + data:post.url' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' target='_blank'><strong>Google+</strong></a></li><li class='abpinterest'><a href='javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());' rel='nofollow' target='_blank'><strong>Pinterest</strong></a></li><li class='abstumbleupon'><a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' target='_blank'><strong>StumbleUpon</strong></a></li><li class='abdig'><a expr:href='"http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><strong>Dig</strong></a></li><li class='ablinkedin'><a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' target='_blank'><strong>LinkedIn</strong></a></li></ul></b:if></center><div align="right"><a href="http://experts-program.blogspot.com/2013/12/feedburner.html" class="tt">للحصول على مثلها<span class="tooltip"><span class="top"></span><span class="middle"> الإضافة مقدمة من : مدونة الخبراء للبرامج.</span><span class="bottom"></span></span></a></div><style>
4- احفظ القالب
الرجاء من الأخوة الكرام : زوار المدونة عدم النسخ دون ذكر المصدر
ليست هناك تعليقات: