أخف صندوق لأزرار المشاركة باللون الذي تريده

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

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:left; width:100%; height:25px; margin:4px 0px 4px 0px;padding-left:5px;padding-top:5px;background:#F3F3F3; border:1px solid #C3C3C3; '>
 <!-- AddThis Button BEGIN -->
<div class='addthis_toolbox addthis_default_style '>
<div style='float:right; margin-right:5px; color:#000; margin-top:-1px;font-family:&quot;Arial&quot;;font-size:17px; font-weight:bold; text-shadow: 0 1px 0 #ccc;'><a> شارك الموضوع</a></div>
<a class='addthis_button_facebook_like' fb:like:layout='button_count'/>
<a class='addthis_button_tweet'/>
<a class='addthis_button_google_plusone' g:plusone:size='medium'/>
<a class='addthis_counter addthis_pill_style'/>
</div>
<script src='http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4e0e13be35ed575e' type='text/javascript'/>
<!-- AddThis Button END -->
</div></b:if>


إن اردت إضافة الكود في بداية الموضوع  فأضفه تحت أحد هاذين الكودين


<div class='post-header'>

<div class='post-header-line-1'/>

أما إن اردت أن تضيفه في نهاية الموضوع فأضفه تحت أحد الكودين التاليين


<div class='post-footer'>

<div class='post-footer-line post-footer-line-1'>

طريقة تخصيص الصندوق

width:100% هذه هي مساحة عرض الصندوق

# F3F3F3 وهذا لون الخلفية

#C3C3C3 وهذا لون الإطار

#000 هذا لون كلمة شارك الموضوع ويمكنك تغييرها بأى كلمة وإن كنت ستضيفه في بداية الموضوع يمكنك كتابة السلام أو رسالة ترحيب 

ويمكن الحصول على أكواد الالوان من هنا موفقين بإذن الله  

هناك 11 تعليقًا:

  1. تسلم اخويا على الشرح الرائع
    بس انا عايز الازرار تكون جوه الاطار بظبط مش خارجة بره
    زى بظبط عندك كده ياغالى
    ودى صورة
    https://lh6.googleusercontent.com/-i9Y4FEMoGl4/UUj2dni7IEI/AAAAAAAAAIU/JupcURZaxZ8/s646/untitled.bmp
    وكلمة شارك الموضوع ظهرت فى اول تعديل
    وبعد كده اختفت زى ماشايفها فى الصورة ياغالى
    منتظر ردك

    ردحذف
    الردود
    1. قد يرجع السبب الى عدم توافقها مع القالب
      يمكنك إستخدام الأزرار فقط بدون الإطار وكلمة المشاركة
      وهذا كود الازرار فقط
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <!-- AddThis Button BEGIN -->
      <div class='addthis_toolbox addthis_default_style '>
      <a class='addthis_button_facebook_like' fb:like:layout='button_count'/>
      <a class='addthis_button_tweet'/>
      <a class='addthis_button_google_plusone' g:plusone:size='medium'/>
      <a class='addthis_counter addthis_pill_style'/>
      </div>
      <script type='text/javascript'>var addthis_config = {&quot;data_track_addressbar&quot;:true};</script>
      <script src='http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4e0e13be35ed575e' type='text/javascript'/>
      <!-- AddThis Button END -->
      </b:if>

      حذف
  2. ماشاء الله عليك خبرة اخى والله
    ربنا يكرمك ويوفقك واتمنى اكون خبرة زيك كده فى التدوين
    واخيرا اخويا هل ينفع نعمل تبادل اعلانى يبقى شرف ليا

    ردحذف
    الردود
    1. حياك الله أخي الكريم
      وأكرمنا الله وإياك وبالنسبة للخبرة مع الوقت ستكتسبها
      وبدايتك في التدوين تعتبر اكثر إحترافية من بدايتي
      وأنا ما زلت أتعلم فواصل القراءة والإطلاع وستجد نفسك تكتسب مهارات أكثر كل يوم
      وبالنسبة للتبادل الإعلاني الشرف يكون لي اخي الكريم
      لكن الاماكن المخصصة للتبادل الإعلاني ممتلئة حاليا ربما يكون بيننا تعاون مستقبلاً
      تحياتي

      حذف
  3. تسلملى اخويا على كلامك الرائع ده اللى يشجعنى على الاصرار
    وان شاء الله مستقبلا نتبادل الاعلانات اخويا
    ويكون شرف لى والله

    ردحذف
  4. أخي صاحب المدونة السلام عليكم
    أظن أن هناك خطأ مطبعي في عنوان هذا الموضوع
    ربما كان المقصود (أضف صندوق لأزرار .....)
    و ليس (أخف صندوق لأزرار ....)
    كما هو مكتوب بالعنوان الان
    أرجو التصحيح
    تحياتي

    ردحذف
    الردود
    1. أهلا ومرحباً أستاذ وسام
      لا يوجد خطأ هو سوء تفاهم لا أكثر لأن الكلمة تحمل المعنيين
      أنا أقصد أخف مشتقة من خفيف وليس من إخفاء
      والكلام في بداية الموضوع يوضح هذا
      فصندوق المشاركة هذا من أخف انواع الإضافات التي لا تسبب ثقل في المدونات
      وشكرا لملاحظتك وتشرفت بمرورك

      حذف
  5. ازرار المشاركة لا تظهر في مدونتي اطلاقا حتي باستخدام اضافه موقع ADDTHIS مباشره

    !! اروج المساعده فأحتاجها :)

    ردحذف
    الردود
    1. أخي الكريم قد يكون الكود الذي تضيف فوقه أو تحته كود أزرار المشاركة متكرر حينها يجب ان تجرب تحت كل واحد الى أن الكود الفعال الذي سيظهر تحته الأزرار غير ذلك تكون المشكلة في القالب

      حذف
  6. السلام عليكم

    شكرا على الموضوع الرائع

    لقد اضفت الكود وظهر بالمشاركات

    جزاك الله كل خير

    ردحذف
    الردود
    1. وعليكم السلام ورحمة الله وبركاته
      وجزاك الله بالمثل أختي الفاضلة تحياتي لك

      حذف

نسعد بتعليقاتكم ومروركم
يرجى أن يكون التعليق في اطار الموضوع اى اسئلة أو تعليق يخص موضوع آخر او سؤال خارجي نعتذر عن عدم القدرة للرد عليه

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *

جميع الحقوق محفوظة لــ كن مدون 2018 ©