أكتب إسم موقع أو شركة ..

الأحد، 14 مايو 2017

أزرار المواقع الإجتماعية لنشر المواضيع

السلام عليكم ورحمة الله
أحبتي في الله اليوم أود أن أعطيكم أزرار النشر على المواقع الإجتماعية ، وهذه الإضافة تحتوي على فيس بوك، تويتر، جوجل+ ولينكدإن

في الحقيقة هي إضافة رائعة وأنيقة وتعطي نظرة جميلة للمواضيع ، كما تستطيع تغيير مثلا لون الخط والحجم ، اللغة من العربية إلى الإنجليزية أو الفرنسية ، يعني تستطيع التحكم فيها تماما

إضغط على الصورة لتكبيرها ومعاينة الإضافة

كيفية الإضافة:
  1. من لوحة التحكم على مدونتك إختر قالب ثم خذ لك نسخة إحتياطية لقالبك 
  2. إضغط على تحرير HTML وباستعمال Ctrl+F إبحث على التالي <data:post.body/>، وألصق الكود التالي تحته

    <b:if cond='data:blog.pageType == &quot;item&quot;'><div class='tombol-berbagi-arlina'><div class='tombol-berbagi-arlina-fb'><a class='tombol-berbagi-fb' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'/><a class='tombol-berbagi-fb-label' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'>  شارك على فيس بوك</a></div><div class='tombol-berbagi-arlina-tw'><a class='tombol-berbagi-tw' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow' target='_blank'/><a class='tombol-berbagi-tw-label' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow' target='_blank'>شارك على تويتر</a></div><div class='tombol-berbagi'><a class='tombol-berbagi-gp' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'/><a class='tombol-berbagi-gp-label' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>شارك على جوجل بلس</a></div><div class='tombol-berbagi'><a class='tombol-berbagi-lin' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' rel='nofollow' target='_blank'/><a class='tombol-berbagi-lin-label' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' rel='nofollow' target='_blank'>شارك على لينكدإن</a></div></div></b:if>

  3. إبحث عن ]]></b:skin> وضع الكود التالي فوقه ثم قم بحفظ

    /* CSS Share Button */.tombol-berbagi-arlina{display:block;position:relative;height:43px;line-height:43px;padding:10px;border-top:1px solid #dadada;border-bottom:1px solid #dadada;margin:auto}.tombol-berbagi-arlina-fb,.tombol-berbagi{float:left;width:21%;padding:0 10px;height:inherit}.tombol-berbagi-arlina-tw,.tombol-berbagi,.tombol-berbagi-lk{float:left;width:21%;height:inherit;padding:0 10px;border-left:solid 1px #dadada}.tombol-berbagi-fb,.tombol-berbagi-tw,.tombol-berbagi-gp,.tombol-berbagi-lin,.tombol-berbagi-pi{float:left;display:block;background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhF9juj7knjGHKgOEFkyPuqjTCnrtvVSvmYEsGKRTqFqjLXqVZZEO4HOl9b928nFPNxG1zNdQxhe_CbDMMh-LPcgNuChIIkKpMQVXKTXUe0kJcV9pQi5_F2EXq44ELBtbXr-kOdoemfsjC1/s1600/share.png') no-repeat;width:42px;height:41px;margin-right:3px}.tombol-berbagi-fb-label{color:#2d609b}.tombol-berbagi-fb-label,.tombol-berbagi-tw-label,.tombol-berbagi-gp-label,.tombol-berbagi-lin-label{float:left;width:58px;height:inherit;font-size:12px;font-family:'Open Sans Bold',Arial,sans-serif;line-height:14px;margin:5px 0 0 4px}.tombol-berbagi-tw{background-position:0 -43px}.tombol-berbagi-tw-label{color:#00c3f3}.tombol-berbagi-gp{background-position:0 -86px}.tombol-berbagi-gp-label{color:#f00}.tombol-berbagi-lin{background-position:0 -129px}.tombol-berbagi-arlina a{color:#999;transition:all .3s;}.tombol-berbagi-arlina a:hover{color:#7cb0ed}@media only screen and (max-width:640px){.tombol-berbagi,.tombol-berbagi-arlina-fb{display:inline-block;float:none;width:48%;padding:0;height:inherit}.tombol-berbagi,.tombol-berbagi-arlina-tw,.tombol-berbagi-lk{float:left;width:48%;padding:0;border-left:0}}
إنتهى ، أرجو أن تنال إعجابكم هذه الإضافة 
▩ مواضيع مقترحة :
هل إستفدت من هذا الموضوع ؟ من فضلك شاركه على :

ليست هناك تعليقات

جميع الحقوق محفوظة لــ: Ibda3-Blogger 2022-2013 ©