كيفية تطبيق لوحات الألوان على موقع Divi الخاص بك

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

نصائح عامة حول لوحات الألوان

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

1. اختر موقع ويب داكن اللون أو فاتح اللون

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

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

2. اختيار اللون

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

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

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

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

لون الخط

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

لون الارتباط التشعبي و CTA

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

لون لللمسات النهائية

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

3. تأكد من وجود تباين كافٍ

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

4. العثور على التوازن الصحيح لاستخدام الألوان

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

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

كيفية إضافة لوحة ألوان إلى موقع Divi الخاص بك

مع وضع كل ذلك في الاعتبار ، حان الوقت للبحث في Divi وتطبيق نظام الألوان الجديد لموقعك!

لوحة Divi الافتراضية

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

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

أدخل منشئ Divi

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

تحت اللون المختار حاليًا لأي عنصر ، سترى ملف رمز علامة القطع (ثلاث نقاط). عند النقر عليها، تظهر لك أداة Divi's Magic Color. يأخذ المنشئ في الاعتبار الألوان المستخدمة مؤخرًا وألوان الصفحة نفسها ليمنحك سلسلة من اللوحات المتعددة المكونة من ألوان تكميلية يجب أن تعمل معًا بشكل جيد.

تحديد الألوان على أنها عالمية

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

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

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

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

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

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

تطبيق الألوان العامة

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

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

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

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

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

حزمة

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

يسعدني!

صورة مميزة للمقال بقلم ART.ICON / shutterstock.com