تحديث: اقرأ المزيد وعرض المصغرات بدون جافا سكربت

تحديث: اقرأ المزيد وعرض المصغرات بدون جافا سكربت

السلام عليكم ورحمة الله وبركاتة , اخيرا بعد معاناة الكثيرين من اصحاب المدونات الذين قامو بتركيب اضافة اقرا المزيد وعرض مصغرات الصور  وما سببته تلك الاضافه من ثقل في تحميل الصفحه ولكن رغم ذلك لم يستغني عنها احد ومنهم انا لما تضفيه تلك الاضافه من مظهر جمالي واحترافي للمدونه بنفس الوقت . اليوم مع تحديث  لتلك الاضافه بخطوات بسيطه جدا وبدون جافا سكربت التي تسبب ثقل في فتح المدونه سنقوم معا بتطبيق الشرح التالي .
ملاحظه : اصحاب الاضافه القديمه عليهم حذفها وذلك باتباع نفس الشرح الذي قامو فيه بتركيب تلك الاضافه ومن ثم تطبيق الشرح التالي  : قم بالدخول الى لوحة تحكم مدونتك ثم الي القالب ثم تحرير html ثم ابحث عن الوسم التالي ]]></b:skin> 
من يريد ظهور صوره الموضوع علي اليمين عليه وضع الكود التالي قبل الوسم السابق
.post-thumbnail{float:right;margin-left:20px} 
ومن يريد عرض الصوره على اليسار عليه وضع الكود الموجود في الاسفل قبل الوسم السابق
.post-thumbnail{float:left;margin-right:20px}
ثم البحث مجددا داخل القالب عن <data:post.body/>
ونستبدله بالكود الموجود في الاسفل
b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div>
<b:if cond='data:post.thumbnailUrl'>
<img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' width='72px' height='72px'/>
<b:else/>
<img class='post-thumbnail' alt='no image' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQFP0nM6wwmUTrBiNmY8dBQusP6eo3QvKAuL7HACu9uUV4wWjLEWmcD_CJ-O0ta9sAq02m1YYWjobW8zuKhgx52eS_nsXDWPOCRDrs7l295knbR3TbWuKbpeQzBPrwC2V1jw9sBoGS7EjK/' width='72px' height='72px'/>
</b:if>
<data:post.snippet/>
</div>
<div class='jump-link'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
<b:else/>
<data:post.body/>
</b:if>
قبل حفظ التغييرات يمكننا عمل معاينه للقالب ومشاهدة الصفحه الرئيسيه
 للمدونه .
ملحوظه: الاضافه تضع صوره افتراضيه للموضوعات التي لا تحتوى على صور بداخلها
وذلك حفاظا على الشكل الجمالي لتسلسل المواضيع .
يمكن التحكم في ابعاد الصوره من خلال القيم التاليه داخل الكود الاخير
 width='72px' height='72px
بالتوفيق للجميع .  

تعليقات

  1. اخي شاهين اعطيني مثال حى ان تكرمت لرابط في مدونتك قمت بتطبيق ما تفضلت به عليه حتى اشاهده بنفسي , فقد دخلت الموقع الذي تحدثت عنه لكن اكواد التضمين الخاصه به للمواقع الخارجيه تكاد تكون خاليه من التصميم مما يجعلها غير قابله للتجانب لذا ترى عند تكرار الكود لا يستقيم في صف افقي بل ينزلق للاسفل .!!

    ردحذف
  2. شكرا اخي احمد
    ويشرفني زيارتك لمدونتي المتواضعه
    ولا نبتغي منها الا رضاء الله ثم رضاء الوالدين وأحاول قدر استطاعتي ان اجتهد بها لانها جديدة العهد وأحاول التعلم من الاخرين قدر استطاعتي حتى نصل الى مانصب اليه من العلم النافع للجميع
    http://doktooor.blogspot.com/

    وسوف تجد القانتين في الاسفل
    فانا اريدهما بجانب بعض وليس اسفل بعض
    وكما ذكرت لك قمت بأستبدال كلمة center الى Left والى Right
    ولكن دون فائدة

    فطلبت المساعدة منك في وقت فراغك وشكرا

    ردحذف
  3. ارجوا من الله ان يكون التعليق الاخير ظهر لديك , مع تشريفك لزيارة المدونة بالرابط المنشور سابقاً

    وشكرا

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

    ردحذف

إرسال تعليق

اعلان وسط الصفحة 3