اداة المشاركه عبر المواقع الاجتماعيه بشكلين مختلفين ( اضافة هل اعجبك الموضوع )

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

الشكل الاول

اضافة ادوات النشر + صندوق لحساب عدد مرات المشاركه


كيفية اضافة هذه الاداه الى مدوناتكم

     1- من  لوحة التحكم -> قالب -> تحرير HTML
     2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
     3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
<div class='post-footer'>

اذا لم تجد الكود السابق فقم بالبحث عن الكود التالي

<data:post.body/>

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

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='alwan-share' style='width: 634px; height: 88px;padding: 7px;background: #f3f3f3; border-bottom: 1px solid #d2d2d2; border-top: 1px solid #d2d2d2;'>
<div style='width: 250px;height: 74px;padding: 6px;background: white;border: 1px solid #EBEBEB; float:right; text-align: center;'>
<div class='fb-like-box'>
هل أعجبك الموضوع &#1567;
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=230&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:230px; height:40px;'/>
</div></div><div align='left'>
<div style='float:left;padding:5px 5px 5px 0;'>
<a expr:share_url='data:post.url' href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
<div class='g-plus' data-action='share' data-annotation='vertical-bubble' data-height='60'/>
<a class='twitter-share-button' data-count='vertical' data-lang='ar' data-related='anywhereTheJavascriptAPI' data-via='mr_raghib' href='https://twitter.com/share'>Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;https://platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
<div id='plusone-div'/></div>
</div></b:if>


الشكل الثاني

اضافة ادوات النشر بشكل افقي


اضافة هل اعجبك هذا لمدونات بلوجر

كيفية اضافة هذه الاداه الى مدوناتكم

     1- من  لوحة التحكم -> قالب -> تحرير HTML
     2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
     3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
 </head>
  
** والصق الكود التالي بعده قبله تماما (فوقه)

<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>

ثم قم بالبحث عن 

<div class='post-footer'>

اذا لم تجد الكود السابق فقم بالبحث عن الكود التالي

<data:post.body/>

ستجد هذا الكود مكرر اكثر من مره (الكود الذي بعد اضافة اقرأ المزيد هو المطلوب)

**الان الصق الكود التالي بعده  مباشره (تحته)

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='width: 95%;
padding: 12px 15px;
margin: 10px 0 0;
border-bottom: 3px solid #d8d8d8;
background: rgb(245, 245, 245);'>
<span style='color: rgb(131, 131, 131); 
font: 13px droidkufi-bold;'> هل أعجبك الموضوع &#1567; </span>
<div style='float: left; '>
<span class='st_plusone_hcount' displayText='Google +1'/>
<span class='st_facebook_hcount' displayText='Facebook'/>
<span class='st_twitter_hcount' displayText='Tweet'/>
</div>
</div></b:if>


اتمنى تكون الاضافه اعجبتكم <<<<<<<< تحياتي العاطره

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

  1. الردود
    1. انا عايز اللى انت ضايفو على مدونتك جلال

      حذف
  2. معلش ما بعرف استخدم هي ال<ابتسامات [-(

    ردحذف
  3. اللهم احفك وازدك ومدونتك جميلة ومن اروع المدونات التى رايتها ومتابعها متجدد جميل اخى

    يارب مجهودك يصل للعالم جميعا
    :) :) (h) (h)
    http://iblogegypt.blogspot.com

    ردحذف
    الردود
    1. شكرا اخي بارك الله فيك x-) x-) x-) x-)

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


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

    http://tanaja7.blogspot.com

    ردحذف
    الردود
    1. الله يبارك في ايامك ويجعلها عامره بالخير والعطاء
      شكرا اخي اسعدني مرورك العطر

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

    رابط المدونة
    http://iraqeen1.blogspot.com/

    اتمنى الرد في اسرع وقت ممكن

    ردحذف
    الردود
    1. وعليك السلام اخي اذا كنت تستخدم قالب المحترف فقم بالبحث عن الكود التالي
      <div id='related-posts'>

      والصق كود الاضافه قبله تماما وان شاء الله سوف تظهر الاداه في مدونتك

      حذف
  6. غير معرف7/10/13 13:00

    الله يوفقك شكراً على هذه الإضافة

    ردحذف
  7. مشكور اخي الله يكرمك

    ردحذف
  8. انت الافضل اخي الله يوفقك

    ردحذف
    الردود
    1. مشكور اخي اسعدني مرورك العطر

      حذف
  9. اشكرك اخي والله عجبني (h)

    ردحذف
    الردود
    1. العفو اخي شكرا لمرورك

      حذف
  10. اخى انا مسحت الكويكز ولم يحصل شى هل هو العيب فى قالب تعلم الامن المعلوماتى .على العلم انا بفتحوا من جوجل كروم بسرعه ارجوك تحللى المشكلة اخر بتكرم

    ردحذف
  11. الردود
    1. العفو اخي شكرا لمرورك

      حذف
  12. السلام عليكم يا اخى
    قمت باضافة الاداة ولكن ظهر اسكرول افقى فى المدونة بدون فائدة ارجو ايجاد حل لهذه المشكلة
    مع العلم يظهر مع هذه الاداة share this فقط

    ردحذف
    الردود
    1. وعليك السلام اخي يرجى وضع رابط مدونتك للمعاينه

      حذف
  13. اخي مشكور تمت العملية بنجاح www.dhsarabe.com

    ردحذف
    الردود
    1. العفو اخي شكرا لمرورك

      حذف
  14. تمت الإضافة.. بارك الله فيكم

    ردحذف
    الردود
    1. الله يبارك في ايامك اخي مشكووور

      حذف
  15. أزرار النشر لكن هناك مشكل في الإعجاب :
    هذا رابط أحد المواضيع في موقعي :
    http://istifada4you.blogspot.com/2013/04/5.html
    إذا حاولت الضغط على زر الإعجاب فهذا لا ينجح و كأن زر الإعجاب مجرد صورة أدخل و جرب بنفسك يا أخي
    و أخبرني جزاك الله خيرا كيفية إصلاح هذا المشكل

    ردحذف
    الردود
    1. اخي الاداه تعمل بكفائه ومجربه مسبقا الخطا في قالبك
      قم بالتاكد من ذلك وركبها على قالب اخر وسترى انها تعمل

      حذف
  16. راااااائع أخي شكراً لك
    ________________________________________
    لكن عندي سؤال وهو أن openid الخاص بمدونتي عند التعليق لا يقبل
    بل يظهر رسالة خطأ

    ردحذف
  17. بارك الله فيك اخي لكن كل شئ بالصور افضل
    (f)

    ردحذف
    الردود
    1. الله يبارك في ايامك اخي
      ان شا ءالله قريبا سيكون الشرح صور بالكامل

      حذف
  18. هههههههههههه رئع

    ردحذف
  19. شكرا لك ياأخي على هذ الإنجاز الرائع أنت مبدع حقا.

    ردحذف
    الردود
    1. شكرا لطيب كلامك اخي

      حذف
  20. اخي موقعي هذا به هذه الاضافه بشكل اخر ولاكني اريد هنا الشكل هل هناك طريقة للتغير
    http://www.mogtm3-msmmen.tk/

    ردحذف
    الردود
    1. قم بحذف الاضافه التي في مدونتك وتركيب الاضافه الذي تريدها

      حذف
    2. هل هذا ياثر علي الايكات اللي موجوده في المواضيع ولا زي ماهي

      حذف
    3. لا يا اخي هذا لن يؤثر عليها اطلاقا

      حذف
    4. جربت الطريقة طلع هناك كود استايل للشكل الموجود ولا يتغير الشكل الا بتغير هذا الكود الي كود اخر
      ممكن ايملك علي الفيس لكي نتكلم لان انا عندي شويه اساله ممكن

      حذف
  21. ان لم تشكر المخلوق لم تشكر الخالق شكراً لك اخي العزيز ولكن لم تفيدني لانها لاتنطبق مع القالب الخاص بي

    ردحذف
  22. أزال المؤلف هذا التعليق.

    ردحذف
  23. مدونة ممتازه

    ردحذف
  24. شكرا جزيلا لك و بارك االله فيك
    لقد استفدت حقا من زيارتي لمدونتك الرائعة

    ردحذف
  25. أزال المؤلف هذا التعليق.

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

    ردحذف
  27. تحياتي المتواضعة، والله لم تقصر أبدا

    ردحذف
  28. لاتعمل ماهذا مواضيعك اغلبها اخطاء

    ردحذف
  29. بجد أنا متابعك من فترة, ربنا يبارك فيك وينفعنا بعلمك ومواضيعك المحترمة

    ردحذف
  30. كيف اضيف ازرار المشاركة الجديدة كما هي عندك الآن

    ردحذف
  31. شكرا على الاضافة
    ادعوك لزيارة مرصدي
    www.arabicco.com

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

    ردحذف
  33. شكراً جزيلا لك أخي جلال البعداني يابن بلادي الغاليه.

    عندي إستفسار مدونتي أثناء تصفحها تظهر الصفحه ممدوده إلى اليسار، أريد أن أتخلص من هذه المشكله ، فبماذا تنصحني ؟

    هذا رابط مدونتي www.hdrmo.blospot.com

    ردحذف
  34. الله يجازيك شكرا لك

    ردحذف
  35. الله يجازيك شكرا لك شرح مبسط

    ردحذف