استخدام الصور في مدونتك بذكاء يُسهم في تحسين تجربة المستخدم داخل الموقع، ويُساعد على عرض المحتوى أو إيصال الفكرة بشكل أوضح وأكثر جاذبية. لكن في المقابل، يمكن أن يؤدي استخدام الصور إلى زيادة حجم صفحات الموقع، مما يبطئ سرعة التحميل ويؤثر على الأداء العام.
للذلك، سنتعلم في هذا المقال كيفية إضافة الصور إلى تدوينات ووردبريس بطريقة صحيحة واحترافية، دون التأثير السلبي على سرعة الموقع أو حجم الصفحات. إضافًة إلى تحسينها إلى محركات البحث.
كيفية إضافة الصور إلى ووردبريس
توجد عدة طرق يمكنك الاعتماد عليها لرفع الصور داخل تدويناتك، وتختلف نسبيًا حسب أداة بناء الصفحات التي يعتمد عليها موقعك. لذلك، سنستعرض في الفقرات التالية أبرز الطرق المستخدمة لإضافة الصور إلى تدوينات ووردبريس، مع شرح مبسط يساعدك على اختيار الأنسب لأسلوب عملك.
إضافة الصور في محرر ووردبريس Block Editor
يُعد محرر Block Editor أو Gutenberg المحرر الرئيسي في الإصدارات الأخيرة من ووردبريس، وهو الأكثر استخدامًا في مواقع ووردبريس. يمكنك بسهولة إدراج الصور في محرر جوتنبرج من خلال التوجه إلى صفحة المقال، ثم تحديد موضع الصورة المطلوبة، والضغط على زر "إضافة"، ثم اختيار ودجت "صورة" كما هو موضح في الصورة التالية:
بعد ذلك، يمكنك رفع الصور داخل المقال مباشرة من جهازك، أو اختيارها من مكتبة الوسائط، أو إدراجها عبر رابط مباشر (URL). على سبيل المثال، يمكنك رفع صورة من جهازك بالضغط على زر "Upload".
كما يمكنك سحب الصورة من جهازك وإفلاتها داخل نافذة الوسائط مباشرة، أو الضغط على زر "تحديد الملفات" لاختيار الصورة من جهازك يدويًا.
بمجرد رفع الصورة على الموقع، ينبغي تحسينها لمحركات البحث، وذلك من خلال تعديل النص البديل (وهو النص الذي يظهر في حال تعذر تحميل الصورة في متصفح المستخدم)، ثم إدخال الكلمات التوضيحية والوصف المناسب. ويُفضل أن يتضمن كل من: النص البديل، والكلمات التوضيحية، والوصف الكلمة المفتاحية الرئيسية المستهدفة في المقال بشرط ألّا يؤثر ذلك على وصف الصورة الأساسي أو يشوّه معناها.
بعد ذلك، يمكنك تخصيص مظهر الصورة من حيث نسبة الأبعاد، أو ضبط العرض والارتفاع يدويًا، بالإضافة إلى اختيار طريقة عرضها داخل الصفحة (كالحجم الكامل، أو المتوسط، أو المصغر).
كما يمكنك الانتقال إلى تبويب "التنسيقات" من القائمة العلوية، لتخصيص إعدادات إضافية للصورة، مثل: الإطارات، الهوامش، الظلال، وغيرها من الخيارات التي تساعد في عرض الصورة بشكل واضح ومتناسق مع هوية موقعك.
إضافة الصور في محرر محرر ووردبريس الكلاسيكي (Classic Editor)
لا يزال العديد من أصحاب المدونات يفضلون استخدام محرر ووردبريس الكلاسيكي (القديم)، نظرًا لسهولة التعامل معه، وطريقة إدراج الصور فيه لا تختلف كثيرًا عن محرر جوتنبرج. بخطوات بسيطة، يمكنك تحديد موضع الصورة المناسب داخل المقال، ثم الضغط على زر "أضف ملفات وسائط" من الشريط العلوي.
بعد ذلك، يمكنك رفع الصورة من جهازك، أو اختيارها مباشرة من مكتبة الوسائط إذا كانت قد رُفعت مسبقًا. ثم أدخل النص البديل، والعنوان، والكلمات التوضيحية، والوصف تمامًا كما في محرر جوتنبرج.
لكن يختلف تخصيص الصور في المحرر الكلاسيكي عن جوتنبرج، إذ يتم تعديل الحجم، وإعدادات الرابط، والمحاذاة من داخل مكتبة الوسائط نفسها. وبعد الانتهاء، اضغط على زر "إدراج في المقالة" ليتم إدراج الصورة في الموضع المحدد داخل المقال.
إضافة الصور إلى مكتبة الوسائط على ووردبريس
إذا رغبت في إضافة مجموعة من الصور دفعة واحدة، يمكنك ببساطة رفعها مباشرة إلى مكتبة الوسائط، ثم إدراجها لاحقًا تدريجيًا في المواضع المناسبة داخل المقالات أو الصفحات. توجه إلى تبويب "وسائط" من القائمة الجانبية في لوحة تحكم ووردبريس، ثم اضغط على زر "Add Media File" كما هو موضح في الصورة التالية:
بعد ذلك، اضغط على زر "تحديد الملفات" واختر جميع الصور المطلوبة من جهازك. كما يمكنك استخدام خاصية السحب والإفلات مباشرة داخل مربع الوسائط.
بمجرد رفع الصور إلى مكتبة الوسائط، ستصبح متاحة داخل الموقع. وحين تتوجه إلى المقالة التي ترغب في تضمين الصور بها، ثم تختار مكتبة الوسائط، ستجد جميع الصور التي تم رفعها، لتتمكن من إدراجها مباشرة داخل المقال، كما يظهر في الصورة التالية:
كيفية تحسين الصورة على موقعك
يُعد حجم الصور من أبرز العوائق التي تؤثر على حجم الصفحات، وبالتالي يؤدي إلى بطء تحميلها. وكلما زاد عدد الصور في الصفحة، ازداد حجمها، مما ينعكس سلبًا على تجربة المستخدم. لذلك، من الضروري ضغط الصور وتحسينها لضمان أداء مثالي وسرعة تحميل عالية على مدونتك.
توجد عدة طرق للقيام بذلك، مثل استخدام الأدوات الخارجية. وأشهرها أداة TinyPNG، حيث يمكنك زيارة الموقع الرسمي ورفع الصور عليه ليتم ضغطها تلقائيًا دون التأثير على جودتها.
ورغم فعالية هذه الأداة، إلا أن من أبرز عيوبها أنها تتطلب تدخلاً يدويًا لرفع كل صورة بشكل منفصل داخل المقال. لهذا السبب، فضلت في مواقع عملائي الاعتماد على إضافات ووردبريس المتخصصة في تحسين الصور، مثل إضافة Smush Image Optimization.
إضافة Smush Image Optimization
لتثبيت الإضافة، انتقل إلى لوحة تحكم ووردبريس، ثم إلى تبويب "إضافات" ثم "أضف إضافة جديدة". وابحث عن Smush Image Optimization، ثم ثبّتها وفعّلها.
بعد التفعيل، يمكنك البدء بإعداد الإضافة. إما من خلال المُعدّ التلقائي، أو بالدخول إلى إعداداتها عبر تبويب "Smush" في القائمة الجانبية. اضغط على زر "Begin Setup" لبدء الإعداد.
في البداية، فعل خيار "Automatically optimize new uploads". ليتم ضغط الصور التي تُرفع مستقبلاً إلى الموقع بشكل تلقائي دون أي تدخل يدوي، ثم اضغط على "Next" لمتابعة الإعدادات.
بعدها، فعل خيار "Enable Super Smush" لضغط الصور لأقصى درجة ممكنة دون التأثير على جودتها.
ويُفضل أيضًا تفعيل خيار "Strip my image metadata". والذي يعمل على حذف بيانات EXIF غير الضرورية مثل تاريخ التصوير، وأبعاد الصورة، والتوقيت، بهدف تقليل حجم الصورة قدر الإمكان.
كما أعتمد في مواقعي على تفعيل خاصية "Enable Lazy Loading". وهي ميزة تتيح تحميل الصور تدريجيًا أثناء تصفح الزائر للمقال، ما يقلل من حجم الصفحة عند تحميلها. ويُحسن سرعة التصفح بشكل ملحوظ، بدلاً من تحميل كافة الصور دفعة واحدة.
بعد الانتهاء من الإعداد، تعمل الإضافة تلقائيًا على فحص الصور القديمة في الموقع. انتظر حتى يكتمل الفحص، ثم اضغط على زر "ضغط دفعة واحدة" ليتم تحسين جميع الصور السابقة على الموقع تلقائيًا.
عند الانتهاء من المعالجة، لاحظت أن حجم الصور انخفض بنسبة 72% تقريبًا دون أي تأثير ملحوظ على الجودة.
بهذه الطريقة، يمكنك تعزيز مقالات مدونتك التسويقية باستخدام صور توضيحية جذابة. والتي تساعد على جذب انتباه الزوار وتوضيح المعلومات بشكل أكثر فاعلية. دون التأثير على سرعة الموقع أو حجم الصفحات. مع الاستفادة من خيارات التحسين التلقائي التي تعالج الصور الجديدة تلقائيًا.