نصائح لاستخدام الصور في قالب اقرأ

قالب اقرأ ديسمبر 04, 2022 مارس 02, 2023
للقراءة
كلمة
نصائح لاستخدام الصور في قالب اقرأ

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

صورة الشعار

أفضل الأبعاد لصورة الشعار

لضمان أفضل عرض لصورة الشعار في أعلى المدونة ننصح باستخدام الأبعاد التالية: 250x120 في الإصدار الأول من القالب، وباستخدام 500x240 في الإصدار الثاني من القالب.

تعديل رابط الصورة

بعد أن تقوم بتحميل الشعار الخاص بك، سيكون رابط الصورة بالشكل التالي:

 https://blogger.googleusercontent.com/img/a/AVvXsEjPtlDDgR2RlrzZReCiPlRm43XkBEgKXWeBuK3NrWw-xmQ1wiJ73dlBnfbmLtcVq4I2nJ6_E9HM2icgRZlqOgoKjuyZoVW4ZdFm-svyLcs2SvjsynIecc0hlssnIKdhTeBmL8f9UnI3tFKqkJ9aS9fTYpIEjbDaBj8ruAj2ZMEiM8nwbndMNZWRjQk8uw=s250-كود html-

قم بإضافة -rw-e360 إلى نهاية الرابط ليصبح بالشكل التالي:

https://blogger.googleusercontent.com/img/a/AVvXsEjPtlDDgR2RlrzZReCiPlRm43XkBEgKXWeBuK3NrWw-xmQ1wiJ73dlBnfbmLtcVq4I2nJ6_E9HM2icgRZlqOgoKjuyZoVW4ZdFm-svyLcs2SvjsynIecc0hlssnIKdhTeBmL8f9UnI3tFKqkJ9aS9fTYpIEjbDaBj8ruAj2ZMEiM8nwbndMNZWRjQk8uw=s250-rw-e360-كود html-

 خطوات تغيير صورة الشعار

 لتغيير صورة شعار قالب اقرأ عليكم باتباع الخطوات التالية وفق الصور:

تغيير صورة الشعار في قالب اقرأ


تغيير صورة الشعار في قالب اقرأ


تغيير صورة الشعار في قالب اقرأ

بعد أن تضغط على زر الحفظ تعود وتضغط على تعديل الأداة مرة ثانية (زر القلم)، لتقوم بتعديل رابط صورة الشعار كما هو مذكور في الأعلى، لاحظ الصورة:

تغيير صورة الشعار في قالب اقرأ

الصور داخل المقال

تحويل الصور لصيغة webp

لضمان عدم التأثير السلبي للصور على أداة المدونة وسرعتها وفهرستها ننصحكم بتحويل جميع الصور التي ترغبون بتحميلها على المدونة إلى صيغة webp.

ولهذا الغرض ننصحكم باستخدام الأداة التالي: Squoosh

 وننصحكم بأن تقوموا بضبط خيارات التحويل في الأداة بالشكل التالي:

إضافات لرابط الصورة

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

<img border="0" data-original-height="489" data-original-width="301" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwPrnjki2OcCmoDaaZ3Cbj17gKP3_dkLoqp0fJMXVZSpyO6bl_t_UopETKvKmN-YtYxh8-qYx-yOZYnDlaVL6zHTy1sIcuOiEM1IvkEIFbXPEEc2Gjl5icnHB0UJ5LUl4q29O6Stn4pIUl873XfkkcQeK2tRnVNU5sYElgzb5AsIt0TAXqPw06ZK2F/s320/convert-image-to-webp.webp" width="197" />-كود html-

هنا بعض التعديلات التي ننصحكم بالقيام بها:

  1. أن تجعلوا الطول "height" مساوياً للطول في "data-original-height"
  2. أن تجعلوا العرض "width" مساوياً للعرض في "data-original-width"
  3. أن تقوموا بتحويل s320 الموجود داخل رابط الصورة إلى s16000-rw-e360

فيصبح الكود على الشكل التالي بعد إجراء التعديلات:

<img border="0" data-original-height="489" data-original-width="301" height="489" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwPrnjki2OcCmoDaaZ3Cbj17gKP3_dkLoqp0fJMXVZSpyO6bl_t_UopETKvKmN-YtYxh8-qYx-yOZYnDlaVL6zHTy1sIcuOiEM1IvkEIFbXPEEc2Gjl5icnHB0UJ5LUl4q29O6Stn4pIUl873XfkkcQeK2tRnVNU5sYElgzb5AsIt0TAXqPw06ZK2F/s16000-rw-e360/convert-image-to-webp.webp" width="301" />-كود html-

أفضل الأبعاد لصورة الغلاف

تم تخصيص صورة الغلاف في قالب اقرأ بالمزيد من الاهتمام، ولضمان أفضل عرض له ننصح باستخدام الأبعاد التالية: 1500x900

وصورة الغلاف هي الصورة الأولى في المقال.

إضافة النص البديل alt ونص العنوان title

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

الصورة البديلة

وطبعاً جميع النصائح التي ذكرناها هنا عن صورة المقال تنطبق أيضاً على رابط صورة الغلاف، وهي:

الأبعاد المناسبة 15000x900

إضافة s16000-rw-e360 لرابط الصورة

وقد تطرقنا لطريقة تغيير الصورة البديلة في مقال آخر، يمكنكم الوصول إليه بالضغط هنا.


شارك المقال لتنفع به غيرك

قالب اقرأ

الكاتب قالب اقرأ

قالب بإمكانات عالية وميزات رائعة بالرغم من كونه بسيطاً ومريحاً للقارئ وصاحب الموقع نفسه. facebook twitter instagram youtube telegram whatsapp email

قد تُعجبك هذه المشاركات

4419914284293787151
https://www.iqraatech.net/