كيفية إضافة الصور بشكل صحيح في ووردبريس (خطوة بخطوة)

آخر تحديث بتاريخ نوفمبر 13, 2024

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

نضيف الصور لجعل محتوانا أكثر جاذبية بصريًا وأسهل فهم لقرائنا. لذلك، نختبر دائمًا نصائح وممارسات مختلفة لتحسين الصور.

لقد ساعدنا هذا في اكتشاف طرق لإدارة صور ووردبريس بشكل فعال.

في هذا المنشور، سنوضح لك كيفية إضافة الصور بشكل صحيح في ووردبريس، خطوة بخطوة.

أهمية رفع الصور بشكل صحيح في ووردبريس

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

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

نوصي بتسمية صورك بكلمات وصفية مفصولة بشرطات. على سبيل المثال، يمكنك استخدام اسم الملف ‘john-vacation-photo.jpg’ لصورة في مدونة السفر الخاصة بك.

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

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

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

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

يمكن أن يؤدي هذا إلى زيادة تصنيفات الموقع الإلكتروني الخاص بك وتحسين إمكانية الوصول إلى صفحات الويب الخاصة بك للأشخاص ذوي الإعاقة.

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

كيفية إضافة الصور في محرر الكتل (جوتنبرج)

يمكنك بسهولة إضافة الصور في محرر كتل ووردبريس باستخدام كتلة الصورة.

أولاً، افتح الصفحة أو المنشور الحالي أو الجديد الذي تريد إضافة صورة إليه.

بمجرد وصولك إلى هناك، انقر على زر “إضافة كتلة” (+) في أعلى يمين الشاشة لفتح قائمة الكتل. من هنا، ابحث عن كتلة “الصورة” وأضفها إلى المنشور أو الصفحة.

أضف كتلة الصورة إلى المنشور

بعد ذلك، انقر على زر ‘مكتبة الوسائط’ لفتح نافذة ‘تحديد أو تحميل الوسائط’ على الشاشة.

هنا، يمكنك الانتقال إلى تبويب ‘رفع الملفات’ إذا كنت ترغب في رفع صورة من جهاز الكمبيوتر.

ومع ذلك، إذا كنت تريد إضافة صورة من مكتبة الوسائط، فيمكنك أيضًا القيام بذلك بالتبديل إلى علامة التبويب ‘مكتبة الوسائط’.

إضافة الصور بكميات كبيرة باستخدام مكتبة الوسائط ووردبريس

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

يعد هذا النص البديل أساسي للسيو الصور، إذ يساعد محركات البحث على فهم سياق الصورة. كما يسمح لمستخدمي برامج قراءة الشاشة برؤية هذه المعلومات حول صورك.

يمكنك أيضًا إضافة “عنوان” و”تعليق توضيحي” لوصف الصورة في العمود الأيمن. التعليقات التوضيحية هي وصف نصي مرئي لصورك، بينما يظهر العنوان عند تمرير مؤشر الماوس فوق الصورة.

لمزيد من التفاصيل، قد ترغب في الاطلاع على دليل المبتدئين حول كيفية إضافة تعليقات توضيحية للصور في ووردبريس.

بعد ذلك، انقر على زر “تحديد” لإضافة الصورة إلى صفحتك أو منشورك.

املأ تفاصيل الصورة

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

إعدادات الصور في لوحة الكتل

للمزيد من التفاصيل، اطلع على درسنا التعليمي حول كيفية إضافة الصور ومحاذاتها في ووردبريس.

أخيرًا، انقر على زر “تحديث” أو “نشر” لحفظ إعداداتك.

أضفت الأن صورة إلى محرر جوتنبرج.

كيفية إضافة الصور في المحرر الكلاسيكي

إذا كنت لا تزال تستخدم المحرر الكلاسيكي القديم في ووردبريس، فيمكنك استخدام هذه الطريقة.

أولًا، عليك زيارة الصفحة أو المنشور الذي تريد إضافة الصورة إليه من لوحة تحكم ووردبريس. بعد ذلك، انقر على زر “إضافة وسائط” لفتح مكتبة الوسائط.

انقر فوق زر إضافة الوسائط

بعد ذلك، يمكنك الانتقال إلى تبويب “رفع الملفات” لرفع صورة من جهاز الكمبيوتر.

أو لإضافة صورة من مكتبة الوسائط، ما عليك سوى الانتقال إلى تبويب “مكتبة الوسائط”.

رفع ملف الصورة في المحرر الكلاسيكي

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

يمكنك ببساطة وصف الصورة لجميع هذه الخيارات. سيساعد هذا محركات البحث على فهرسة صورتك وتعزيز ترتيب موقعك لدي السيو.

ثم انقر على زر “إدراج في المقالة”.

تكوين تفاصيل المرفق في المحرر الكلاسيكي

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

من هنا، يمكنك تغيير محاذاتها باستخدام أيقونات المحاذاة أعلى الصورة. يمكنك تعديل الصورة بشكل أكبر بالنقر على أيقونة القلم الرصاص.

انقر على أيقونة القلم لتحرير الصورة

سيؤدي هذا إلى فتح نافذة “تفاصيل الصورة” على شاشتك، حيث يمكنك تغيير الحجم وإضافة سمات عنوان الصورة، وفئات CSS، والمحاذاة، والمزيد.

بعد الانتهاء، انقر على زر “تحديث” لحفظ التغييرات.

تعديل الصورة في المحرر الكلاسيكي

بعد ذلك، انقر ببساطة على زر “نشر” أو “تحديث” لحفظ منشورك.

إضافة الصور إلى مكتبة الوسائط ووردبريس

إذا أردت، يمكنك أيضًا إضافة صورة مباشرة إلى مكتبة الوسائط. تذكر أنه بعد إضافة صورة إلى مكتبة الوسائط، ستحتاج إلى فتح منشور أو صفحة وإدراج خانة “الصورة”.

لإضافة صورة من مكتبة الوسائط، انتقل إلى صفحة الوسائط » إضافة جديد من لوحة تحكم ووردبريس.

بعد ذلك، انقر على زر “تحديد الملفات” لرفع صورة من جهاز الكمبيوتر. ثم انقر على رابط “تحرير” بجوار الصورة.

أضف الصورة إلى مكتبة الوسائط وانقر على رابط التحرير

سينقلك هذا إلى صفحة “تعديل الوسائط”، حيث يمكنك البدء بتغيير عنوان الصورة. بعد ذلك، يمكنك التمرير للأسفل لإضافة نص بديل، وتعليق، ووصف.

بعد ذلك، يمكنك أيضًا النقر على زر “تعديل الصورة”.

انقر فوق زر تحرير الصورة

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

بمجرد رضاك، انقر على زر “تحديث” لحفظ التغييرات.

ميزات التحرير الأساسية في ووردبريس

سيعيدك هذا إلى صفحة “تعديل الوسائط”، حيث يتعين عليك النقر على زر “تحديث” مرة أخرى لحفظ إعداداتك.

لقد أضفت الأن صورة إلى مكتبة الوسائط بنجاح.

بعد ذلك، انتقل إلى المنشور الذي تريد إضافة هذه الصورة إليه من الشريط الجانبي لإدارة ووردبريس. بعد ذلك، انقر على زر “إضافة كتلة” (+) لإضافة كتلة “صورة” إلى المنشور.

بعد ذلك، عليك تحديد زر “مكتبة الوسائط”.

كتلة الصورة

سيؤدي هذا إلى ظهور نافذة “تحديد أو تحميل الوسائط” على شاشتك، حيث ستظهر الصورة التي رفعتها من مكتبة الوسائط في الأعلى.

عند تحديدها، ستجد أن عنوانها، ونصها البديل، وعنوانها، ووصفها قد أضيفت إليها من صفحة مكتبة الوسائط.

الأن، انقر ببساطة على زر “تحديد” لرفع الصورة إلى محرر الكتل.

إضافة صورة من مكتبة الوسائط

وأخيرًا، انقر فوق زر “نشر” أو “تحديث” لتخزين إعداداتك.

كيفية تحسين الصورة لـ سيو ووردبريس

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

وهنا يأتي دور إضافة AIOSEO (الكل في واحد سيو لووردبريس).

تعد هذه الإضافة أفضل إضافة سيو ووردبريس في السوق، إذ تسهل تحسين محتواك، بما في ذلك الصور، لمحركات البحث.

في DoctorMega، نستخدمها لتحسين ترتيبنا في محركات البحث، وقد حققنا نتائج رائعة. لمعرفة المزيد عن تجربتنا، يرجى الاطلاع على مراجعة AIOSEO.

أولًا، عليك تثبيت وتفعيل إضافة AIOSEO. لمزيد من التعليمات، يرجى الاطلاع على دليلنا خطوة بخطوة حول كيفية تثبيت إضافة ووردبريس.

ملاحظة: يتوفر إصدار مجاني من AIOSEO. مع ذلك، ستحتاج إلى الاشتراك في النسخة الاحترافية من الاضافة للاستفادة من ميزة السيو للصور.

بعد التفعيل، ستحتاج إلى تهيئة معالج الإعداد.

للمزيد من التفاصيل، راجع دليلنا حول كيفية إعداد All in One SEO لـ ووردبريس بشكل صحيح.

معالج إعداد AIOSEO

بعد ذلك، انتقل إلى صفحة All in One SEO » Search Appearance من الشريط الجانبي لإدارة ووردبريس، ثم انتقل إلى علامة التبويب ‘Image SEO’.

بعد ذلك، مرر للأسفل وانقر على زر ‘Activate Image SEO’ لتفعيل الميزة.

تفعيل وحدة السيو للصور في AIOSEO

ستتمكن الأن من رؤية إعدادات السيو للصور. ستجد هنا علامات تبويب مختلفة للعنوان، والنص البديل، والتسمية التوضيحية، والوصف، واسم الملف.

تكوين عناوين الصور التلقائية

بمجرد الانتقال إلى تبويب ‘Title’ في صفحة السيو للصور، يمكنك البدء بإنشاء تنسيق عنوان لصورك باستخدام العلامات الذكية.

ستنشئ هذه العلامات الذكية سمات عنوان لصورك تلقائيًا. هذا ما سيشاهده الزائر عند تمرير مؤشر الماوس فوق صورك.

على سبيل المثال، إذا كنت تريد أن يستخدم عنوان الصورة وعنوان الموقع في كل سمة عنوان صورة، فيمكنك إضافة هذه العلامات الذكية في حقل ‘Title Format’.

أضف وسوم ذكية لتكوين عنوان السيو

بعد ذلك، يمكنك أيضًا تمكين خيار Strip Punctuation إذا كنت تريد أن يقوم AIOSEO بإزالة بعض الأحرف تلقائيًا عند إنشاء عنوان صورة من اسم الملف.

على سبيل المثال، إذا كنت تستخدم الشرطات عند حفظ ملف صورة مثل “an-example-image”، فيمكنك اختيار خيار “شرطات (-)” في قسم “الأحرف المراد تحويلها إلى مسافات”.

بمجرد القيام بذلك، سيقوم AIOSEO تلقائيًا بإزالة هذه الشرطات وتحويلها إلى مسافات، مما يجعل عنوان الصورة “an example image”.

تكوين strip punctuation وخيارات casing

بعد ذلك، انتقل للأسفل إلى قسم “Casing”.

من هنا، يمكنك اختيار حالة عنوانك. نوصي باختيار ‘sentence case’ أو ‘title case’ لجعل عناوينك أسهل قراءة.

تكوين Alt Tags التلقائية

بعد ضبط إعدادات العنوان، انتقل إلى تبويب “Alt Tag” من الأعلى.

من هنا، يمكنك استخدام العلامات الذكية بجوار خيار ‘Alt Tag Format’ لإنشاء نص بديل تلقائيًا لجميع صورك.

بعد ذلك، يمكنك أيضًا تفعيل إعداد ‘Strip Punctuation’ إذا كنت تريد تحويل أحرف مثل الشرطات (-) أو الشرطة السفلية (_) إلى مسافات.

إعدادات السيو لوسم alt

وبالمثل، إذا كانت هناك أحرف مثل الأرقام أو علامات الجمع (+) لا ترغب في أن يزيلها AIOSEO عند إنشاء النص البديل، فيمكنك تحديد المربعات المخصصة لهذه الخيارات في قسم ‘Characters to Exclude from Being Stripped’.

يمكنك أيضًا تحديد حالة الأحرف لنصك البديل.

تكوين التسميات التوضيحية والأوصاف التلقائية

لإنشاء تسميات توضيحية تلقائية لصورك، انتقل إلى تبويب ‘Captions’.

ثم تأكد من تفعيل خيار ‘Autogenerate Caption on Upload’. يمكنك بعد ذلك تحديد العلامات الذكية التي ستستخدم لإنشاء تسميات توضيحية لصورك.

تمكين تبديل التسميات التوضيحية وتكوين الوسوم الذكية

بعد ذلك، يمكنك أيضًا استخدام ميزة إزالة علامات الترقيم لاستبعاد أو تضمين أحرف في التعليقات واختيار حالة لها.

بعد الانتهاء، انتقل إلى علامة التبويب ‘Description’ في الأعلى.

من هنا، تأكد من تفعيل خيار ‘Autogenerate Description on Upload’. يجب عليك أيضًا تحديد العلامات الذكية التي تريد استخدامها لإنشاء أوصاف تلقائية للصور.

تمكين تبديل الوصف وتكوين الوسوم الذكية

بعد ذلك، يمكنك أيضًا استخدام ميزة ‘Strip Punctuation’ لإضافة/استبعاد أحرف مثل الشرطات السفلية، أو علامات الاقتباس العليا، أو الأرقام في الوصف.

بعد ذلك، ما عليك سوى تحديد حالة الأحرف لوصف صورك.

إعدادات Strip punctuation وcasing

تكوين أسماء الملفات التلقائية

كما ذكرنا سابقًا، نوصي بأسماء ملفات صورك متوافقة مع السيو. يمكنك القيام بذلك قبل رفع صورك، أو سيقوم AIOSEO بذلك تلقائيًا.

بمجرد الانتقال إلى علامة التبويب ‘Filename’ من الأعلى، ستلاحظ أن AIOSEO قد قام بالفعل بضبط إعداد ‘Strip Punctuation’.

ومع ذلك، إذا كانت هناك أحرف إضافية تريد من AIOSEO حذفها من أسماء ملفات صورك عند إنشاء العناوين أو النصوص البديلة، فيمكنك كتابتها في مربع ‘Words to Strip’.

إعدادات AIOSEO لاسم الملف

بعد ذلك، يمكنك أيضًا تحديد حالة الأحرف لأسماء ملفاتك.

بعد الانتهاء، لا تنسَ النقر على زر “حفظ التغييرات” لحفظ إعداداتك.

لقد نجحت الأن في تحسين صورك للسيو، وسينشئ AIOSEO تلقائيًا عناوين ونصوص بديلة وتعليقات توضيحية وأوصاف لجميع صورك.

للحصول على تعليمات أكثر تفصيل، يرجى الاطلاع على دليل المبتدئين حول كيفية تحسين الصور لمحركات البحث.

مكافأة: السماح للمستخدمين برفع الصور في ووردبريس

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

لهذا الغرض، يمكنك استخدام WPForms، وهي أفضل إضافة لنموذج الاتصال في السوق. تأتي مع أداة إنشاء بالسحب والإفلات تسهل إنشاء أي نوع من النماذج، بما في ذلك نماذج إرسال الصور.

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

للمزيد من المعلومات، راجع مراجعة WPForms.

أولًا، ستحتاج إلى تثبيت وتفعيل إضافة WPForms. لمزيد من التفاصيل، راجع تعليماتنا حول كيفية تثبيت إضافة ووردبريس.

بعد التفعيل، انتقل إلى شاشة WPForms » Add New من لوحة تحكم ووردبريس لتشغيل أداة إنشاء النماذج.

من هنا، تحتاج إلى كتابة اسم للنموذج الخاص بك، ثم انقر فوق الزر ‘Use Template’ أسفل تميلت ‘Simple Contact Form’

حدد تمبلت نموذج الاتصال

سيؤدي هذا إلى تحميل القالب في منشئ النماذج، حيث ستلاحظ معاينته على اليسار والحقول المتاحة في العمود الأيمن.

من هنا، قم بسحب وإفلات حقل “‘File Upload’ على النموذج وانقر فوقه لتخصيص إعداداته بشكل أكبر.

إضافة حقل رفع الملف

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

على سبيل المثال، إذا كنت ترغب في السماح بملفات JPEG وPNG فقط، فعليك كتابة هذه الخيارات في حقل ‘Allowed File Extensions’. ضع في اعتبارك أنك بحاجة إلى فصل كل امتداد بفاصلة.

بعد ذلك، يمكنك أيضًا تحديد الحد الأقصى لحجم ملف الصورة وعدد مرات الرفع في العمود الأيمن.

تكوين إعدادات الحقل

لمزيد من التعليمات المفصلة، ​​يرجى الاطلاع على درسنا التعليمي حول كيفية السماح للمستخدمين برفع الصور في ووردبريس.

بمجرد الانتهاء، انقر فوق زر ‘Save’ لتخزين إعداداتك.

بعد ذلك، افتح الصفحة/المنشور الذي تريد إضافة نموذج رفع الصور إليه. بعد ذلك، انقر على زر “+” في الزاوية العلوية اليمنى من الشاشة لفتح قائمة الكتل.

من هنا، ستحتاج إلى إضافة كتلة WPForms إلى الصفحة/المنشور.

إضافة كتلة WPForms في ووردبريس

ما عليك سوى اختيار نموذج رفع الصور الذي أنشأته من القائمة المنسدلة.

وأخيرًا، انقر على زر ‘تحديث’ أو ‘نشر’ لحفظ إعداداتك. الأن، يمكنك زيارة موقع ووردبريس الخاص بك لمشاهدة النموذج أثناء عمله، وسيتمكن الزوار من إرسال صورهم باستخدامه.

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

فريق دكتورميجا

فريق التحرير في دكتورميجا هو فريق من خبراء ووردبريس بقيادة محمود حجازي، بخبرة تزيد عن 15 عاما في ووردبريس، واستضافة المواقع، والتجارة الإلكترونية، والسيو، والتسويق.

اترك تعليقاً