44
لم يتم العثور على الصفحة ! معذرة، فالصفحة التي تبحث عنها في هذه المدونة ليست متوفرة. رئيسية المدونة

الأربعاء، 29 ديسمبر 2010

حصريا! إضافة الصور في تعليقات مدونات بلوجر

السلام عليكم ورحمة الله تعالى وبركاته ،كلنا نعلم بأن وضع الصور في صندوق التعليقات شيء مستحيل على مدونات بلوجر ،لكن اليوم سوف أعرض عليكم حيلة جميلة من إجتهادي والحمد لله ولأول مرة علي مدونات بلوجر ،جاءتني هذه الفكرة يوم تصميمي للأيقونات الزرقاء لعرض الإبتسامات في التعليقات ،فقلت لنفسي لماذا لا أستغل هذه الخاصية الجميلة لأستطيع وضع صور بالقياسات التي أريد ،كرسالة شكر وترحيب وغير ذلك... ،نجد هذه الأنواع من الصور كثيرا على المنتديات ،فلماذا لا تكون علي مدونات بلوجر .وأظن أنكم لاحظتم ذلك في إجابتي علي بعض التعليقات ,وقبل أن نبدأ في شرح الخاصية الجديدة ،ألق نظرة على التعليقات في هذا الموضوع للمعاينة .
1.سوف نضع لهذه الصور رموز ،وعند كتابتك للرمز سوف تظهر لك الصورة المخصصة لها .
2.لقد قمت بالتعديل علي كود جافا سكريبت المسؤول عن هذه الخاصية وذلك بإضافة عدة صور بقياساتها الأصلية .
3.وهذا مثال على أحد الأسطر الموجودة بالكود جافاسكريبت حيث يضم رابط الصورة ورمزها وكذلك قياسات الطول والعرض.
 _str = _str.replace(/f\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_cTTZv2576FLqsx1wBW0b_5YmQU0-fBR4KZoT8UDNGUZD7gnkHUGmikVZbyQv5l59-dQUussth0ZwRTHpONGoqxwInPtg9XVNAQuE6wxrHfxTJYqDmSapBlOLTfMBc-kXMgRls8GZdwQ/s1600/merci.jpg ' alt='' height='290' width='379'  class='smiley'/>");
*يمثل مالون بالأحمر  رمز الصورة, التي تكتب في التعليق
*يمثل مالون بالأزرق رابط الصورة المراد وضعها في تعليقك  .
*يمثل مالون بالأخضر قياسات الصورة المراد وضعها في تعليقك .


    ولإضافتك لهذه الخاصية في مدونتك ،
    انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.
    قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).
    </body>
      ثم قم بوضع الكود التالي قبله :
    <script src='http://abu-iyad.googlecode.com/files/abuiyadSmileythanks4.js' type='text/javascript'/><noscript><a href='http://www.abu-iyad.com'>Onion</a><a href='http://www.abu-iyad.com'>smiley</a></noscript>
    يمثل ما لون بالأحمر رابط الكود جافاسكريبت الذي قمت بالتعديل عليه ورفعه على السرفر الخاص بي على موقع "جوجل كود " لذلك فإستعماله صالح مدى الحياة.

    -بعد تطبيقك لللأداة ،الآن تحتاج للرموز لكي تكتبها في تعليقك وتظهر لك الصورة الموافقة لها .

    هذا الجدول يبين كل صورة والرمز المطابق لها :

    الصورة الرمز  الصورة الرمز
    يتم كتابة الرموز من اليمين نحو اليسار لتظهر

    A(
    B(
    C(
    D(
    E(
    F(

    الآن سوف نتعرف على طريقة  تغيير الصور في حالة رغبتك في ذلك .
    • الطريقة الأولي :
    1.قم بتحميل الملف جافاسكريبت (وهو الرابط ذا اللون الأحمر في الكود السابق) من هنا
    2.قم بفتح الملف بمحرر النصوص "وورد باد" .Wordpad
    3.قم بالبحث عن أحد روابط الصور التي عرضناها سابقا (سوف تجد منه إثنين)
    4.قم بإستبدالهما برابطين للصورة التي تريد،ولا تنسي تعديل قياسات الطول والعرض لتحافظ على جودة الصورة.
    5.يمكنك كذلك تعديل رموز الصور بالرمز الذي تريد وهو ما لون باللون الأحمر في الكود الأول .
    6.عند الإنتهاء من عملية التعديل علي الصور والرموز والقياسات ،قم برفع الملف على السرفر الخاص بك.(أفضل أن تقوم بتحميل الملف علي أحد الموقعين ،جوجل سايت أو جوجل كود)
    7.قم بإعادة لصق رابط الملف الذي قمت بتحميله في الكود السابق مكان الرابط ذا اللون الأحمر .
    8.قم بحفظ القالب ثم توجه للمعاينة

    الطريقة الثانية :هذه الطريقة لا تحتاج رفع ملف الجافا سكريبت على السرفر الخاص بك
    1.سوف تقوم بنفس خطوات الطريقة الأولى ،حتى المرحلة 5
    2..توجه للكود الذي قمت بلصقه قبل الوسم <body/>،ثم قم بتحديده كاملا وإستبدله بهذا الكود ،ثم توجه للكود جافاسكريبت الذي عدلت عليه ثم حدده كاملا  ثم أضفه في المكان الخصص له في الكود أسفله.
    <script type='text/javascript'>
    //<![CDATA[
    ألصق كود الجافاسكريبت هنا
    //]]>
    </script>
    وأخيرا قم بحفظ القالب ،ومبروك عليك الصور في صندوق التعليقات ،أتمنى أن تنال إعجابكم.

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

    1. أضافة رائعة مثل سابقيها , ولكن ستأخذ مساحة كبيرة جدا . يمكن تغيير الصور بمقاسات أصغر أو عبارات جاهزة ؟

      ردحذف
    2. ابو اياد انت عبقرى :x

      B(

      ردحذف
    3. اظنك من مواليد اينشتاين ماشاء الله بارك الله فيك
      D(

      ردحذف
    4. لاكن كيف اضع خاصيت اخفاء التعلييقات لسرعة المدونة؟؟؟
      انشاء الله ربي يوفقك في الدنية والآخرة
      معاك صاحب مدونة لطخات
      B(

      ردحذف
    5. أشعر أن هناك إصراراً ما في جعل المدونات نسخه مشوه من المنتديات التى مللنا من أسلوبها، وياخوفي بكرة يكون في هاك الشكر لمدونات blogger!

      لكن هذا لا يمنعني من شكرك على الإضافة ومجهودك المميز في تعديلها، بارك الله فيك.

      ردحذف
    6. ;)) ماشاء الله مجهود في غايه الروعه
      جزاك الله خير دائما متميز

      ردحذف
    7. موضوع جميل اوي

      A)

      إن شاء الله اجربه

      ردحذف
    8. @أبو إياد
      اعرف اخي ابو اياد لاكن كيف تجعله بهذا الطريقة التي لديك ؟
      وآسف على الإزعاج

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

      ردحذف
    10. اريد فهم فكرة اضافة فديو لانني عندي مدون تعليمية واريد اضافة فيدوهات للتعليم لهذا اريد درس في هذا المجال

      ردحذف
    11. @nada alyasmine
      لفتح الملف جافاسكريبت يجب إستعمال محرر النصوص wordpad وذلك بالضغط على الملف بيمين الماوس ثم ouvrir avec ثم application wordpad

      ردحذف
    12. @nada alyasmine
      إذا كنت تقصدين وضع فيديو من يوتوب على مدونتك ،فالأمر بسيط ،إضغطي على الزرintegrer الموجود تحت الفيديو ،سوف يظهر لك الكود؛قومي بنسخه ولصقه في تحريرhtml لرسالة بمدونتك ،هذا كل شيئ

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

      ردحذف
    14. طريقة راااااائعه جدا سوف اقوم بتطبيقها

      شكرا لك

      ردحذف
    15. عبد الكريم جليد8 يناير 2011 في 10:31 م

      @أحمد عبدالمنعم
      صحيح والله صدقت أخي أحمد
      هكذا ستفقد المدونات نكهتها البسيطة وتصبح منتديات مصغرة

      ردحذف
    16. شكراااااااا لمجهودك الرائع
      لأول مرة أرى المدونة وأسجل إعجابى الشديد لما فيها من معلومات قيمة


      A(

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

      ردحذف
    18. جزاك الله كل خير أخي الكريم أبو إياد ..

      نفع الله بك وبارك فيك ..

      تقبل مروري ..

      أخوك / عمر

      ردحذف
    19. شكراً على مجهودك الرائع تسلم يدك وجزاك الله خير
      )):

      ردحذف
    20. شكررررررررررررررررا :)

      ردحذف
    21. تسلم الايادي ابو اياد حلو طبقتة بس لازم احفظ الاكواد ما سوفتظهر كاداة صح

      ردحذف