معرض المنزلق

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

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

ما تفعله أداة Gallery Slider #

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

قبل أن تبدأ #

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

كيفية إضافة عنصر واجهة مستخدم Elementor Gallery Slider #

افتح محرر Elementor وابحث عنه معرض المنزلق في لوحة العناصر، أو قم بالتمرير لأسفل إلى قسم الإضافات الرئيسية. تحمل كل أداة من عناصر واجهة المستخدم الخاصة بـ Master Addons شارة MA صغيرة، مما يساعدك عند تثبيت العديد من حزم الإضافات. اسحب الأداة إلى القسم الخاص بك.

إضافة صور في علامة التبويب المحتوى #

صالة عرض #

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

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

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

الصور المصغرة #

ال الصور المصغرة يتحكم القسم في الصور الصغيرة بجانب المعاينة.

• الصور المصغرة: إظهار أو إخفاء منطقة الصورة المصغرة بالكامل.
• دائري / الشبكة: قم بالتبديل بين الشبكة الثابتة والدوامة المتحركة.
• دقة الصورة: الحجم الذي يستخدمه WordPress للصور المصغرة. الصورة المصغرة (150 x 150) تحافظ على إضاءة الصفحة.
• الأعمدة: اختر من 1 إلى 12 عمودًا للشبكة. يؤدي الانتقال من 2 إلى 3 أعمدة إلى تغيير الشبكة من كتلة طويلة وضيقة إلى كتلة أكثر إحكامًا.
• طلب: احتفظ بالترتيب الافتراضي أو قم بتغيير كيفية فرز الصور.
• تسمية توضيحية: إظهار تعليق على الصور المصغرة، أو تركه في لا شيء.

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

معاينة #

ال معاينة يدير القسم الشريحة الكبيرة وكيف تتصرف.

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

صمم شريط التمرير في علامة التبويب "النمط" #

تخطيط #

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

• كومة على: اختر متى يتم تكديس التخطيط عموديًا، مثل Tablet & Mobile.
• عرض المعاينة (%): مقدار المساحة الأفقية التي تستغرقها المعاينة. في مكان ما بين 60 و70 بالمائة يقع بشكل جيد بجوار شبكة مكونة من ثلاثة أعمدة.
• تباعد: الفجوة بين المعاينة والصور المصغرة.

معاينة #

علامة التبويب النمط معاينة يقوم القسم بتصميم حاوية الشرائح الكبيرة.

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

معاينة التسميات التوضيحية #

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

معاينة تأثيرات التحويم #

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

الصور المصغرة #

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

تأثيرات تحوم الصور المصغرة #

يقوم هذا القسم بوضع الصور المصغرة عبر ثلاث ولايات: الافتراضي, تحوم، و نشط (الصورة المصغرة المطابقة للشريحة الحالية). ال الصور تغطي المجموعة لون الخلفية، التعتيم, مقياس, صندوق الظل، و مرشحات CSS. خارج الصندوق، توجد الصور المصغرة غير النشطة عند عتامة تبلغ 0.65، لذا تبرز الصورة النشطة. ال تراكب تضيف المجموعة طبقة لون أو تدرج مع وضع المزج, هامش, التعتيموضوابط الحدود.

هناك أيضا أنماط القسم الموجود أسفل علامة التبويب "النمط" مع الإعدادات المسبقة للنمط الجاهز. يظهر نفس القسم في العديد من عناصر واجهة المستخدم الخاصة بـ Master Addons.

شاهد النتيجة الحية #

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

حالات الاستخدام الشائعة #

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

نصائح للحصول على شريط تمرير معرض أفضل #

• مطابقة نسب العرض إلى الارتفاع للصورة. يمنع الارتفاع التلقائي اقتصاص المفاجآت، لكن النسب المتسقة تبدو أكثر نظافة وتمنع التخطيط من القفز.
• خدمة القرارات الصحيحة. ممتلئ للمعاينة، صورة مصغرة (150 x 150) للشبكة. الضغط قبل التحميل؛ انظر دليلنا إلى أفضل المكونات الإضافية لتحسين الصور WordPress.
• كتابة التسميات التوضيحية في مكتبة الوسائط قبل إدخال المعرض، تكون كل شريحة جاهزة.
• حافظ على سرعة التشغيل التلقائي معقولة. امنح الزائرين الوقت لرؤية كل صورة فعليًا.
• استخدم الحالة النشطة. إن العتامة الافتراضية البالغة 0.65 على الصور المصغرة غير النشطة توجه العين بالفعل؛ الحدود أو المقياس الطفيف على الصورة المصغرة النشطة يجعلها أكثر وضوحًا.

فيديو تعليمي #

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

الأسئلة المتداولة #

إلتحاق بالركب #

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

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