تقديم شبكة CSS لـ Divi 5

هذا واحد كبير. لقد قمنا ببناء أفضل منشئ شبكة CSS ، وهو متاح لـ Divi 5 اليوم. إنه أفضل من Elementor. إنه أفضل من الطوب. سواء كنت ترغب في إتقان الشبكة أو ببساطة استخدام قوالب الشبكة الجديدة من Divi ، ستحب هذا التحديث.

تحقق من الفيديو التالي لمشاهدة الميزة الجديدة في العمل.

شبكة CSS للجميع

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

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

قوالب الشبكة لكل مناسبة

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

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

يحتوي Divi على قوالب الشبكة لكل موقف ، وتطبيقها على المحتوى الحالي أمر سهل.

التحكم الكامل لخبراء الشبكة

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

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

خيارات الشبكة البديهية لمجتمعات الويب

إذا كنت في مكان ما بينهما ، فإن منشئ شبكة Divi 5 يضيء حقًا.

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

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

تحرير إزاحة الشبكة

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

قمت بإنشاء قالب مدونة في الفيديو أدناه باستخدام Divi 5's Loop Builder ؛ كل عمود هو عنصر حلقة مملوء بالمحتوى الديناميكي. عندما أقوم بتمكين نمط تخطيط الشبكة على الحاوية الأصل ، تتوافق الأعمدة تلقائيًا مع الشبكة.

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

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

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

CSS Grid Demos (تنزيل مجاني)

يمكنك إنشاء تخطيطات مذهلة باستخدام شبكة CSS التي لم تكن ممكنة من قبل. إذا كنت تريد الإلهام ، فابحث عن هذه التخطيطات المذهلة التي تم إنشاؤها باستخدام أحدث إصدار من Divi 5.

يمكنك تنزيلها مجانًا واختبارها بنفسك.

جرب Divi 5 اليوم

تتوفر شبكة CSS لـ Divi 5 اليوم وهي واحدة من العديد من الميزات القادمة إلى Divi هذا العام.

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

كما هو موضح في جدول الإصدار الأصلي متعدد المراحل لـ Divi 5 ، فإن Divi 5 Public Alpha يشبه "Divi 5 Lite". إنه يفتقد بعض الميزات وقد لا يكون مناسبًا لمواقع الويب الحالية ، ولكنه جاهز لاستخدامه على مواقع ويب جديدة إذا كنت تفضل التجربة على Divi 4.

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

هل جربت سمات مخصصة لـ Divi 5؟

في حال فاتتك ذلك ، أصدرنا مؤخرًا سمات مخصصة جديدة ، والتي تسمح لك بإضافة أي سمة ، مثل ALT و TITLE و REL و REA و AIA-LABEL ، إلى العناصر ومعظم العناصر الفرعية.

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

شاهد هذا الفيديو للحصول على جميع التفاصيل.

المزيد من تحديثات Divi 5 في الطريق

2025 هو سنة ديفي 5 . العمل الشاق وراءنا. لقد قمنا ببناء الأساس الفائق الصارم ، والآن حان الوقت ل Divi للعودة.

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

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