مرونة التمدد إلى أنواع العناصر المختلفة في Divi 5

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

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

ما هي سمات التمديد في Divi 5؟

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

اشترك في قناتنا على YouTube

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

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

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

باستخدام سمات تمديد في Divi 5

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

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

بمجرد فتح لوحة سمات التمديد ، تقرر ما يجب تمديده وأين يتم تطبيقه.

سترى بعض الخيارات الواضحة:

• (1.) تمتد من العنصر: العنصر الذي قمت بتصميمه ويريد نسخه من.
• (2.) تمتد إلى الموقع: اختر إلى أي مدى يجب أن تذهب التغييرات. فقط القسم الحالي أو الصف الأصل أو الصفحة الكاملة.
• (3.) تمتد إلى نوع العنصر: اختر نوع العنصر الذي تريد استهدافه ، مثل الوحدات النصية فقط أو جميع الوحدات النمطية.
• (4.) نوع السمة لتمديده: اختر ما يجب نسخه: التصميم أو المحتوى أو الإعدادات المسبقة أو أي مزيج من هؤلاء.
• (5.) مجموعة الخيارات لتمديدها: التركيز على مجموعة معينة من الإعدادات ، مثل أنماط النص أو الحدود أو الأزرار.
• (6.) الحقول المعدلة لتمديدها: يمكنك إما تطبيق الحقول التي قمت بتغييرها فقط أو تضمين كل شيء.

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

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

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

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

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

تعلم كل شيء عن سمات Divi 5

كيف تتفوق سمات Divi 5 على أنماط Divi 4

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

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

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

تتوفر سمات التمديد في Divi 5 - قم بتنزيل أحدث إصدار لتجربته الآن.

5 أمثلة عملية لما يمكنك تمديده (وكيف)

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

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

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

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

يمتد من قسم إلى عمود

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

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

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

يمتد من قسم إلى صف واحد

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

ترث جميع الصفوف الآن نفس قيم الحشو ، مما يمنح الصفحة تباعد ثابتًا.

يمتد من قسم إلى وحدة نمطية

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

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

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

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

يمتد من عمود إلى صف واحد

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

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

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

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

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

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

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

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

سوف ينقل التصميم على الفور إلى زر إرسال نموذج الاتصال دون التغيير والتبديل اليدوي.

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

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

3. حفظ وتوسيع المسبقة لمجموعة الخيارات

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

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

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

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

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

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

4. نمط مرة واحدة ثم تمديد ما قمت بتغييره فقط

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

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

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

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

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

5. تمديد الأنماط داخل وحدة واحدة

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

الآن ، تحتاج فقط إلى تصميم العنصر الأول وتوسيع الأنماط بشكل أكبر.

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

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

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

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

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