كيفية إضافة صور خلفية WordPress بشكل صحيح إلى موقع الويب الخاص بك؟

هل من السهل إضافة صور خلفية WordPress إلى موقع الويب الخاص بك؟ الإجابة هي نعم بالنسبة للجزء الأكبر ما لم يكن موضوعك لا يدعمه.

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

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

ستوضح لك هذه المقالة كيفية القيام بكل ما سبق لجعل موقع الويب الخاص بك يبرز بمظهر وإحساس لافت للنظر.

ما هي صور الخلفية في WordPress ؟

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

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

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

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

مهما كان السبب ، فلنجرّب تغييره.

استخدم مُخصص WordPress الافتراضي لإضافة صورة خلفية لـ WordPress

عادةً ما تقدم قوالب WordPress طريقة سهلة لاستخدام لون أو صورة في الخلفية. يختار معظم الأشخاص تغيير لون الخلفية الذي يتناسب بشكل أفضل مع العلامة التجارية لموقعهم وذوقهم.

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

1. من لوحة معلومات WordPress ، انتقل إلى المظهر> الخلفية / الخلفية أو المظهر> تخصيص> الخلفية.

2. انقر فوق الزر تحديد صورة لفتح مكتبة الوسائط.

3. اختر الصورة التي تريدها. يمكنك تحميله من جهاز الكمبيوتر الخاص بك أو تحديد واحد موجود من مكتبة الوسائط.

4. انقر فوق الزر " اختيار صورة " عندما تكون سعيدًا.
5. إذا أعجبك ما تراه في المعاينة ، فانقر فوق الزر نشر . وهذا هو عليه!

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

لا تقلق من أن تتعثر مع أي شيء. من السهل الرجوع إلى الإعدادات وتغيير الخلفية (والخيارات ذات الصلة) في أي وقت تريده.

استخدم Elementor Page Builder لإضافة صور خلفية WordPress إلى منشور / صفحة

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

1. للبدء ، تحتاج إلى تثبيت وتفعيل المكون الإضافي Elementor.
2. أولاً ، انتقل إلى المنشور أو الصفحة التي تختارها. بمجرد تشغيل محرر صفحة WordPress الافتراضي ، انقر فوق الزر Edit with Elementor .

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

3. انقر على أيقونة الإعدادات الصغيرة في الركن الأيسر السفلي من أداة إنشاء الصفحات.

4. ثم اختر علامة تبويب النمط .

5. بعد ذلك ، انقر فوق رمز فرشاة الرسم لإضافة صورة خلفية WordPress .

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

7. اختر الصورة التي تريدها. يمكنك تحميله من جهاز الكمبيوتر الخاص بك أو تحديد واحد موجود من مكتبة الوسائط.

8. ثم ، انقر فوق الزر "إدراج وسائط" في الزاوية اليمنى السفلية.

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

9. تذكر أن تضغط على زر "UPDATE" لحفظ جميع التغييرات وتحديث المنشور / الصفحة.

بالإضافة إلى ذلك ، يوفر Elementor بعض الضبط لصور خلفية WordPress مثل الموضع ، والمرفق ، والتكرار ، وما إلى ذلك. لا تتردد في تجربتها لمعرفة أفضل الخلفية.

استخدم البرنامج المساعد لإضافة صور خلفية WordPress

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

أضف صورة خلفية WordPress للموقع بأكمله

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

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

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

1. قم بتثبيت وتنشيط المكون الإضافي Simple Screen Background Image.
2. من لوحة معلومات WordPress ، انتقل إلى المظهر> صورة BG بملء الشاشة .

3. انقر فوق الزر اختيار صورة لفتح مكتبة الوسائط.

4. اختر الصورة التي تريدها. يمكنك تحميله من جهاز الكمبيوتر الخاص بك أو تحديد واحد موجود من مكتبة الوسائط.

5. انقر فوق الزر " اختيار صورة " عندما تكون سعيدًا.
6. أخيرًا ، انقر فوق الزر "حفظ الخيارات" وتحقق من موقع الويب الخاص بك. يجب أن تُعرض الصورة الآن على الموقع كصورة خلفية WordPress ملء الشاشة.

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

أضف صور خلفية WordPress على صفحة / منشور معين

في هذا الدليل ، سنستخدم البرنامج المساعد لخلفيات WordPress المتقدمة الذي ذكرناه أعلاه.

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

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

نظرًا لأن هذا يعمل مع كتل Gutenberg ، تأكد من التبديل من وضع Classic Editor إذا كنت بحاجة إلى ذلك.

1. قم بتثبيت البرنامج المساعد وتنشيطه.
2. افتح منشورًا / صفحة موجودة أو أنشئ منشورًا جديدًا.
3. انقر فوق زر علامة الجمع في الزاوية اليسرى العليا. ثم ، قم بالتمرير لأسفل إلى قسم التصميم ، واختر كتلة AWB. سيظهر شريط رمز علوي وعمود قائمة جانبي بجانب الكتلة.

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

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

6. في شريط الرموز العلوي ، انقر فوق رمز شكل الهامبرغر. ثم اختر خيار العرض الكامل لتغطية العرض بالكامل. هذا اختياري تمامًا.

في العمود الجانبي ، يمكنك تغيير حجم صورة خلفية WordPress والتباعد والموضع وغير ذلك الكثير. لا تتردد في تجربة ذلك.

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

تذكر حفظ المنشور / الصفحة عندما تكون راضيًا عن النتيجة.

استخدم CSS لإضافة صور خلفية WordPress

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

1. من لوحة معلومات WordPress ، انتقل إلى المظهر> تخصيص للوصول إلى مُخصص WordPress.

2. قم بالتمرير لأسفل وانقر فوق قسم CSS الإضافي .

3. انسخ والصق الرمز المناسب أدناه في حقل CSS:

أضف صورة خلفية WordPress للموقع بأكمله

 body { background-image: url('imageURL'); background-position: center center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed; }

تأكد من استبدال نص العنصر النائب "imageURL" بعنوان URL الفعلي لملف الصورة. لرؤية هذا ، حدد الصورة التي تريدها في مكتبة الوسائط لعرض معلومات الصورة.

وإذا كنت تعرف CSS ، فلا تتردد في تعديلها كيفما تشاء.

أضف صور خلفية WordPress على صفحة فئة معينة

 body.category-categoryid { background-image: url('imageURL'); background-position: center center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed; }

تأكد من استبدال نص العنصر النائب "imageURL" بعنوان URL الفعلي لملف الصورة و "معرّف الفئة" باسم الفئة المناسب.

لمعرفة معرف الفئة ، اتبع التعليمات أدناه:

1. من لوحة معلومات WordPress ، انتقل إلى المنشورات> الفئات .

2. حرك الماوس فوق نص تحرير الفئة التي تريد الرجوع إليها. سترى عنوان URL في الجزء السفلي الأيسر من الصفحة ، يظهر معرّف الفئة.

أفضل الممارسات لاستخدام صور الخلفية في WordPress

يبدو أن تعيين صورة خلفية مخصصة على WordPress مهمة سهلة. نعم! هذا صحيح في معظم الحالات ، ولكن ليس دائمًا.

لذلك ، نوصي باتباع أفضل ممارسات صورة الخلفية في WordPress للتخلص من أكبر عدد ممكن من المشكلات.

تحقق من دعم صورة الخلفية قبل استخدام سمة WordPress

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

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

التزم بصور عالية الجودة

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

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

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

تحسين صور الخلفية

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

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

لديك خياران فقط:

• قم بتحسين صور الخلفية (وجميع صور موقع الويب الخاص بك) قبل تحميلها على الخادم. يمكنك إكمال هذه العملية اليدوية بمساعدة أدوات مثل Photoshop و GIMP و Pixlr.
• أتمتة عملية التحسين عن طريق تثبيت مكون إضافي لبرنامج WordPress يقوم بتغيير حجم الصور وتقليصها عند التحميل.

افكار اخيرة

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

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

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

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

الآن ، انطلق وابدأ في استخدام خلفية موقع الويب الخاص بك لإشراك زوارك بصريًا.