أضافة أزرار النشر على فيسبوك, تويتر, جوجل بلس, لينكدين, واتساب أسفل مواض...

أضافة أزرار النشر على فيسبوك, تويتر, جوجل بلس, لينكدين, واتساب أسفل مواضيع بلوجر

شرح طريقة اضافة ازرار المتابعة و المشاركة الخاصة بمواقع التواصل الاجتماعي وزر الاشتراك للبريد الالكتروني على مواقعك او مدونة بلوجر بطريقة سهلة و رائعة لزيادة عدد الزوار لموقعك و جعلهم دائما يتوصلون لجديد مواضيعك اضافة مشاركة المواضيع على الصفحات الاجتماعية sharespost : الفيسبوك facebook , التويتر twitter, جوجل بلس google plus , لينكدن linkedin , واتس اب whatsapp اسفل المواضيع على مدونة بلوجر Blogger

الاكواد المستخدمة في الشرح :

نضع فوق الوسم </head> _______________________________________ <script src='//code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'/> ________________________________ <b:skin> نفتح الوسم وفي نهايتة نضع هذا الكود ___________________________ /* post-share by www.arabes1.com */ .post-share{overflow:hidden;margin-bottom:8px} .post-share a.whatsapp{background:#028948} .post-share a.share-linkedin{background:#007bb6} .post-share a.share-gplus{background:#dd4b39} .post-share a.share-twitter{background:#00aced} .post-share a.share-facebook{background:#3b5998} .post-share a{width:18%;display:inline-block;cursor:pointer;margin-right:1.3%;text-align:center;height:35px;color:#fff;line-height:35px;font-size:13px;border-radius:3px;font-family: DroidKufi-bold;} _____________________________________________ نبحث عن الوسم @media screen في حالة عدم وجودة سنقوم بانشاء هذا الوسم : @media screen and (max-width : 900px){ .post-body img, .post-body iframe{ max-width:100%} .post-share a{ float:none; width:96%; margin-bottom:5px; margin:5px auto !important; text-align:center; display:block} .slider-wrapper, .post-readmore a{ display:none !important} } --------------------------------------- نضع هذا الكود اسفل <div class='post-footer'> أو <div class='post-footer-line post-footer-line-1'> بيكون اخر كود لانة متكرر ----------------- <div class='post-share'> <a class='share-facebook' 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'><i class='fa fa-facebook'/> فيسبوك</a> <a class='share-twitter' expr:href='"http://twitter.com/share?url=" + data:post.url ' rel='nofollow' target='_blank' title='Twitter Tweet'><i class='fa fa-twitter'/> تويتر</a> <a class='share-gplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank' title='Google Plus Share'><i class='fa fa-google-plus'/> جوجل +</a> <a class='share-linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=" + data:post.snippets' target='_blank' title='LinkedIn Share'><i class='fa fa-linkedin'/> لينكدين</a> <a class='whatsapp' expr:data-link='data:post.url' expr:data-text='data:post.title'><i class='fa fa-whatsapp'/> واتساب</a> </div> <script type='text/javascript'>/*<![CDATA[*/ var _0x6366=["\x75\x73\x65\x72\x41\x67\x65\x6E\x74","\x74\x65\x73\x74","\x64\x61\x74\x61\x2D\x74\x65\x78\x74","\x61\x74\x74\x72","\x64\x61\x74\x61\x2D\x6C\x69\x6E\x6B","\x20\x2D\x20","\x77\x68\x61\x74\x73\x61\x70\x70\x3A\x2F\x2F\x73\x65\x6E\x64\x3F\x74\x65\x78\x74\x3D","\x68\x72\x65\x66","\x6C\x6F\x63\x61\x74\x69\x6F\x6E","\u0644\u0627\x20\u064A\u0645\u0643\u0646\x20\u0646\u0634\u0631\x20\u062A\u062F\u0648\u064A\u0646\u0629\x20\u0639\u0644\u0649\x20\u0627\u0644\u0648\u0627\u062A\u0633\u0627\u0628\x20\u0645\u0646\x20\u0627\u0644\u062D\u0627\u0633\u0648\u0628\x20\x21","\x63\x6C\x69\x63\x6B","\x2E\x77\x68\x61\x74\x73\x61\x70\x70"];$(_0x6366[11])[_0x6366[10]](function(){if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i[_0x6366[1]](navigator[_0x6366[0]])){var _0x15ebx1=$(this)[_0x6366[3]](_0x6366[2]);var _0x15ebx2=$(this)[_0x6366[3]](_0x6366[4]);var _0x15ebx3=encodeURIComponent(_0x15ebx1)+_0x6366[5]+encodeURIComponent(_0x15ebx2);var _0x15ebx4=_0x6366[6]+_0x15ebx3;window[_0x6366[8]][_0x6366[7]]=_0x15ebx4}else {alert(_0x6366[9])}}) /*]]>*/</script> <b:if cond='data:blog.pageType == "item"'> هنا يكون الكود </b:if> الاكواد تكون اسفل الوسم دة

اليك الشرح :