إضافة: تكبير مصغرات صور بلوقر مع الحفاظ على جودتها !

إضافة: تكبير مصغرات صور بلوقر مع الحفاظ على جودتها !

تكبير مصغرات صور بلوقر
هذه إضافة بسيطة وهامه لتكبير مصغرات صور بلوقر التي عادة نحتاجها في كثير من الإضافات الأساسية مثل إضافة المواضيع ذات العلاقة أو إضافة المواضيع الشائعة وغيرها - وذلك بدون أن يؤثر على جودة الصوره وبالتالي يمكن تكبير خصائص CSS للوسم img بدون تشوه إن شاء الله.
مصغرات بلوقر دائماً تكون بمقاس 72 بيكسل ولذلك تجد العامل ( s72-c ) في رابط الصوره ، الإضافة تقوم باستبدال هذه القيمة الى ( s200-c ) وهذه القيمة التي افترض أنها الأفضل غالباً ولكن يمكن تغييرها ....




صورة توضح تأثير الإضافة


تكبير مصغرات صور بلوقر



شرح تركيب الإضافة لمدونات بلوجر

الطريقة إن شاء الله يسيره ومباشره ولكن تذكر أن الإضافة تكون دائماً بعد الإضافة الأساسية

  • توجه الى " لوحة التحكم " ثم اختر التبويب " قالب "
  • ثم اختر " تحرير HTML "
  • تأكد أن المؤشر مفعل داخل محرر القالب.
  • اضغط : ctrl+F سيظهر مربع البحث الخاص بمحرر القالب.
  • ابحث عن نهاية الوسم body  أي عن "   </body>
  • انسخ كود الإضافة قبل هذا الوسم مباشره.
  • قبل أن تحفظ القالب تأكد من أن الإضافة الأساسية التي تريد تطبيق التأثير عليها متموضعه قبل هذه الإضافة؟
  • احفظ وجرب .


كود الإضافة والتحكم بها

الكود:

<script type='text/javascript'>
// Thumbnail re-sizer by alblogger.com
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("Div_ID");
theText = bodyText.innerHTML;
theText = theText.replace(/s72-c/g, "s200-c");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>



  • يجب أن تستبدل Div_ID بمعرف القسم الذي يحتوي الإضافة الأساسية أي ID الخاص يـ DIV الإضافة والا لن يكون هناك أي تأثير.
  • ثم ان شئت تغيير الحجم استبدال s200-c بما يناسب تصميم مدونتك.


أي استفسار ممكن كتابته هنا وليس في الفيسبوك فغالباً أتابع المدونة من خلال البريد



تحياتي العاطرة 


التعليقات: 20

Mohemed Ahmed 3nan يقول... 3 يناير 2014 في 4:51 ص

تسلم ويسلم مجهودك يا فندم ودوما تفيدنا بالافضل ...خالص احترامى وتقديرى على الدوام ت4

Jaser Alharbi يقول... 3 يناير 2014 في 8:47 ص

سلمك الله أخي محمد ، ولك تحية ومثلها معها ب8

The Best يقول... 9 يناير 2014 في 12:03 م

أخي ما عرفت آشغلها لو سمجت تفهمي حقت Div ID لم افهم

Jaser Alharbi يقول... 10 يناير 2014 في 8:44 ص

حياكم الله ..

@the best:

أخي ما أقصده هو معرّف الموضع الذي فيه الصور التي تريد تطبيق التأثير عليها ، هي قد توجد في أي مكان ، فإذا كانت الصور مثلاً عندك موجوده في قسم div له المعرّف Best فتكتب كلمة Best بدلاً من Div_Id وهكذا ..
وبتعبير آخر هو إرشاد الإضافة الى موضع الصور المستهدفه التي لها عنوان محدد ( معرّف ) ...

تحاياي

Unknown يقول... 11 يناير 2014 في 6:38 ص

الصراحة مافهمت يالتي آخي تعطيني حسابك الفيس بوك واكلمك ياريت وشكرا

Unknown يقول... 11 يناير 2014 في 6:41 ص

أنا هذا انا THE BEST نسي انا أخي أريد حسابك عشان آكلمك مافهمت وشكرا آخي

Jaser Alharbi يقول... 12 يناير 2014 في 1:40 م

عزيزي

ابعث لي القالب مضغوطاً عبر نموذج الاتصال واكتب لي موضع الصور التي تريد تطبيق التاثير عليها وساقوم بعمل اللازم، حينها يمكنك المقارنه وفهم الاضافه.

admin يقول... 20 يناير 2014 في 3:27 م

والله الموضوع رائع حياك الله كنت ابحث عنها من مدة بس وجدت الحل قبل طرح الموضوع لكن مع ذلك موضوعك مفيد جدا :)

غير معرف يقول... 3 فبراير 2014 في 2:05 ص

شكرااااااااا
صورة وبرنامج
تحميل برنامج فايبر
صور بنات
هوت سبوت شيلد

Anas يقول... 19 أبريل 2014 في 4:43 م

لعبة متصفح

Admin يقول... 28 يوليو 2014 في 3:25 ص

موضوع رائع تحياتي لك
http://fatburningsecretss.blogspot.com

9-digg يقول... 19 ديسمبر 2014 في 9:49 م

شكرااااااااااا
اقدم لكم موقعي الثاني يعتبر الاول موقع تواصل اجتماعي بعد الفيسبوك وشبيها للفيسبوك 87بالمئة
اول موقع تواصل اجتماعي عربي وبجميع لغات العالم
http://dzgo.co/

غير معرف يقول... 13 يناير 2015 في 8:34 م

انا عاوز اطبق الاضافة على كل الصور داخل المشاركات اعمل ايه

Ahmed Jamal يقول... 20 مارس 2015 في 8:33 ص

السلام عليكم , اخي انا ما اعرف Dev_id الخاص بي , من فضلك هل ارسل لك القالب وتبحث عنه لي ؟ ارجوك لاني محتاجه بشدة

Unknown يقول... 20 مارس 2015 في 11:06 ص

شكرا اخي تم التعرف علي dev_id

مشكور مرة اخري

مبدع الشروحات يقول... 21 مارس 2015 في 2:56 م

شكرا
http://mobdi3explain.blogspot.com

Unknown يقول... 19 يونيو 2016 في 6:26 ص

معلش كده تعديل div صح ولا ازاي لان المعرف ده هو الرابط بتاع القسم ولا الجزء الاخير منه
script type='text/javascript'>
window.setTimeout(function() {
document.body.className = document.body.className.replace(&#39;loading&#39;, &#39;&#39;);
}, 10);
</script>
<script type='text/javascript'>
// Thumbnail re-sizer by alblogger.com
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("Div_p/blog-page.html");
theText = bodyText.innerHTML;
theText = theText.replace(/s72-c/g, "s200-c ");
bodyText.innerHTML = theText;
}replaceText();
//]]>

Jaser Alharbi يقول... 20 يونيو 2016 في 12:54 ص

السلام عليكم

لا هذا غير صحيح بالمره ، المطوب كتابة معرف القسم أي ID القسم، والمقصود بالقسم هو الجزء أو المساحة التي تتواجد فيها المصغرات ...

المسالة تتطلب معرفة بسيطة بميادئ HTML و CSS ع2

shahad abdalrahman يقول... 31 يناير 2017 في 6:52 م

يجب أن تستبدل Div_ID بمعرف القسم الذي يحتوي الإضافة الأساسية أي ID الخاص يـ DIV الإضافة والا لن يكون هناك أي تأثير.



لم افهم للاسف و حتى من خلال ردودك للاخوه الكرام ..
الصور لدي بالمدونة كبيرة الحجم و عندما اصغرها تتغير الجودة
و لم اعرف الحجم المناسب و الجودة المناسبة

ارجوا مساعدتي في اقرب وقت خصوصا ان المدونة مرتبطه مع مجموعة من الناس

Jaser Alharbi يقول... 5 فبراير 2017 في 9:08 ص

.

الفكرة بسيطة وهو أن أي تطبيق لتأثير جافاسكريبت على أي قسم في صفحة الويب ، يتطلب معرّف هذا القسم

بالنسبة للصور في بلوجر تعتمد على مفتاح المقاس في رابط الصوره ، فميلاً s600 أكبر من s400 و s0 يؤدي إلى اظهار الصورة بحجمها الطبيعي ... أرى أن حل المشكلة يبدأ من مصدر الصورة ليس فقط للتنسيق بل حتى لا تحتسب مساحة مسجلة في حسابك ...


أعتذر للتأخر فأنا بعيد عن بلوجر حالياً

إرسال تعليق