إعداد وتكوين نقاط توقف العنصر المخصص بواسطة الإضافات الرئيسية #
الحر نقاط توقف مخصصة للعنصر يتيح لك البرنامج المساعد من Master Addons (3 نقاط توقف مخصصة مجانية وغير محدودة مع Master Addons Pro) الإنشاء تخطيطات موقع الويب سريعة الاستجابة مُحسّن لأحجام الشاشات التي تتجاوز طرق عرض الجهاز المضمنة في Elementor. وهذا يضمن تجربة مستخدم متسقة وعالية الجودة عبر أي جهاز.
باستخدام نقاط توقف العنصر المخصص، يمكنك:
- أضف أكبر عدد ممكن من نقاط التوقف المخصصة (عروض الشاشة) حسب الحاجة (غير محدود مع Master Addons Pro).
- حدد تخطيطات وأحجام خطوط وتباعد ومحاذاة محددة لأجهزة مثل Small Mobile أو Large Tablet أو أحجام الشاشات المخصصة.
- تجاوز السلوك المستجيب الافتراضي لـ Elementor عند عروض البكسل الدقيقة.
ما هي نقاط توقف العنصر المخصص؟ #
نقاط توقف Elementor المخصصة هي عروض شاشة إضافية يحددها المستخدم وتسمح لتخطيطك بالتكيف مع الأحجام التي لا تغطيها طرق عرض Elementor المضمنة. يحتوي Elementor على ما يصل إلى سبع طرق عرض للأجهزة (صورة الهاتف المحمول، والمناظر الطبيعية للجوال، وصور الكمبيوتر اللوحي، والمناظر الطبيعية للكمبيوتر اللوحي، والكمبيوتر المحمول، وسطح المكتب، والشاشة العريضة). تضيف نقطة توقف مخصصة نقطة توقف أخرى بأقصى عرض محدد تختاره، على سبيل المثال عرض صغير للجوال مقاس 600 بكسل. تضيف الإضافات الرئيسية ما يصل إلى 3 نقاط توقف مخصصة في الخطة المجانية ونقاط توقف غير محدودة مع Pro، مما يمنحك تحكمًا دقيقًا في التصميم سريع الاستجابة دون لمس التعليمات البرمجية.
لذلك، دعونا نرى كيفية إعداد هذه الميزة وتكوينها.
إعداد نقاط توقف العنصر المخصص #
إجابة سريعة: قم بتثبيت ملحق نقاط التوقف المخصصة من الإضافات الرئيسية > الامتداد، افتح الجديد نقاط التوقف الصفحة ضمن قائمة الإضافات الرئيسية، ثم أدخل أ أقصى عرض بالبكسل لكل حجم جهاز تريد استهدافه (على سبيل المثال، 600 بكسل للجوال الصغير).
اتبع هذه الخطوات لتثبيت نقاط التوقف المخصصة وتحديدها.
الخطوة 1: تثبيت الملحق وتنشيطه #
- انتقل إلى الإضافات الرئيسية القائمة في لوحة تحكم WordPress الخاصة بك.
- اذهب إلى امتداد علامة تبويب.
- ابحث عن “نقاط التوقف المخصصة” الخيار وانقر على زر التنزيل لتثبيته وتنشيطه على موقع الويب الخاص بك.
الخطوة 2: الوصول إلى إعدادات نقاط التوقف #
- في لوحة تحكم WordPress، قم بالتمرير فوق الإضافات الرئيسية قائمة طعام.
- عنصر قائمة جديد بعنوان “Breakpoints” سوف تظهر. انقر عليه. سيؤدي هذا إلى إعادة توجيهك إلى صفحة إدخال نقطة التوقف المخصصة.
الخطوة 3: إضافة نقاط توقف مخصصة #
في صفحة إدخال نقاط التوقف، سترى نقاط توقف العنصر النشطة ونطاقات البكسل الخاصة بها.
لإضافة نقطة توقف مخصصة جديدة، استخدم حقل الإدخال لتعيين فقط أقصى عرض (بالبكسل).
على سبيل المثال، لاستهداف الأجهزة المحمولة الصغيرة، أدخل 600 بكسل كما العرض الأقصى.
بعد الحفظ، سيقوم النظام تلقائيًا بضبط Min-Width لنقطة التوقف الافتراضية التالية. في المثال أعلاه، سيتم تطبيق نقطة توقف “Small Mobile” على جميع الشاشات أقل من أو يساوي 600px، بينما ستبدأ نقطة توقف “Mobile” الافتراضية عند 601px وتنتهي عند الحد الأدنى لعرض نقطة توقف الجهاز اللوحي.
يمكنك إضافة أو إزالة نقاط التوقف حسب الحاجة من هذه الصفحة.
استخدام نقاط توقف العنصر المخصصة #
بمجرد تكوينها في إعدادات الإضافات الرئيسية، تصبح نقاط التوقف المخصصة متاحة مباشرة في محرر صفحة Elementor.
الخطوة 1: فتح وضع الاستجابة في العنصر #
انتقل إلى أي صفحة وانقر “Edit باستخدام Elementor.” انقر فوق وضع الاستجابة أيقونة (عادةً أيقونة شاشة وهاتف) في أسفل يسار اللوحة.
الخطوة 2: حدد نقطة توقف مخصصة #
سيعرض الشريط العلوي جميع نقاط التوقف المتاحة، بما في ذلك النقاط المخصصة التي قمت بإنشائها (على سبيل المثال، “Small Mobile”).
انقر على الخاص بك نقطة توقف مخصصة لتغيير عرض المحرر إلى حجم الشاشة المحدد هذا.
الخطوة 3: تطبيق الأنماط المخصصة #
حدد أي عنصر (على سبيل المثال، عنصر واجهة مستخدم العنوان).
انتقل إلى العناصر أسلوب علامة تبويب.
انقر فوق أيقونة مستجيبة (شاشة سطح المكتب) بجوار أي إعداد نمط، مثل الطباعة > الحجم أو المحتوى > المحاذاة.
حدد قيمة محددة لنقطة التوقف هذه (على سبيل المثال، قم بتعيين حجم الخط على 20px). لن تنطبق هذه القيمة إلا عندما يكون عرض المتصفح ضمن النطاق المحدد لنقطة التوقف المخصصة تلك.
الخطوة 4: الحفظ والمعاينة #
بمجرد تحديد أنماط الاستجابة الخاصة بك لجميع نقاط التوقف الضرورية، انقر فوق تحديث لحفظ الصفحة.
قم بمعاينة الصفحة مباشرة وقم بتغيير حجم نافذة المتصفح الخاص بك لرؤية نقاط التوقف المخصصة لديك تؤدي إلى تشغيل الأنماط الفريدة التي حددتها.
الأسئلة المتداولة #
كم عدد نقاط التوقف المخصصة التي يمكنني إضافتها في Elementor؟
تضيف Master Addons ما يصل إلى 3 نقاط توقف مخصصة في الخطة المجانية ونقاط توقف غير محدودة مع ماستر أدونز برو. كل نقطة توقف عبارة عن حجم شاشة إضافي ذو عرض أقصى يتم وضعه أعلى طرق عرض جهاز Elementor المضمنة تخطيطات سريعة الاستجابة.
كيف يمكنني إضافة نقطة توقف مخصصة في Elementor؟
قم بتثبيت ملحق نقاط التوقف المخصصة من علامة التبويب ملحق الإضافات الرئيسية، وافتح صفحة نقاط التوقف الجديدة ضمن قائمة الإضافات الرئيسية، وأدخل Max-Width بالبكسل، على سبيل المثال 600px للجوال الصغير. بعد الحفظ، تظهر نقطة التوقف الجديدة في وضع الاستجابة الخاص بـ Elementor الجاهز للأسلوب.
هل تتطلب نقاط التوقف المخصصة Elementor Pro؟
رقم نقاط التوقف المخصصة هي أ البرنامج المساعد للإضافات الرئيسيةليست ميزة Elementor Pro. يمنحك البرنامج الإضافي Custom Breakpoints المجاني ما يصل إلى 3 نقاط توقف مخصصة، والحد الأعلى فقط هو الذي يتطلب Master Addons Pro.
هل أحتاج إلى تعيين عرض أدنى لكل نقطة توقف؟
لا، أنت تدخل فقط إلى العرض الأقصى. يقوم Master Addons تلقائيًا بضبط الحد الأدنى لعرض نقطة التوقف التالية بحيث لا تتداخل النطاقات أبدًا، على سبيل المثال، نقطة توقف الهاتف المحمول الصغيرة 600px تجعل عرض الهاتف المحمول الافتراضي يبدأ عند 601px.
هل تؤدي نقاط التوقف المخصصة إلى إبطاء موقع الويب الخاص بي؟
لا. تضيف نقاط التوقف فقط استعلامات وسائط CSS القياسية، والتي تكون خفيفة الوزن، ويتم تحميل الأنماط التي قمت بتعيينها تمامًا مثل أنماط الاستجابة المضمنة في Elementor. يتبع العام أفضل ممارسات سرعة العنصر يحافظ على سرعة الصفحة بغض النظر عن عدد نقاط التوقف التي تستخدمها.
للمقارنة مع نقاط التوقف المضمنة في Elementor والعرض التوضيحي المباشر، راجع صفحة البرنامج المساعد لنقاط التوقف المخصصة.
