طريقة جعل صورة الموضوع فوق السيدبار والموضوع

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

• معاينة

شرح طريقة التركيب
1. ابحث عن  وضع الكود التالي فوقه

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

3. المرحلة بعد الأخيرة وقد يختلف كل قالب عن هذا الكود: 

 إذا وجدته ضع الكود الآتي أسفله 
للقوالب المعدلة إبحث عن هذا 

 : أو هذا : 

 

* إذا واجهت صعوبة في إيجاده فأدعوك لمراسلتي برابط موقعك عبر مراسلتنا وسأرد عليك بمكانه

وصلنا للمرحلة الأخيرة من فضلك تذكر أنه يجب أن تكون صورة الموضوع ذات مقاس معقول أي لا تكون صغيرة وهذا المقاس الأفضل 720px x 350px ويفضل أن لا يتعدى حجمها 100kb. 
4. الآن عندما تفتح موضوع إنتقل لتبويب HTML واحذف ما به من كتابة إذا وجدتها ثم إرفع الصورة واختر الحجم الأصلي بعدما تضاف أحذف الكودات المحددة بالأحمر :

border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3AEeNC9sLQn1guq9wsHTVOGqe78M4vqD-OVhaKfnf5KKFwP6hrKH7gv_hSxzrXzHuk7qhYr5IA4tpEDWt9Ja8-TO_Q9Q7vxDqd1Ui9_xa3WhOtWRZ280wjB-Usu1dnb9NQ0LllQJrP5g/s1600/Pop-out-widget.png" />

بحذف رابط الصورة والإطار سيصبح هكذا :

ثم أضف الكود : id = "items-thumbnail" بعد

id = "items-thumbnail" class="separator" style="clear: both; text-align: center;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3AEeNC9sLQn1guq9wsHTVOGqe78M4vqD-OVhaKfnf5KKFwP6hrKH7gv_hSxzrXzHuk7qhYr5IA4tpEDWt9Ja8-TO_Q9Q7vxDqd1Ui9_xa3WhOtWRZ280wjB-Usu1dnb9NQ0LllQJrP5g/s1600/Pop-out-widget.png" />

* طبعا إن كان لديك مواضيع كثيرة فيمكنك فقط نقل الكود الآخير وتغييره بما لديك حتى لا تتكبد العناء ولا تنسى نسخ الصورة ووضعها بدل مكان المحددة بالأخضر
انتهى الموضوع والشرح... ومرحبا بالإستفسارات