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

كيفية إضافة وحدة Diapo كاملة العرض من Divi

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

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

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

مثال عن حالة الاستخدام: إضافة قسم بطل شريط التمرير بعرض كامل إلى صفحتك الرئيسية

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

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

باستخدام Visual Builder ، أضف قسم Fullwidth في الجزء العلوي من صفحة الويب الخاصة بك. ثم أدخل وحدة Fullwidth Slider في القسم الجديد. في علامة التبويب "المحتوى" في إعدادات شريحة العرض الكامل ، انقر فوق "نعم" + إضافة عنصر جديد لإنشاء الشريحة الأولى.

في إعدادات الشريحة للشريحة الأولى الخاصة بك ، قم بتحديث الخيارات التالية:

خيارات المحتوى

En-الرأس : [أدخل عنوان الشريحة]
نص الزر : [أدخل نص الزر]
محتويات : [أدخل محتوى النص الخاص بالشريحة]
عنوان زر : [أدخل عنوان URL المقصود لزر Slide]
الصورة الخلفية : [أدخل الصورة التي ستكون بمثابة خلفية للشريحة]

خيارات التصميم

استخدم تراكب الخلفية : نعم
لون تراكب الخلفية : rgba (0,0,0,0.2،XNUMX،XNUMX،XNUMX) هذا التراكب يغمق صورة الخلفية قليلاً لجعل النص أكثر قابلية للقراءة.

حفظ إعدادات الشريحة

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

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

خيارات الشريحة الكاملة للمحتوى

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

السهام

اختر ما إذا كنت تريد عرض أسهم التنقل الأيمن والأيسر أم لا.

CONTROLES

اختر ما إذا كنت تريد عرض مؤشرات أزرار / الشريحة في الجزء السفلي من المؤشر أم لا.

تسمية المسؤول

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

خيارات تصميم وحدة الشرائح

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

إزالة الظل الداخلي

بشكل افتراضي ، يتم عرض ظل داخلي في المؤشر. إذا كنت تريد إيقاف هذا الظل ، فيمكنك القيام بذلك باستخدام هذا الإعداد.

تأثير المنظر

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

خط الرأس

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

حجم خط الرأس

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

لون نص الرأس

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

تباعد حرف الرأس

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

ارتفاع صف الرأس

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

شرطة الجسد

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

حجم خط الجسم

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

لون نص الهيكل

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

تباعد حروف الجسم

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

ارتفاع خط الجسم

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

الحشو العلوي

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

الحشو السفلي

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

استخدم الأنماط المخصصة للزر

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

حجم نص الزر

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

لون نص الزر

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

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

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

عرض حد الزر

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

لون خط الزر

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

دائرة نصف قطرها الحدود

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

تباعد الحروف من الزر

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

زر الخط

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

إضافة رمز الزر

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

رمز الزر

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

زر رمز اللون

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

زر وضع الرمز

يمكنك اختيار عرض أيقونة الزر الخاص بك على يسار أو يمين الزر.

إظهار الرمز فقط عند التمرير فوق الزر

بشكل افتراضي ، يتم عرض رموز الأزرار فقط عند التمرير فوقها. إذا كنت تريد ظهور الرمز دائمًا ، فقم بإيقاف تشغيل هذا الإعداد.

تحوم لون النص من الزر

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

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

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

لون زر تحويم الحدود

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

تحوم زر نصف القطر الحدود

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

مشيرا إلى تباعد زر ملاحظة

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

خيارات متقدمة وحدة الشرائح كاملة العرض

في علامة التبويب "خيارات متقدمة" ، ستجد خيارات قد يجدها مصممو الويب الأكثر خبرة مفيدة ، مثل سمات CSS و HTML المخصصة. هنا يمكنك تطبيق CSS مخصص على أي من عناصر الوحدة المتعددة. يمكنك أيضًا تطبيق معرفات وفئات CSS المخصصة على الوحدة النمطية ، والتي يمكن استخدامها لتخصيص الوحدة في ملف style.css الخاص بالقالب الخاص بك.

معرف CSS

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

فئة CSS

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

عرف المغلق

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

الرسوم المتحركة التلقائي

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

سرعة الرسوم المتحركة التلقائية (بالملي ثانية)

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

متابعة التقديم التلقائي على Hover

سيسمح تشغيل هذا بالشريحة التلقائية للمتابعة على الماوس.

إخفاء المحتوى على الجوال

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

إخفاء CTA على الجوال

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

عرض الصورة / الفيديو على الهاتف المحمول

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

رؤية

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

خيارات المحتوى لعناصر الوحدة النمطية للشريحة كاملة العرض

لقب

قم بتعيين نص عنوان المؤشر الخاص بك هنا.

نص الزر

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

محتويات

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

عنوان زر

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

اسحب الصورة

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

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

شريحة الفيديو

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

وقفة الفيديو

اسمح للاعبين الآخرين بإيقاف الفيديو مؤقتًا عند بدء اللعب

صورة الخلفية

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

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

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

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

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

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

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

لون الخلفية

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

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

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

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

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

عرض فيديو الخلفية

لكي يكون حجم مقاطع الفيديو صحيحًا ، يجب إدخال العرض الدقيق (بالبكسل) لمقطع الفيديو الخاص بك هنا.

خلفية ارتفاع الفيديو

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

خيارات تصميم عناصر الشريحة

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

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

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

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

استخدام تراكب النص

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

لون تراكب النص

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

نص تراكب الحدود الشعاع

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

سهام لون مخصص

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

نقطة التنقل لون مخصص

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

المحاذاة العمودية لصورة الشريحة

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

لون النص

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

رأس الخط

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

حجم خط الرأس

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

لون نص الرأس

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

تباعد حرف الرأس

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

ارتفاع صف الرأس

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

هيئة الخط

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

حجم خط الجسم

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

لون نص الهيكل

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

تباعد حروف الجسم

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

ارتفاع خط الجسم

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

استخدم الأنماط المخصصة للزر

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

حجم نص الزر

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

لون نص الزر

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

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

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

زر عرض الحدود

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

لون خط الزر

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

دائرة نصف قطرها الحدود

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

تباعد الحروف من الزر

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

زر الخط

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

إضافة رمز الزر

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

رمز الزر

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

زر رمز اللون

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

زر وضع الرمز

يمكنك اختيار عرض أيقونة الزر الخاص بك على يسار أو يمين الزر.

إظهار الرمز فقط عند التمرير فوق الزر

بشكل افتراضي ، يتم عرض رموز الأزرار فقط عند التمرير فوقها. إذا كنت تريد ظهور الرمز دائمًا ، فقم بإيقاف تشغيل هذا الإعداد.

تحوم لون النص من الزر

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

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

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

لون زر تحويم الحدود

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

تحوم زر نصف القطر الحدود

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

مشيرا إلى تباعد زر ملاحظة

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

خيارات المؤشر المتقدمة Fullwidth

عرف المغلق

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

نص الصورة البديل

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

[vc_row center_row = "نعم"] [vc_column width = "1/2 ″] [vcex_button target =" blank "layout =" expand "align =" center "font_family =" Raleway "font_weight =" 700 ″ style = "flat" custom_background = ”# 18b69d” custom_hover_background = ”# 118d7a” custom_color = ”# ffffff” custom_hover_color = ”# ffffff” icon_right = ”fa fa-download”] DOWNLOAD DIVI THEME [/ vcex_button] [/ width_column] [= vc_column] / 1 ″] [vcex_button url = ”https://www.elegantthemes.com/affiliates/idevaffiliate.php؟id=2&url=23065&tid40632=tutorials” target = ”blank” layout = ”توسيع” align = ”center” font_family = ”Raleway” font_weight = ”1 ″ style =” flat ”custom_background =” # c700e ”custom_hover_background =” # 4226d8f ”custom_color =” # ffffff ”custom_hover_color =” # ffffff ”icon_right =” fa fa-download ”] تنزيل TEMPLATES DIVI [/ vcex_button] [/ vc_column] [/ vc_row]

دروس ديفي أخرى

• المواقع 5 للاستخدام مطعم ديفي موضوع
• كيفية إضافة نص على منتج Divi WooCommerce
• كيفية تغيير لون القائمة بين صفحات Divi
• كيفية تخصيص شبكات بلوق مع ديفي
• كيفية استخدام دور ديفي محرر على وورد
• كيفية إنشاء كامل الشاشة المنزلق ديفي
• كيفية تغيير لون القوائم بين صفحات Divi
• الميزات التي ربما لا تعرفها عن Divi
• كيفية استخدام Divi Builder على وورد
• كيفية استخدام وحدة Divi Video scrolling
• كيفية استخدام وحدة Divi Builder Flip
• كيفية إضافة وحدة شهادة على Divi Builder
• كيفية استخدام وحدة Divi النصية
• كيفية إنشاء شريط التمرير على ديفي
• كيفية تحرير دور مستخدم Divi
• كيفية استخدام وحدة Divi Social Media
• كيفية استخدام وحدة متجر على موضوع ووردبرس]
• كيفية استخدام وحدة Divi الشريط الجانبي
• كيفية استخدام Divi Price Table Module
• كيفية استخدام وحدة العنوان لمنشورات Divi
• كيفية إضافة وحدة فيديو ديفي
• كيفية استخدام وحدة الملاحة المادة
• كيفية استخدام وحدة البحث Divi
• كيفية استخدام وحدة محفظة Divi
• كيفية استخدام وحدة الشخص على Divi Builder
• كيفية استخدام وحدة المحفظة مع فلتر Divi
• كيفية استخدام وحدة المنزلق بعرض كامل
• كيفية استخدام Divi Builder Image Module
• كيفية استخدام وحدة التنقل كاملة العرض في Divi Builder
• كيفية استخدام وحدة معرض الصور
• كيفية استخدام وحدة بطاقة Divi Builder Full-Width
• كيفية استخدام وحدة Divi Full Width Portfolio
• كيفية استخدام وحدة الرأس Divi ذات العرض الكامل
• كيفية استخدام Divi Counter Module
• كيفية استخدام شريط التمرير المقالات على Divi Builder
• كيفية استخدام وحدة Divi Email Optin