13 أكتوبر، 2021

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

سجل إعجابك

A VPN is an essential component of IT security, whether you’re just starting a business or are already up and running. Most business interactions and transactions happen online and VPN

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

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

ما هي صورة الخلفية وورد بريس؟

تعمل صورة الخلفية في وورد بريس كخلفية كاملة لموقعك على الويب. يطلق عليه أيضًا خلفية مخصصة.

مثال على صورة خلفية وورد بريس

يمكن أن تكون الخلفية أيضًا بلون خالص.

بغض النظر عن الخيار الذي تختاره ، يتعامل ملف function.php مع صورة الخلفية في قالب وورد بريس. يتم عرضه أيضًا بواسطة ملف header.php من وورد بريس.

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

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

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

خلف صفحة وورد بريس أو منشور

في صفحة فئة وورد بريس

داخل كتلة محتوى لصفحة أو منشور

في صفحة تسجيل الدخول

خلف قائمة الملاحة

على صفحات الصيانة أو قريباً

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

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

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

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

ألوان الخلفية

تحجيم

موقف الصورة

ما إذا كان يجب تكرار الصورة أم لا

خيارات لملء الشاشة أو تمديد الصورة

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

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

انقر للتغريد

الأنماط العديدة للخلفيات

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

مثال على صورة الخلفية على موقع Kinsta

غالبًا ما تكون قادرًا على تنفيذ خلفيات فريدة بمساعدة CSS أو المكونات الإضافية (أو كليهما). نعرض لك كلتا الطريقتين في هذه المقالة.

فيما يلي بعض أنماط الخلفية التي يجب وضعها في الاعتبار:

صور الخلفية القياسية: هذه صور ثابتة (PNG و JPG وتنسيقات صور أخرى) تمتد على معظم مساحة موقع الويب وتقع خلف المحتوى الأساسي. تشمل مزاياها البساطة وخيارات الصور عالية الدقة والدعم الافتراضي بواسطة وورد بريس Core. تتراوح الجوانب السلبية من ميلهم إلى العبث برؤية العناصر الأمامية إلى صورة كبيرة عالية الدقة تبطئ موقعك.

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

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

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

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

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

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

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

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

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

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

صور مخزون مجانية على Unsplash

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

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

إذا كنت لا تستخدم صورة عالية الجودة ، فإنك تخاطر برؤية خلفية ممتدة.

تأكد من حجم صور الخلفية بشكل صحيح

إلى جانب دقة الصورة ، فإن الحجم المادي للصورة مهم للغاية.

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

بشكل عام ، القاعدة الجيدة هي الالتزام بحد أدنى لصورة خلفية وورد بريس بحجم 1024 × 768 بكسل. ومع ذلك ، يوصي خبراء آخرون بشيء أقرب إلى 1920 × 1080 بكسل. بشكل عام ، أفضل ما يمكنك فعله هو البقاء في مكان ما بين 1000 و 3000 بكسل للعرض ، اعتمادًا على مكان عرضه.

أبعاد صورة الخلفية في ووردبريس

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

من الناحية الفنية ، يحتوي موقع الويب على نسبة عرض إلى ارتفاع رأسية (ارتفاع أطول من العرض). حتى تتمكن من النظر في تلك الأنواع من الصور. ومع ذلك ، يجب أن تظل الخلفيات المقطعية – مثل تلك الخاصة بالرؤوس أو إعلانات البانر – بتنسيق أفقي (عرض أطول من الارتفاع).

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

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

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

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

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

لديك خياران لتحسين الصور:

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

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

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

تحقق من دعم الخلفية قبل تثبيت موضوع

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

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

على سبيل المثال ، تشير السمات المدرجة في وورد بريس Theme Library إلى دعم الخلفيات المخصصة كعلامات. قد تجد أيضًا مرجعًا لخلفية مخصصة في وصف السمة.

دعم “خلفية مخصصة” للموضوعات

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

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

يقدم منشئو الصفحات مثل Gutenberg و WPBakery و Divi و Elementor قوائم رائعة من الكتل والوحدات النمطية لإدراج عناصر مثل الصور ومربعات النص في أي مكان على صفحة الويب.

منشئ موقع Elementor

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

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

تأكد من أن صورة الخلفية الخاصة بك قانونية

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

هذا خطأ.

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

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

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

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

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

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

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

ضع في اعتبارك موقع ويب مجاني للصور مثل Unsplash أو Pexels. ومع ذلك ، تأكد من أن الإسناد ليس مطلوبًا! يمكنك أحيانًا تحديد موقع الصور على هذه المواقع حيث يتم اقتراح الإسناد ولكن ليس مطلوبًا.

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

فكر في تخطي صورة الخلفية ، أو فكر في اختيار خلفية ملونة بدلاً من صورة.

كيف يمكنني تعيين صورة خلفية في وورد بريس؟

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

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

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

الموقع بأكمله

صفحة وورد بريس

منشور على وورد بريس

كتلة محتوى فردي

رأس وورد بريس

صفحة أرشيف فئة

صفحة تسجيل الدخول إلى وورد بريس

قائمة التنقل

صفحة صيانة

قبل أن تبدأ: تنشيط دعم الخلفية المخصص على وورد بريس (إذا لزم الأمر)

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

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

يتم التعامل مع دعم الخلفية المخصص الرئيسي لـ وورد بريس بواسطة ملف function.php . افتح هذا الملف وأدخل الكود التالي إذا كان مفقودًا:

$defaults = array(
    'default-color'          => '',
    'default-image'          => '',
    'default-repeat'         => '',
    'default-position-x'     => '',
    'default-attachment'     => '',
    'wp-head-callback'       => '_custom_background_cb',
    'admin-head-callback'    => '',
    'admin-preview-callback' => ''
);
add_theme_support( 'custom-background', $defaults );

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

من الممكن أيضًا إضافة صورة خلفية افتراضية للموضوع بأكمله من خلال ملف function.php . ما عليك سوى الانتقال إلى المنطقة من الكود السابق default-imageبالقيمة وإضافة عنوان URL للصورة إلى المساحة الفارغة بين ‘ ‘بعد ملف =>.

هذه طريقة سريعة وسهلة لتشغيل الخلفيات المخصصة داخل لوحة معلومات وورد بريس.

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

كيفية إضافة صورة خلفية إلى موقع وورد بريس بالكامل

إذا كان المظهر الخاص بك يوفر القدرة على إضافة صورة خلفية مخصصة (والعديد منها يفعل ذلك) ، فإنه يسهل عليك كثيرًا.

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

انقر فوق الارتباط “تخصيص” ضمن قائمة المظهر

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

هنا ، ابحث عن علامة التبويب الخلفية وانقر عليها .

صورة خلفية وورد بريس في المحرر

كبديل ، إذا كان بإمكانك تحديد المظهر> الخلفية ، فيمكنك استخدامه لمسار مباشر إلى هذا الإعداد.

انقر على رابط “الخلفية” ضمن قائمة المظهر

انقر فوق رابط “الخلفية” ضمن قائمة المظهر

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

انقر فوق الزر تحديد صورة للمتابعة.

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

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

بمجرد تحديد صورتك ، انقر فوق الزر اختيار صورة للمضي قدمًا.

اختر صورة الخلفية

تظهر الخلفية التي قمت بتطبيقها الآن في معاينة موقع الويب.

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

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

الصور المصغرة لصور الخلفية في ووردبريس

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

انقر فوق حقل الإعداد المسبق لتغيير تنسيق الصورة باستخدام تصميمات ومحاذاة معدة مسبقًا.

خيار “الإعداد المسبق” لصور الخلفية في وورد بريس

يمكنك الاختيار من بين الإعدادات المسبقة التالية:

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

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

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

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

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

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

إذا فشل كل شيء آخر ، فانتقل إلى الإعداد المخصص للحصول على خيارات محددة حقًا.

إعداد “ملء الشاشة” مسبقًا لصور خلفية وورد بريس

الإعداد المسبق “ملء الشاشة” لصور الخلفية في وورد بريس

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

الإعداد المسبق “ملاءمة الشاشة”

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

تتطلب أداة Image Position ، مثل إعداد Presets ، عملية تخمين وفحص عملك ، حيث تحدد الصورة الأصلية ومحتوياتها كيف تبدو.

وضع صورة الخلفية في ووردبريس

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

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

تمكين خيار “التمرير مع الصفحة”

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

تنزلق عناصر المحتوى المقدمة (مثل المنتجات في هذه الحالة) فوق صورة الخلفية ، مما يخلق تأثيرًا جذابًا.

تعطيل خيار “التمرير مع الصفحة”

العمل مع إعداد مسبق مخصص

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

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

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

الإعدادات المسبقة وأحجام الصور لصور الخلفية

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

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

ضبط حجم صورة الخلفية

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

اضغط على زر “نشر”

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

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

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

رؤية صورة خلفية وورد بريس

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

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

صورة خلفية وورد بريس في صفحة أخرى

صورة خلفية وورد بريس على صفحة أخرى

كيفية تعيين لون الخلفية بدلاً من صورة لموقعك الإلكتروني بالكامل

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

انقر فوق الزر Select Color لفتح المزيد من الإعدادات لاختيار وتبديل ألوان مختلفة لخلفيتك.

اختيار لون خالص كخلفية

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

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

لتنشيط لون الخلفية ، تأكد من تحديد اللون وظهوره في معاينة تحديد اللون .

اختيار “لون الخلفية”

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

كل ما عليك فعله للكشف عن خلفية اللون هو النقر فوق الزر ” إزالة” أسفل معاينة صورة الخلفية .

إزالة صورة خلفية وورد بريس

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

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

كيفية إضافة صورة خلفية إلى صفحة ووردبريس

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

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

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

ملاحظة: لا يهم ما إذا كنت تستخدم محرر Gutenberg أو Classic وورد بريس.

بالنسبة للخلفيات الخاصة بالصفحة ، يبدو أن هذه الأساليب تعمل بشكل أفضل:

إضافة خلفية صفحة فريدة باستخدام CSS مخصص .

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

دمج خلفية مخصصة في كل صفحة بمساعدة منشئ الصفحة.

تتضمن إضافة CSS المخصصة الخاصة بك إلى صفحة العثور على معرف الفئة لتلك الصفحة والمطالبة بعنوان URL للخلفية ، ضمن وحدة CSS المخصصة ، في إعدادات صفحة وورد بريس. لحسن الحظ ، ليس من الصعب معرفة معرّف الفصل للصفحة ، مع الأخذ في الاعتبار أنه يمكننا البحث عنه ، أو ربما تعرف ما هو بالفعل.

انتقل إلى الصفحة الموجودة على موقعك حيث تريد خلفية لتلك الصفحة فقط.

إضافة صورة خلفية خاصة بصفحة ووردبريس

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

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

فحص صفحة ويب

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

استخدم وظيفة البحث واكتب bodyأو classلتحديد موقع سطر التعليمات البرمجية page-idبالعلامة.

في هذه الحالة ، المعرف هو page-id-352، لكن هويتك ستختلف.

تريد نسخ الجزء الكامل من الكود page-id-#بالكلمة الأساسية ، بما في ذلك الشرطات.

البحث عن معرّف الصفحة في وورد بريس

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

انتقل إلى أداة تخصيص السمات

حدد علامة التبويب CSS الإضافية في أداة تخصيص وورد بريس.

قسم “CSS إضافي” في أداة التخصيص

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

الصق الكود التالي في حقل CSS الإضافي ، لكن تذكر استبدال ” # ” بالرقم الفعلي الذي سحبه كمعرّف الصفحة من الخطوات السابقة. أيضًا ، يجب عليك وضع عنوان URL حقيقي للصورة بدلاً من نص الحشو الموجود لدينا ( http://YOURIMAGEURL.jpeg).

body.page-id-# { 
background-image: url("http://YOURIMAGEURL.jpeg"); 
background-position: center center; 
background-size: cover; 
background-repeat: no-repeat; 
background-attachment: fixed;
}

في هذا المثال ، يتم ملء معرف الصفحة كـ 352 ، ولدينا عنوان URL لصورة الخلفية تم لصقه من مكتبة الوسائط الخاصة بنا .

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

إضافة CSS مخصص إلى موقع وورد بريس

انقر فوق الزر ” نشر” عندما تكون راضيًا عن CSS المخصص.

انقر فوق الزر “نشر”

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

تظهر صورة الخلفية الآن على الصفحة

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

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

كيفية إضافة صورة الخلفية إلى وورد بريس Post

يتم إدراج معظم صور الخلفية خلف صفحات وورد بريس أو كل صفحة في موقع الويب.

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

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

لذلك ، لدينا بعض الخيارات التي يجب مراعاتها عند إضافة صورة خلفية إلى منشور (ستلاحظ أنها مماثلة عند العمل مع صور الخلفية الخاصة بصفحة معينة):

أدخل صورة خلفية باستخدام CSS مخصص.

استخدم مكونًا إضافيًا لتنفيذ خلفية في المنشورات الفردية.

قم بتثبيت أداة إنشاء صفحات مرئية لخلفيات النشر.

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

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

عند استخدام CSS المخصص لتنفيذ خلفية خاصة بالصفحة ، فإنك تستخدم نفس الكود الذي تستخدمه لخلفية الصفحة ، مع اختلاف واحد: يجب أن تجد معرّف المنشور بدلاً من معرّف الصفحة.

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

وورد صورة الخلفية للمشاركات

انقر بزر الماوس الأيمن على المنشور واختر خيار فحص. أكمل البحث داخل الكود لتحديد موقع قسم فئة الجسم في الكود. ابحث عن postid-#الجزء – هذا هو معرف المنشور الذي تحتاج إلى إدراجه في CSS المخصص.

البحث عن معرف آخر

ستلاحظ أن تنسيق معرف المنشور مختلف قليلاً في هذا المثال مقارنة بمعرف الصفحة ، حيث postid-#لا تحتوي العلامة على شرطة بين “المنشور” و “المعرف” كما هو الحال مع page-id-#. أيضًا ، هذه ليست قواعد صارمة. يمكنك العثور على تنسيقات متنوعة للعلامات.

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

Gio إلى قسم “CSS إضافي”

الصق الكود التالي في حقل CSS المخصص هذا:

body.postid-# { 
background-image: url("http://YOURIMAGEURL.jpeg"); 
background-position: center center; 
background-size: cover; 
background-repeat: no-repeat; 
background-attachment: fixed;
}

بعد ذلك ، خذ رقم معرف المنشور الذي وجدته من المنشور المطلوب من قبل. استبدل “#” في كود CSS بالرقم. أيضًا ، قم بتغيير http://YOURIMAGEURL.jpegالنص باستخدام عنوان URL الحقيقي لصورة الخلفية التي ترغب في إظهارها ، مع الاحتفاظ بعلامات الاقتباس حولها.

إضافة CSS مخصص لمعرف منشور معين

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

اضغط على زر “نشر” لحفظ التغييرات

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

انظر صورة الخلفية في المنشور

كيفية إضافة صورة خلفية إلى كتلة محتوى فردية

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

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

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

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

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

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

تعيين خلفية ملونة لكتلة واحدة

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

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

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

لتشغيل هذا ، حدد الكتلة ، ثم حدد موقع Color Settings ضمن علامة التبويب Block على الجانب الأيمن.

تغيير الخلفية “إعدادات اللون”

هذا القسم يكشف عن لون الخط و لون الخلفية المجالات.

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

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

اختيار لون الخلفية

إضافة خلفية ملونة إلى أي قالب وورد بريس

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

الحل الأسرع هو استخدام ميزة Group block في وورد بريس.

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

انقر فوق رمز المربع المكدس في القائمة التي تظهر.

قسم “فريقنا” على الصفحة

اختر خيار المجموعة في القائمة المنسدلة.

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

قم بتجميع الأقسام ككتلة

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

ابحث عن علامة التبويب Color Settings وانقر عليها.

قم بتغيير “إعدادات اللون” للكتلة المجمعة

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

اختر اللون الذي تفضله أكثر لهذا الموقف لترى أن كل شيء داخل هذه المجموعة يجب أن يحتوي الآن على تلك الخلفية الملونة.

ما يميز كتلة المجموعة هو أنها تأخذ كتلة أخرى لا تحتوي على ميزة خلفية (مثل كتلة المعرض) وتسمح لك بتنشيط خلفية لها على أي حال.

ضبط لون الخلفية على اللون الأزرق

إضافة خلفية صورة إلى قالب وورد بريس واحد

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

لبدء هذه العملية ، انقر فوق زر إضافة كتلة أو زر ” + ” وابحث عن كتلة الغلاف .

اختر تلك الكتلة لإدراجها في منشورك أو صفحتك.

إضافة قالب صورة الغلاف

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

انقر فوق الزر “تحديد الوسائط”

اختر الصورة التي تريدها وانقر فوق الزر تحديد .

اختر الصورة وانقر فوق الزر “تحديد”

يمكنك الآن رؤية هذه الصورة كخلفية لكتلة الغلاف.

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

ما يميز قالب Cover هو أنه يوفر العديد من خيارات التنسيق ، مما يسمح لك بالقفز من عنوان إلى تنسيق فقرة في ثوانٍ.

صورة خلفية وورد بريس في القسم

لإضافة كتل أخرى أعلى تلك الخلفية ، انقر فوق زر رمز ” + ” داخل كتلة الغلاف نفسها. قد تضطر إلى الضغط على مفتاح Enter مرة واحدة للكشف عن الزر.

انقر فوق علامة الجمع داخل قسم الحظر

يشبه إلى حد كبير إضافة كتلة محتوى في مقال عادي ، يسمح لك Cover block بالتمرير عبر جميع كتل المحتوى المحتملة في وورد بريس.

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

البحث عن كتلة

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

كل كتلة تضعها أمام الخلفية لها إعداداتها المخصصة في علامة التبويب Block على الجانب الأيمن ، لذا ضع في اعتبارك تعديلها أثناء إفلاتها في كتلة الغلاف.

مثال على كتلة صورة مع صورة خلفية وورد بريس

مثال على كتلة مع صورة خلفية وورد بريس

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

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

خلفية ثابتة

خلفية متكررة

منتقي نقطة الاتصال

أبعاد

تراكب

العتامة

متقدم

تغيير إعدادات الحظر

أحد الإعدادات الأكثر أهمية التي يجب مراعاتها هو الجزء السفلي من لوحة إعدادات الحظر .

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

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

تغيير لون خلفية الكتلة

كبديل ، ضع في اعتبارك المكون الإضافي Stackable Page Builder Gutenberg Blocks لفتح المزيد من الأدوات المتقدمة للخلفيات على الكتل الفردية.

كيفية وضع صورة خلفية خلف عنوان وورد بريس

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

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

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

للبدء ، انتقل إلى المظهر> الرأس في لوحة معلومات وورد بريس.

ملاحظة: يمكنك أيضًا العثور على إعدادات الرأس بالانتقال إلى المظهر> تخصيص> قسم الرأس .

لوحة تحكم وورد بريس> المظهر> الرأس

يجب أن تشاهد الآن معاينة لصفحتك الرئيسية على الجانب الأيمن من الشاشة ، جنبًا إلى جنب مع إعدادات الرأس على الجانب الأيسر من ذلك.

تشرح وحدة Header الأبعاد المفضلة لأي صورة خلفية للرأس ، بحيث يمكنك اختيار اقتصاص صورتك قبل التحميل أو الانتظار حتى تحصل على الصورة على لوحة معلومات وورد بريس الخاصة بك.

تحت عنوان العنوان الحالي ، انقر فوق الزر ” إضافة صورة جديدة” .

انقر فوق الزر “إضافة صورة جديدة”

تعتبر الرؤوس صعبة لأنك تريد التأكد من أن جميع الروابط وعناصر النص (ناهيك عن شعارك) تبدو واضحة تمامًا أعلى صورة الخلفية.

لذلك ، نوصي باختبار صور الخلفية والنظر في الصور التي تلتزم بألوان وأنماط أكثر صلابة. لن يجعلوا من الصعب رؤية عناصر القائمة والشعار.

حدد الصورة التي تبدو مثالية بالنسبة لك ، ثم انقر فوق الزر ” تحديد واقتصاص” للمتابعة.

اختر صورة

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

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

بمجرد الحصول على المحصول المثالي ، انقر فوق الزر Crop Image .

قص الصورة

يتم تنشيط صورة الخلفية الرئيسية على الفور في معاينة وورد بريس Customizer ، مما يساعدك على رؤية ما سيراه عملاؤك بالضبط مع هذا النوع من الخلفية.

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

حدد صورة خلفية العنوان

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

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

بمجرد أن يكون لديك أكثر من صورة واحدة ، انقر فوق الزر Randomize Uploaded Headers لتنشيط الميزة التي تعرض خلفية رأس مختلفة في كل مرة.

إضافة المزيد من العناوين

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

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

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

المربع الآخر هو لون الارتباط. سترى على الأرجح المزيد من التغييرات عند ضبط هذا اللون لأنه يتضمن جميع عناصر القائمة المرتبطة بصفحات أخرى.

لون النص فوق صورة خلفية وورد بريس

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

فحص عناصر الرأس

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

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

انقر فوق الزر Select Color واختر من لوحة الألوان لمشاهدة نتائج المعاينة. يمكنك أيضًا تغيير ألوان النص عند استخدام لون الخلفية.

ضبط لون الخلفية

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

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

انقر فوق الزر “نشر”

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

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

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

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

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

حدد علامة التبويب CSS الإضافية لفتح الوحدة النمطية التي تسمح بالكتابة في CSS الخاص بك.

انتقل إلى قسم “CSS إضافية”

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

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

انقر بزر الماوس الأيمن على صفحة الويب وحدد “فحص”

ابحث عن “body” أو “class” لتحديد فئة CSS لصفحات الفئات ، جنبًا إلى جنب مع فئة هذه الفئة على وجه الخصوص.

بالنسبة لهذه الحالة ، فإن فئة CSS لدينا هي “فئة السفر” ، نظرًا لأن لدي فئة تسمى “السفر” على الموقع.

احفظ علامة CSS لوقت لاحق.

لاحظ أسفل الفئة المدرجة

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

قم بلصق الكود التالي في هذا المربع ، مع تبديل category-travelالفصل الدراسي الخاص بك ووضع عنوان URL للصورة الحقيقية في المكان الذي يشير إلى ذلك http://YOURIMAGEURL.jpeg.

body.category-travel {
background-image: url("http://YOURIMAGEURL.jpeg");
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
}

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

انقر فوق الزر ” نشر” لحفظ التغييرات.

إضافة كود “CSS مخصص”

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

انتقل إلى صفحة الفئة

انتقل إلى صفحة الفئة وشاهد الخلفية

كيفية إضافة صورة خلفية إلى صفحة تسجيل الدخول الخاصة بك على وورد بريس

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

صفحات تسجيل الدخول هذه منفصلة عن الأعمال الرئيسية لموقع الويب الخاص بك (توجد معظم الملفات في ملف wp-login.php ). لذلك ، لن تنتقل أداة صورة الخلفية المخصصة إلى وحدات تسجيل الدخول.

يمكنك القيام بذلك باستخدام مكون إضافي يسمى Custom Login Page Customizer . للبدء ، قم بتثبيت وتنشيط المكون الإضافي لموقع وورد بريس الخاص بك.

تسجيل الدخول

على اليسار ، تظهر علامة تبويب جديدة في قائمة لوحة معلومات وورد بريس لـ LoginPress.

اذهب إلى LoginPress> Settings .

اذهب إلى تسجيل الدخول اضغط على الإعدادات

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

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

تغيير إعدادات LoginPress

لتنشيط خلفية صورة مخصصة لصفحة تسجيل الدخول ، انقر فوق LoginPress> Customizer .

انتقل إلى “تسجيل الدخول اضغط> أداة تخصيص”

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

من الممكن أيضًا تخصيص صفحة تسجيل الدخول من خلال النقر على الأزرار الموجودة في المعاينة المرئية.

تعيين سمة تسجيل الدخول

لن نغطي جميع الإعدادات الأخرى لأننا نركز بشكل أساسي على الخلفية في الوقت الحالي.

انقر فوق علامة التبويب الخلفية للمتابعة.

انتقل إلى علامة التبويب الخلفية “LoginPress”

أول أمر في العمل هو تحديد ما إذا كنت ترغب في خلفية ملونة أو خلفية صورة.

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

كما ترى ، يسري التغيير في معاينة وورد بريس Customizer أيضًا.

حدد لون الخلفية “LoginPress”

أسفل إعداد لون الخلفية مباشرةً ، يوجد قسم صورة الخلفية .

قم بتشغيل مفتاح تمكين صورة الخلفية لإظهار مجموعة من صور الخلفية المعدة مسبقًا.

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

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

انطلق واختبر هذه الخلفيات المعدة مسبقًا لمعرفة ما إذا كانت ستعمل مع علامتك التجارية.

إعداد معرض الخلفية

المسار الأكثر احتمالاً هو تحميل صورتك كخلفية لصفحة تسجيل الدخول.

ابحث عن عنوان صورة الخلفية وانقر فوق الزر تحديد صورة .

اختر خيار “تحديد صورة”

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

حدد الصورة التي تريدها وانقر على زر اختيار صورة .

اختر صورة الخلفية لتسجيل الدخول إلى وورد بريس

تظهر صورة الخلفية النشطة كصورة مصغرة في لوحة Customizer والمعاينة الفعلية لصفحة تسجيل الدخول الخاصة بك.

اضبط خيارات صورة الخلفية

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

انقر فوق حقل القائمة المنسدلة ” تكرار الخلفية” واختبر خيارات مثل ” التكرار” و ” عدم التكرار” و ” التكرار” .

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

اختر إعدادات “تكرار الخلفية”

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

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

حدد موضع الخلفية

من الآن فصاعدًا ، تحتوي القائمة المنسدلة لـ وورد بريس Background Image Size على إعدادات لكيفية تغطية الصورة لمساحة الشاشة ، وضبط حجمها مع كل خيار محدد مسبقًا.

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

اضبط حجم صورة خلفية وورد بريس

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

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

تمكين “فيديو الخلفية”

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

كيفية إضافة صورة خلفية إلى قائمة التنقل الخاصة بك

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

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

تريد أن تعرف كيف زدنا من حركة المرور لدينا أكثر من 1000 ٪؟

انضم إلى أكثر من 20000 آخرين ممن يتلقون رسائلنا الإخبارية الأسبوعية مع نصائح من الداخل حول وورد بريس!

إشترك الآن

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

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

البرنامج المساعد WP Mega Menu

ابدأ بالبحث عن علامة التبويب WP Mega Menu في لوحة معلومات وورد بريس.

انقر فوق عنصر قائمة السمات .

انتقل إلى لوحة “Themes”

هنا ، يمكنك رؤية قائمة السمات الافتراضية التي تم إنشاؤها لقائمتك بواسطة المكون الإضافي.

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

العديد من سمات القائمة الضخمة

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

ومع ذلك ، بالنسبة لخلفية القائمة ، ما عليك سوى معرفة المظهر الذي تريد اختياره.

اضبط إعدادات سمة القائمة الضخمة

انتقل إلى المظهر> القوائم في لوحة المعلومات.

انتقل إلى “المظهر> القوائم”

سترى وحدة جديدة ترتبط بإعدادات القائمة الضخمة .

انقر لتمكين القائمة الضخمة ، ثم اختر أيهما تفضله لموقعك على الويب.

أخيرًا ، انقر فوق الزر حفظ .

انقر فوق الزر “تمكين”

الآن ، حوّل انتباهك إلى منطقة بنية القائمة .

يؤدي التمرير فوق أي من عناصر القائمة الحالية إلى إظهار زر WP Mega Menu . هذا هو المكان الذي تقوم فيه بتخصيص التخطيط والتصميم لكل قسم من أقسام القائمة المنسدلة.

انقر فوق الزر WP Mega Menu لأي عنصر قائمة تريده. في هذه الحالة ، سنضيف قائمة ضخمة منسدلة إلى علامة تبويب المتجر.

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

أضف القائمة الضخمة إلى موقعك

في النافذة المنبثقة الجديدة ، اقلب المفتاح لتشغيل قائمة Mega لعنصر القائمة المحدد.

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

انقر فوق الزر “إضافة الآن”

لإضافة خلفية إلى منطقة القائمة المنسدلة هذه ، انقر فوق الزر ” خيارات” في الزاوية اليسرى السفلية.

اختر رابط “الخيارات”

ابحث عن حقل تحميل صورة الخلفية .

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

حدد الزر “تحميل صورة”

تظهر الصورة المصغرة بعد تحديدها من مكتبة الوسائط.

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

تحقق من الصورة المصغرة

تأكد من النقر فوق الزر حفظ التغييرات أسفل لوحة الخيارات .

انقر فوق الزر “حفظ التغييرات”

تحتاج أيضًا إلى النقر فوق حفظ القائمة مرة أخرى في منطقة بنية القائمة في لوحة معلومات وورد بريس.

انقر فوق الزر “حفظ القائمة”

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

تحتوي القائمة الآن على صورة خلفية

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

يمكنك وضع خلفية خلف قائمة الهاتف المحمول بمساعدة المكون الإضافي WP Mobile Menu .

المكون الإضافي WP Mobile Menu

بعد تثبيت وتفعيل المكون الإضافي WP Mobile Menu ، انتقل إلى Mobile Menu Options في لوحة معلومات وورد بريس.

انتقل إلى رابط “خيارات قائمة الجوال”

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

على سبيل المثال ، يمكننا النقر فوق مفتاح Enable Left Menu (تشغيل قائمة الهاتف المحمول الموجودة على الجانب الأيسر من الشاشة) واختيار خيار Main Menu من القائمة المنسدلة Left Menu . يؤدي هذا إلى ربط قائمتنا الرئيسية الحالية بقائمة الجوال ، بحيث يرى الزوار نفس علامات التبويب.

اضبط خيارات القائمة

اضبط خيارات قائمة الجوال

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

اختر إعدادات القائمة اليسرى

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

إضافة صورة خلفية قائمة المحمول

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

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

حدد زر حفظ التغييرات لتنشيط الخلفية.

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

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

يتم دمج القائمة الجديدة تحت رمز الهامبرغر (ثلاثة خطوط أفقية).

انقر فوق ذلك لاختبار القائمة الجديدة مع الخلفية.

انقر فوق رمز قائمة الهامبرغر

كما هو موضح في لقطة الشاشة ، يتم وضع الخلفية خلف قائمة الجوال بالكامل ليراها الجميع.

قائمة المحمول مع صورة الخلفية

كيفية إضافة صورة خلفية وورد بريس إلى صفحة الصيانة

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

تلعب صور الخلفية دورًا كبيرًا عند العمل مع صفحات الصيانة . تتكون معظم صفحات الصيانة من صورة خلفية بملء الشاشة وربما بعض النصوص أو الروابط مع المزيد من الموارد.

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

يمكنك إضافة صورة خلفية إلى صفحة الصيانة بمساعدة المكوِّن الإضافي للصيانة . قم بتثبيت وتفعيل البرنامج المساعد على موقع الويب الخاص بك.

البرنامج المساعد للصيانة

بمجرد تنشيطه ، ابحث عن زر الصيانة تشغيل / إيقاف في الجزء العلوي من لوحة القيادة.

انقر فوق الزر للانتقال إلى صفحة إعدادات مكون الصيانة.

انقر فوق الارتباط “الصيانة متوقفة”

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

انقر فوق عنصر قائمة “الصيانة”

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

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

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

إضافة عنوان لصفحة الصيانة

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

زر “تحميل الشعار”

انقر على زر تحميل الشعار واختر شعارك لرؤية صورته المصغرة في لوحة القيادة.

شعار لصفحة الصيانة

أخيرًا ، يطلب منك حقل صورة الخلفية النقر فوق تحميل صورة الخلفية.

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

ملاحظة: تكون أفضل صور خلفية الصيانة كبيرة وعالية الدقة وذات اتجاه أفقي. يتوفر بديل خلفية “Portrait Mode” في الإعدادات أدناه.

انقر فوق الزر “تحميل الخلفية”

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

الصورة المصغرة لصورة الخلفية

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

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

من المهم تضمين صورة في هذا الحقل ، لذا انقر فوق الزر تحميل صورة لتوجيه الجهاز الرأسي .

تحميل صورة خلفية باتجاه عمودي

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

قم بتمييز الصورة التي تريدها وانقر فوق الزر تحديد صورة لإدراجها في لوحة القيادة.

اختر صورة الخلفية

كل هذه الإعدادات لا تعني شيئًا إلا إذا قمت بتنشيط وضع الصيانة.

لتحقيق ذلك ، حدد موقع مفتاح تشغيل / إيقاف الصيانة في أعلى صفحة الإعدادات.

إعداد صفحة الصيانة أو إيقاف تشغيلها

تعيين صفحة الصيانة “تشغيل” أو “إيقاف”

اقلب المفتاح بحيث يصبح “تشغيل” ، ثم حدد الزر ” حفظ التغييرات” .

تمكين صفحة الصيانة

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

هناك فرصة جيدة أنها لا تفعل ذلك.

هناك سببان لهذا: أولاً ، يجب عليك تسجيل الخروج من حساب مسؤول وورد بريس لرؤية موقع ويب Maintenance Mode. ثانيًا ، قد تحتاج إلى مسح ذاكرة التخزين المؤقت للموقع لتحديث التغيير في المحتوى.

راجع موقع الويب في وضع الصيانة

انظر الموقع في “وضع الصيانة”

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

صورة الخلفية موجودة هناك ، جنبًا إلى جنب مع تخصيصاتي مثل الشعار ووصف النص.

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

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

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

صورة الخلفية في الوضع الرأسي

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

مثل صورة الخلفية العادية ، انقر فوق الزر Upload Preloader للعثور على صورة تبدو جميلة وإضافتها إلى لوحة القيادة.

مرة أخرى ، انقر فوق الزر حفظ التغييرات وامسح ذاكرة التخزين المؤقت.

انقر فوق الزر “تحميل أداة التحميل المسبق”

بشكل افتراضي ، يدور تأثير Preloader Image للحظة ، ثم يختفي لتقديم صفحة الصيانة وصورة الخلفية.

الأمر متروك لك تمامًا ما إذا كنت ترغب في الاحتفاظ بهذا النوع من التأثير أم لا.

إضافة تأثير مقدمة لصورة الخلفية

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

على سبيل المثال ، قد ترغب في إضافة لون الخلفية بدلاً من صورة الخلفية.

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

افتح حقل لون الخلفية

لا يظهر لون الخلفية لصفحة الصيانة إلا إذا قمت بتعطيل جميع صور الخلفية الأخرى.

لذلك ، تأكد من حذف صورة الخلفية.

إزالة صورة الخلفية

يجب عليك أيضًا حذف صورة خلفية Portrait Mode.

اضبط صورة الخلفية في الوضع الرأسي

احفظ التغييرات وامسح ذاكرة التخزين المؤقت. ثم انتقل إلى الواجهة الأمامية لموقعك لرؤية لون الخلفية ساري المفعول.

تحقق من الواجهة الأمامية لموقعك

تشمل الإعدادات الأخرى التي يجب مراعاتها عناصر مثل لون الخط وعائلة الخط وطمس الخلفية.

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

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

بمجرد الانتهاء من كل شيء ، انقر فوق الزر حفظ التغييرات .

اضبط لون الخط

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

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

يجب عليك شراء السمات لاستخدامها.

شراء موضوع متميز

اعتمادًا على ميزانيتك ، فهي غير مكلفة إلى حد ما وتبدو رائعة.

مثال على قالب

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

انتقل إلى وحدة “Custom CSS”

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

يمكنك العثور على زر Clear Cache في الركن الأيمن العلوي من لوحة القيادة عند استخدام Kinsta. إذا كنت تستخدم مضيفًا مختلفًا ، ففكر في واحدة من العديد من مكونات التخزين المؤقت في السوق .

انقر فوق الزر “مسح ذاكرة التخزين المؤقت”

بمجرد مسح ذاكرة التخزين المؤقت وحفظ الإعدادات الخاصة بك ، سترى صورة خلفية جميلة تكمل صفحة الصيانة!

فحص صفحة الصيانة

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

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

يوضح القسم التالي كيفية تنفيذ الخلفية باستخدام بعض أدوات إنشاء الصفحات الشائعة ، بما في ذلك Elementor و Beaver Builder و Page Builder بواسطة SiteOrigin.

أضف خلفية وورد بريس باستخدام Elementor

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

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

للبدء ، قم بتثبيت وتفعيل المكون الإضافي Elementor .

المكون الإضافي Elementor

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

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

بمجرد تشغيل محرر صفحة وورد بريس الافتراضي ، انقر فوق الزر ” تحرير باستخدام Elementor” .

انقر فوق المكون الإضافي “تحرير باستخدام Elementor”

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

لا تتوفر وظيفة الخلفية في قسم أو كتلة بل في الإعدادات الأساسية لتلك الصفحة.

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

انقر فوق رمز الإعدادات

يعرض هذا قسمًا لإعدادات الصفحة العامة.

انقر فوق علامة التبويب ” النمط” في الجزء العلوي من قسم ” إعدادات الصفحة” .

انتقل إلى علامة التبويب “النمط”

ضمن Style ، حدد موقع حقل Background Type وانقر على أيقونة Paint Brush لإضافة خلفية قياسية.

تعيين حقل “نوع الخلفية”

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

ضبط حقل لون الخلفية

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

انتقل إلى الزر “اختيار صورة”

انقر فوق الزر “اختيار صورة”

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

انقر فوق الزر “إدراج وسائط”

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

يوفر Elementor إعدادات خلفية الصورة مثل Position و Attachment و Repeat و وورد بريس Background Image Size. قم بتعديل الإعدادات لتحديد ما إذا كانت الخلفية الخاصة بك قد تبدو أفضل كمرفق ثابت ، أو ربما تكون ذات اتجاه أعلى يمين أو حجم بديل.

اضغط على زر التحديث لحفظ جميع التغييرات على الصفحة ونشر الخلفية الجديدة لموقع الويب الخاص بك.

إضافة خلفية جديدة

خلفيات القسم مع Elementor

يوفر Elementor وظائف خلفية متقدمة لغالبية الأقسام المضافة إلى صفحاتك.

كل ما عليك فعله هو تحديد قسم في صفحة Elementor وتعديل إعدادات الخلفية لقصر الخلفية على تلك المنطقة فقط.

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

اختر قسم النص مع Elementor

اختر علامة التبويب خيارات متقدمة وابحث عن قسم الخلفية داخل علامة التبويب تلك.

انتقل إلى قسم “الخلفية”

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

اختر رمز فرشاة الطلاء لنوع الخلفية ، ثم انقر فوق الزر اختيار صورة أسفل حقل الصورة .

انقر فوق الزر “اختيار صورة”

اختر صورة من مكتبة الوسائط وانقر فوق الزر ” إدراج وسائط” .

اختر الصورة وانقر فوق الزر “إدراج وسائط”

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

استخدام الوظيفة ، مرفق ، كرر ، و الحجم محددات لتعديل كيفية تقديم صورة الخلفية في هذا الباب.

أخيرًا ، انقر فوق الزر ” تحديث” لحفظ التغييرات.

انقر فوق “تحديث” لرؤية التغييرات

أضف صورة خلفية باستخدام Beaver Builder

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

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

أولاً ، قم بتثبيت المكون الإضافي Beaver Builder للبدء.

البرنامج المساعد Beaver Builder

انتقل إلى أي صفحة أو منشور لتحريره باستخدام Beaver Builder.

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

لتحويل صفحة حالية إلى Beaver Builder ، افتح محرر الصفحة وانقر على أيقونة ثلاثية النقاط لفتح قائمة العرض في الزاوية اليمنى العليا.

انتقل إلى قائمة إعدادات الصفحة

قم بالتمرير لأسفل للعثور على رابط التحويل إلى Beaver Builder واختياره .

يحاول تجميع كل المحتوى الموجود على صفحتك وتحويل هذه العناصر إلى وحدات متوافقة مع Beaver Builder.

انقر فوق الارتباط “التحويل إلى Beaver Builder”

لإنشاء صفحة من البداية ، انتقل إلى الصفحات> إضافة جديد .

ثم انقر فوق الزر Launch Beaver Builder .

انقر فوق الزر “Launch Beaver Builder”

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

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

بمجرد تحديده ، ابحث عن زر إعدادات الصف ( الرمز ⚙ ).

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

قم بتحرير إعدادات الصف

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

ضمن الخلفية ، انقر فوق القائمة المنسدلة لإظهار جميع أنواع الخلفية.

انتقل إلى علامة التبويب “النمط”

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

اللون

الانحدار

فيديو

كود مضمن

عيّن نوع صورة الخلفية في وورد بريس

لا تتردد في اختبار أنواع الخلفية المختلفة.

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

قسم “نبذة عن الشركة”

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

انقر فوق الارتباط “تحديد صورة”

ابحث عن صورة الخلفية المفضلة لديك وانقر فوق الزر تحديد صورة .

اختر الوسائط

يقوم Beaver Builder بإسقاط الصورة في مساحة الخلفية المختارة من قبل. يسألك قسم إعدادات الصورة عن الطريقة التي ترغب في تنسيق الصورة بها. اختر من الخيارات مثل الحجم ، كرر ، الوظيفة ، و مرفق .

اضبط حجم صورة الخلفية

صور خلفية بيفر باني عالمي وكامل الصفحة

يعمل Beaver Builder مع أدوات تصميم وورد بريس الافتراضية للاستفادة من ميزات الخلفية المضمنة.

لذلك ، يمكنك الانتقال إلى المظهر> علامة التبويب الخلفية لتنشيط خلفية الصورة لموقع الويب بالكامل.

كبديل ، افتح أي صفحة ويب في Beaver Builder وانقر على القائمة المنسدلة Tools في الزاوية اليسرى العليا.

هنا ، انقر فوق خيار الإعدادات العامة .

“الإعدادات العامة” لـ Beaver Builder

توفر لوحة الإعدادات العامة القدرة على تغيير موقع الويب الخاص بك بالكامل ، وتجاوز أو تعديل ترميز وورد بريس المدمج. لذلك ، نود إدراج كتلة كود CSS لتغيير صورة خلفية موقع الويب بالكامل (عالميًا).

انقر فوق علامة التبويب CSS في الإعدادات العامة ، والصق مقطع التعليمات البرمجية التالي في الحقل:

body {
background-image: url("URL to Image");
background-repeat: no-repeat;
background-position: center top;
background-attachment: fixed;
background-size: 100%;
background-color: #0f1066;
}

استبدل عنوان URL لنص الصورة بعنوان URL لصورة الخلفية المطلوبة. يمكنك أيضًا تغيير أشياء مثل وظيفة التكرار والمرفق وحجم الخلفية باستخدام كود CSS.

انتقل إلى علامة التبويب CSS

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

في محرر صفحتك ، افتح قائمة الأدوات مرة أخرى.

حدد الخيار Layout CSS & Javascript .

زر تخطيط CSS وجافا سكريبت

الصق نفس الرمز في علامة التبويب CSS ، وقم بتغيير عنوان URL إلى نص الصورة إلى عنوان URL الفعلي وضبط أي إعدادات تريدها:

body {
background-image: url("URL to Image");
background-repeat: no-repeat;
background-position: center top;
background-attachment: fixed;
background-size: 100%;
background-color: #0f1066;
}

كما ترى ، تتغير الخلفية بأكملها إلى صورة URL الموجودة في ترميز CSS. ضع في اعتبارك أن لوحة Layout CSS / Javascript تتحكم في الصفحة الحالية فقط. لن ترى الخلفية في أي صفحة بخلاف هذه الصفحة.

إضافة CSS مخصص

أضف صفًا بسيطًا أو خلفية عنصر واجهة مستخدم باستخدام أداة إنشاء الصفحات حسب SiteOrigin

يعد Page Builder by SiteOrigin أداة أخرى لإنشاء مواقع الويب بالسحب والإفلات. إنها محدودة في قدرتها على إدراج الخلفيات للموقع بالكامل (ستلجأ مرة أخرى إلى أداة وورد بريس Custom Background). ومع ذلك ، فإنه يوفر إعدادات لإضافة صور وألوان خلفية للصفوف وعناصر واجهة المستخدم التي يستخدمها SiteOrigin.

أولاً ، قم بتنزيل وتفعيل المكون الإضافي Page Builder بواسطة SiteOrigin.

Page Builder by SiteOrigin plugin

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

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

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

لذلك ، انقر فوق الزر Add Widget أو Add Row للمتابعة.

إضافة عنصر واجهة مستخدم جديد أو صف

في هذا المثال ، سنلقي نظرة على مكتبة الأدوات .

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

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

اختر أداة “المنتجات”

عنصر واجهة المستخدم أو الصف الجديد ينتهي في محرر صفحة SiteOrigin. تظل معظم SiteOrigin في لوحة معلومات وورد بريس ، لذلك ليس هناك الكثير من محرر الواجهة الأمامية كما هو الحال مع منشئي الصفحات الآخرين.

لإضافة خلفية إلى أي عنصر SiteOrigin ، قم بالتمرير فوق العنصر وانقر فوق الارتباط تحرير .

انقر فوق الارتباط “تحرير”

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

توجد أدوات الخلفية أسفل القائمة المنسدلة Design . انقر فوق ذلك للمضي قدما.

علامة التبويب “تصميم” لصورة خلفية وورد بريس

ابحث عن حقل صورة الخلفية وانقر على زر تحديد صورة .

لديك أيضًا خيار لصق عنوان URL خارجي لصورة الخلفية.

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

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

انقر فوق الزر “تم”

الآن يقدم حقل صورة الخلفية نسخة مصغرة من تلك الصورة.

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

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

تأكد من النقر فوق الزر تم عند الانتهاء من الإعدادات المخصصة للخلفية.

إعدادات صورة الخلفية في وورد بريس

إعدادات “صورة الخلفية” في وورد بريس

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

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

انتقل إلى قسم “المنتجات”

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

تحقق من خلفية القسم

خلفية القسم

إضافة صور خلفية فريدة من نوعها مع بريزي

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

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

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

للاستفادة من إعدادات الخلفية هذه ، قم بتثبيت وتنشيط المكون الإضافي Brizy للبدء.

البرنامج المساعد Brizy Page Builder

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

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

يجب أن ترى زرًا للتحرير باستخدام بريزي . انقر فوقها ليتم إرسالها إلى منشئ صفحات Brizy الكامل.

انقر فوق الزر “متابعة التعديل باستخدام بريزي”

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

انقر فوق رمز علامة الجمع لبدء بناء صفحتك

ابحث عن علامتي التبويب التخطيطات والكتل في شريط القائمة العلوي.

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

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

أقسام التخطيطات والكتل

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

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

انقر فوق هذا للكتلة التي تختارها. سنضيف خلفية لهذه الكتلة.

انقر فوق رمز “الإعدادات”

في إعدادات كتلة بقايا لوحة في أعلى الزاوية اليمنى. قم بالتمرير فوق رموز القائمة لمعرفة ما يفعلونه جميعًا.

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

زر “اللون” للخلفية

يحتوي زر الرمز الموجود على اليسار على إعدادات الخلفية .

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

زر صورة الخلفية في وورد بريس

يقدم Brizy ثلاثة عناصر خلفية للوسائط:

الصور

أشرطة فيديو

خرائط

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

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

نوع صورة الخلفية في وورد بريس

لقد وجدنا صورة لوحة خشبية لهذا البرنامج التعليمي وأشرنا إلى أننا لا نرغب في عدم وجود تأثير اختلاف المنظر .

يضيف هذا تأثيرًا لطيفًا نظرًا لأن خلفية اللون تعمل كتراكب ، ومع ذلك ما زلنا نرى نسيج الخشب خلفها.

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

صورة الخلفية بدون اختلاف المنظر

وهذه هي الطريقة التي تدخل بها صورة الخلفية مع Brizy!

أفضل جزء في Brizy هو أنه يمكنك الاستمرار في التنقل خلال التصميم والنقر فوق زر إعدادات كل قسم .

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

إضافة صورة خلفية أخرى

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

يتم وضع الخريطة كخلفية كاملة ولها وظيفة تكبير إذا لم تظهر بشكل صحيح مع الإعدادات الافتراضية.

أضف خريطة كصورة خلفية في وورد بريس

أخيرًا ، نوصي بالتحقق من أداة فيديو الخلفية Brizy ، الموجودة في نفس القسم مثل أداة خلفية الصورة. إنه يعمل عن طريق إدخال عنوان URL للفيديو ( YouTube أو Vimeo) ، مما يؤدي إلى عرض مقطع فيديو كامل خلف المحتوى الأمامي مباشرةً. حتى أنه يوفر إعدادًا لتكرار الفيديو واختيار متى يجب أن يبدأ أثناء قيام المستخدم بالتمرير فوق القسم.

URL لصورة خلفية وورد بريس

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

خلفية بالفيديو

الخلفية مع الفيديو

تحجيم صورة الخلفية وتحديد المصادر والتحرير الأساسي

ذكرنا سابقًا في المقالة أنه على الرغم من عدم وجود حجم مثالي لصورة الخلفية ، فإننا نوصي بالبدء بما لا يقل عن 1024 × 768 بكسل والالتزام بنسبة عرض إلى ارتفاع شائعة مثل 16: 9 . لا تهم نسبة العرض إلى الارتفاع بقدر أهمية الحجم الفعلي للصورة ودقتها حيث يمكنك قص الصورة أو السماح لـ وورد بريس بذلك نيابة عنك.

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

أين تجد صور خلفية مناسبة

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

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

تتضمن بعض النقاط البارزة من هذه الروابط ما يلي:

Unsplash – مجاني ، ولا يلزم الإسناد.

البحث البصري – صور مجانية. معظم الصور لا تتطلب الإسناد.

Pexels – مجاني دون الحاجة إلى الإسناد.

Pixabay – مجاني مع معظم الصور التي لا تتطلب الإسناد.

iStockphoto – اشتراك ممتاز منخفض التكلفة إلى حد ما للصور الخالية من حقوق الملكية.

Shutterstock – صور خالية من حقوق الملكية مقابل رسوم اشتراك معقولة.

كيفية تغيير صورة الخلفية في وورد بريس باستخدام CSS المخصص

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

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

إصلاح المشكلات الشائعة في صورة خلفية وورد بريس

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

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

لا يدعم موضوعي صورة خلفية وورد بريس

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

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

قم بتبديل السمة بأخرى تدعم الخلفيات المخصصة. ابحث عن الخلفيات المخصصة في قوائم الميزات عند شراء السمات أو تنزيلها.

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

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

صورة الخلفية الخاصة بي على وورد بريس مظلمة جدًا أو ذات لون خاطئ

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

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

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

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

صورة الخلفية الخاصة بي على وورد بريس ليست في الموضع الصحيح

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

لحسن الحظ ، لا يتطلب التنقل في الخلفية سوى بضع نقرات على الزر.

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

نوصي بالنقر فوق جميع أزرار تحديد المواقع لرؤية النتائج التي تنتجها. بعد أن تجد الموضع الصحيح ، احفظ الصفحة.

تتكرر صورة الخلفية الخاصة بي على وورد بريس مرارًا وتكرارًا

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

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

الحل الرئيسي لهذه المشكلة موجود في قسم الخلفية عن طريق المظهر> الخلفية في وورد بريس. مع تحميل صورة كخلفية ، جرب الإعدادات المسبقة مثل Fill Screen أو Fit To Screen أو Custom ، بدلاً من خيار التكرار المسبق.

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

تم تمديد صورة الخلفية الخاصة بي على وورد بريس

تعني صورة الخلفية الممتدة أن إعدادات الخلفية المخصصة تحاول التقاط صورة أصغر وتغطية الشاشة بأكملها بالصورة.

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

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

نصائح أخرى لاستكشاف الأخطاء وإصلاحها في الخلفية

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

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

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

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

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

صورة خلفية بسيطة بملء الشاشة

البرنامج المساعد صورة خلفية ملء الشاشة بسيط

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

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

هذا كل ما في الامر!

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

خلفيات ووردبريس متقدمة

AWB – البرنامج المساعد المتقدم لخلفيات وورد بريس

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

يقدم المكون الإضافي أيضًا دعمًا لمقاطع الفيديو. يتم سحب خلفيات الفيديو من أماكن مثل YouTube و Vimeo ، أو يمكنك حتى استضافتها بنفسك.

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

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

صور مثالية + شبكية العين

صور مثالية + البرنامج المساعد الشبكية

يعد المكون الإضافي Perfect Images + Retina مفيدًا كحل ثنائي في واحد. يسمح لك بإدارة حجم صورة الخلفية في وورد بريس ومظهرها مع إعادة إنشاء الصور المصغرة واستبدال الصور. تعد إدارة الصور مثيرة للإعجاب إلى حد ما ، وهي مهمة بشكل خاص للخلفيات عالية الدقة.

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

اعمال صيانة

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

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

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

دليلك الشامل لإضافة صور خلفية موقعك وتعديلها وتخصيصها للحصول على مظهر ومظهر فريد 🎨

انقر للتغريد

ملخص

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

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

سجل إعجابك

عن الكاتب

زمزم محمد

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

كل المقالات

تابعنا على منصات التواصل

إعلان | أطلب متجرك

صمم متجرك او موقعك بكل قوة وجمال

تقدم موثوق خدمة تصميم المتاجر بكلفة مناسبة وخدمة موثوقة

اطلب متجرك الآن

تابعنا على الفيسبوك

تابعنا على اليوتيوب

إعلان | أطلب متجرك

إنقل اعمالك وتجارتك اونلاين ووسع شبكتك

موثوق خيار يعني الكثير من الثقة لك ولزبائنك

طور متجرك الآن

توضيح

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

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

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

سجل إعجابك

ما هي صورة الخلفية وورد بريس؟

الأنماط العديدة للخلفيات

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

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

تأكد من حجم صور الخلفية بشكل صحيح

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

تحقق من دعم الخلفية قبل تثبيت موضوع

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

تأكد من أن صورة الخلفية الخاصة بك قانونية

كيف يمكنني تعيين صورة خلفية في وورد بريس؟

قبل أن تبدأ: تنشيط دعم الخلفية المخصص على وورد بريس (إذا لزم الأمر)

كيفية إضافة صورة خلفية إلى موقع وورد بريس بالكامل

العمل مع إعداد مسبق مخصص

كيفية تعيين لون الخلفية بدلاً من صورة لموقعك الإلكتروني بالكامل

كيفية إضافة صورة خلفية إلى صفحة ووردبريس

كيفية إضافة صورة الخلفية إلى وورد بريس Post

كيفية إضافة صورة خلفية إلى كتلة محتوى فردية

تعيين خلفية ملونة لكتلة واحدة

إضافة خلفية ملونة إلى أي قالب وورد بريس

إضافة خلفية صورة إلى قالب وورد بريس واحد

كيفية وضع صورة خلفية خلف عنوان وورد بريس

كيفية إضافة صورة خلفية إلى صفحة تسجيل الدخول الخاصة بك على وورد بريس

كيفية إضافة صورة خلفية إلى قائمة التنقل الخاصة بك

كيفية إضافة صورة خلفية وورد بريس إلى صفحة الصيانة

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

أضف خلفية وورد بريس باستخدام Elementor

خلفيات القسم مع Elementor

أضف صورة خلفية باستخدام Beaver Builder

صور خلفية بيفر باني عالمي وكامل الصفحة

أضف صفًا بسيطًا أو خلفية عنصر واجهة مستخدم باستخدام أداة إنشاء الصفحات حسب SiteOrigin

إضافة صور خلفية فريدة من نوعها مع بريزي

تحجيم صورة الخلفية وتحديد المصادر والتحرير الأساسي

أين تجد صور خلفية مناسبة

كيفية تغيير صورة الخلفية في وورد بريس باستخدام CSS المخصص

إصلاح المشكلات الشائعة في صورة خلفية وورد بريس

لا يدعم موضوعي صورة خلفية وورد بريس

صورة الخلفية الخاصة بي على وورد بريس مظلمة جدًا أو ذات لون خاطئ

صورة الخلفية الخاصة بي على وورد بريس ليست في الموضع الصحيح

تتكرر صورة الخلفية الخاصة بي على وورد بريس مرارًا وتكرارًا

تم تمديد صورة الخلفية الخاصة بي على وورد بريس

نصائح أخرى لاستكشاف الأخطاء وإصلاحها في الخلفية

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

صورة خلفية بسيطة بملء الشاشة

خلفيات ووردبريس متقدمة

صور مثالية + شبكية العين

اعمال صيانة

ملخص

سجل إعجابك

عن الكاتب

زمزم محمد

فهرسة المقال

تابعنا على منصات التواصل

إعلان | أطلب متجرك

صمم متجرك او موقعك بكل قوة وجمال

أخر المنشورات

تابعنا على الفيسبوك

تابعنا على اليوتيوب

إعلان | أطلب متجرك

إنقل اعمالك وتجارتك اونلاين ووسع شبكتك

توضيح

شاركنا رايك وتقييمك للموضوع

صمم متجرك او موقعك بكل قوة وجمال

الشحن

الاعادة

افضل الاسعار

حماية للمدفوعات

مركز للمساعدة

إنقل اعمالك وتجارتك اونلاين ووسع شبكتك