معرض الصور القابلة للتصفية

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

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

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

ما تفعله أداة معرض الصور القابلة للتصفية #

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

قبل أن تبدأ #

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

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

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

قم ببناء معرض الصور الخاص بك في علامة التبويب "المحتوى" #

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

محتويات المعرض #

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

كل عنصر له نفس الحقول:

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

دقة الصورة والأعمدة #

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

إعدادات #

ال إعدادات يتحكم القسم في سلوك المعرض العام.

• إظهار عامل تصفية التنقل؟: يعرض أزرار تصفية الفئة أعلى الشبكة.
• إظهار علامة تبويب عامل التصفية “All”: يضيف زر الكل حتى يتمكن الزائرون من إعادة ضبط عامل التصفية.
• جميع الفئات النص: تسمية زر إعادة الضبط، عادةً الكل.
• إظهار تلميح الأداة؟: تمكين تلميحات الأدوات على أزرار التصفية.
• نسبة جانب الصورة: يفرض نسبة ثابتة عبر كل صورة.
• مزراب: المسافة بين عناصر الشبكة.
• البناء: يقوم بتحويل الشبكة إلى تخطيط البناء لارتفاعات الصورة غير المتساوية.
• مقياس التحويم: يقوم بتكبير الصورة قليلاً عند التمرير.
• قيمة المقياس: كم يتم تكبير الصورة، مثل 1.1.
• تأثير الميل: يضيف إمالة ثلاثية الأبعاد تتبع المؤشر.

إعداد التراكب #

ال إعداد التراكب يقرر القسم ما يظهر عندما يحوم الزائر فوق عنصر ما.

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

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

ال أسلوب تغطي علامة التبويب حاوية البطاقة والصورة والتراكب والأزرار.

نمط العنصر #

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

نمط الصورة #

نمط الصورة أنماط الصورة نفسها وحالة التحليق الخاصة بها.

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

تراكب #

ال تراكب يختار القسم الرسوم المتحركة للتحليق. تتضمن الخيارات Fade In، وSlide From Left، وSlide From Top، وMask From Bottom، وRotate In، وZoom In، وScale Up. Fade In هو الإعداد الافتراضي الآمن؛ تجذب متغيرات الشريحة والتدوير المزيد من الاهتمام لنفسها، وهو ما قد تريده أو لا تريده في المحفظة.

الزر الأول والثاني #

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

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

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

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

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

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

نصائح لمعرض أفضل قابل للتصفية #

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

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

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

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

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

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

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