كيفية تغيير لون خلفية كتلة في ووردبريس

كيفية تغيير لون خلفية كتلة في ووردبريس

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

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

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


الطريقة 1: لون الخلفية المباشر (دعم أصلي)

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

الخطوة 1: حدد المكوِّن

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

حدد الكتلة

الخطوة 2: افتح الشريط الجانبي لإعدادات الحظر

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

افتح الشريط الجانبي لإعدادات المكوِّن

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

من لوحة إعدادات الأنماط، ستجد في لوحة إعدادات الأنماط لون القسم. تحت إعدادات الألوانابحث عن الخلفية. والآن، ما عليك سوى اختيار لون من اللوحة، أو العمل باستخدام منتقي الألوان، أو إدخال رمز HEX/GB/HSL مخصص.

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

ينطبق على

  • كتل النص والمحتوى: فقرة، عنوان، قائمة، قائمة، اقتباس، اقتباس، اقتباس اقتباس، رمز، منسق مسبقًا، بيت شعر
  • كتل التخطيط: المجموعة، الأعمدة، الغلاف، الوسائط والنص
  • كتل تفاعلية/قطعة تفاعلية: أزرار، تقويم، أحدث المنشورات، التصنيفات، الفئات ،سحابة الوسم، أيقونات اجتماعية، تنقل، ملف، ملف، صوت، فيديو، RSS، بحث، تسجيل الدخول/الخروج، قائمة الصفحات
  • كتل الموقع/البريد: عنوان الموقع، شعار الموقع، عنوان المنشور، عنوان المنشور، محتوى المنشور، مقتطفات المنشور، تاريخ المنشور، كاتب المنشور، فئات المنشور، علامات المنشور، التعليقات، التالي/السابق، قراءة المزيد
  • كتل المرافق: فاصل (محدود)، فاصل (محدود)، جدول (جدول كامل فقط). 

الملاحظات

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

الطريقة 2: الالتفاف في كتلة جماعية

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

الخطوة 1: تحديد الكتلة المحددة واستهدافها

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

تحديد الكتلة المحددة واستهدافها

الخطوة 2: تجميع الكتلة

الآن، انقر فوق قائمة الخيارات (ثلاث نقاط) في أقصى اليمين في شريط أدوات الكتلة، وحدد مجموعة من القائمة المنسدلة. يؤدي ذلك إلى التفاف المكوِّن المحدد داخل مكوِّن المجموعة.

تجميع الكتلة

الخطوة 3: حدد كتلة المجموعة

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

حدد كتلة المجموعة

الخطوة 4: تطبيق لون الخلفية

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

تطبيق لون الخلفية

الخطوة 5: ضبط التباعد (اختياري)

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

ضبط التباعد (اختياري)

ينطبق على

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

الملاحظات

  • يُعد مكوِّن المجموعة مثاليًا لإنشاء أقسام ذات ألوان خلفية موحدة.
  • يمكنك تداخل عدة مكوِّنات داخل مكوِّن مجموعة لتصميمها كقسم متماسك.
  • اضبط إعدادات التخطيط (مثل المحاذاة والحشو) للتحكم بشكل أفضل في التباعد وتدفق المحتوى.

الطريقة 3: استخدام كتلة الغطاء

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

الخطوة 1: إضافة كتلة غلاف

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

إضافة كتلة غلاف

الخطوة 2: اختر لون الخلفية

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

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

الخطوة 3: إدراج المحتوى داخل مكوِّن الغلاف

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

إدراج المحتوى داخل كتلة الغلاف

ينطبق على

  • لاحتياجات التصميم المتقدمة: أي مكوِّن يتطلب تأثيرات خلفية ذات طبقات، مثل الفقرات، أو العناوين، أو الصور، أو الأزرار، أو حتى المكوِّنات المدمجة المتعددة.

الملاحظات

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

جدول ملخص: الكتل والطرق

كتل النص/المحتوى (على سبيل المثال، الفقرة، العنوان، القائمة)

الطريقة الأولى

كتل الوسائط (مثل الصور والفيديو والصوت)

الطريقة 2 أو 3

كتل التخطيط (على سبيل المثال، الأعمدة، المجموعة، الغلاف)

الطريقة 1 أو 2 أو 3

الكتل التفاعلية (مثل الأزرار والأيقونات الاجتماعية)

الطريقة الأولى

كتل القطع (مثل، بحث، تقويم)

الطريقة الأولى

المكوِّنات القديمة/الأدوات المساعدة (مثل الرمز القصير والكلاسيكي)

الطريقة الثانية


خاتمة

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



فريق Tableberg

أنشئ جداول ووردبريس جميلة - بصريًا!

قل وداعًا للجداول المملة. باستخدام Tableberg، يمكنك إنشاء جداول تفاعلية سريعة الاستجابة باستخدام محرر المكوِّنات - دون الحاجة إلى كود.

واجهة Tableberg
🛒 جديد: إنشاء جداول منتجات WooCommerce جميلة!
هذا هو النص الافتراضي لشريط الإعلام