هل تريد عرض محتوى ديناميكي مثل منشورات المدونة أو المنتجات أو أنواع النشرات المخصصة في تخطيطات مخصصة تمامًا - دون لمس خط رمز؟ وحدة الحلقة في Beaver Builder تجعل من الممكن.

تم تقديم وحدة Loop في Beaver Themer 1.5 و Beaver Builder 2.9 ، وهي أداة قوية تتيح لك تصميم تخطيطات قابلة للتكرار باستخدام وحدات بناء القندس القياسية. سواء كنت تقوم ببناء مدونة أو محفظة أو قائمة أحداث أو متجر WooCommerce ، تمنحك هذه الوحدة التحكم الكامل في التصميم مع محتوى ديناميكي في جوهره.

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

ما هي وحدة الحلقة؟

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

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

• فئات أو علامات WooCommerce - عرض فئات المنتجات أو العلامات ذات الصلة على صفحات المنتج الفردية باستخدام مصدر استعلام التصنيف.
• شبكة المحتوى المخصصة - إظهار المحتوى الديناميكي مثل أعضاء الفريق أو الشهادات باستخدام مصدر استعلام Defeater ACF على صفحات مثل "تلبية الفريق" أو قوائم الخدمة.
• المشاركات ذات الصلة - ميزة محتوى المدونة ذات الصلة على صفحات ما بعد واحد مع مصدر استعلام العلاقات ACF ، والمساعدة في زيادة المشاركة وتقليل معدلات الارتداد.

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

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

وحدة الحلقة مليئة بالقدرات التي تجعلها مثالية لبناء صفحات مرنة وغنية بالمحتوى:

• الاستعلام عن المحتوى الديناميكي من أي نوع منشور (قياسي أو مخصص)
• استخدم أي وحدة بناء بيفر داخل تخطيط الحلقة
• توصيل الحقول ديناميكيًا (على سبيل المثال ، العنوان ، صورة مميزة ، نشر meta)
• اختر من بين أنواع تخطيطات متعددة مثل الشبكة أو القائمة أو الكاروسيل
• أضف مرشحات وترقيم الصفحات لتعزيز تجربة المستخدم

يتيح لك هذا المزيج من التخصيص والأتمتة إنشاء تخطيطات متقدمة دون كتابة HTML أو PHP أو CSS.

كيفية بناء حلقة مخصصة

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

حلقة وحدة التخطيط المسبق للوحدة

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

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

بناء من الصفر مع تخطيط فارغ

تفضل إنشاء شيء مخصص تمامًا؟ اختر خيار التصميم الفارغ واتبع هذه الخطوات:

1. أضف وحدة الحلقة إلى صفحتك أو نشرها في محرر Beaver Builder.
   
2. حدد التصميم الفارغ لتبدأ بحاوية حلقة فارغة.
   
3. قم بتكوين إعدادات الحلقة لتحديد المحتوى الذي تريد عرضه - مثل منشورات المدونة ، أو منتجات WooCommerce ، أو حقول مكرر ACF ، أو أنواع المنشورات المخصصة.
   
4. اسحب الوحدات النمطية إلى حاوية الحلقة لبناء تخطيطك من الصفر. أضف أي وحدات بناء بيفر التي تحتاجها ، مثل العناوين والصور والرموز والأزرار والمزيد.
   
5. استخدم اتصالات الحقل لسحب المحتوى الديناميكي مثل العناوين أو الصور أو الأسعار أو الحقول المخصصة لكل عنصر حلقة.
   
6. قم بترتيب وحداتك باستخدام أدوات السحب والإفلات من Beaver Builder.

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

استخدم وحدة المربع للتحكم في التصميم

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

• لف وحدة الحلقة داخل وحدة مربع لإدارة عرض الحاوية الخارجية والحشو والهامش وتصميم الخلفية. يمنحك هذا تحكمًا كاملاً في كيفية جلسات محتوى الحلقة الخاصة بك في تخطيط الصفحة العام.
• Nest A Box Module داخل الحلقة لتجميع المحتوى الداخلي لكل عنصر حلقة. يتيح لك هذا الإعداد الاستفادة من تقنيات التصميم المتقدمة مثل شبكة CSS أو Flexbox . على سبيل المثال ، يمكنك إنشاء تخطيط من عمود داخل كل عنصر حلقة. ضع صورة على اليسار والنص على اليمين - مع التحكم الكامل في التباعد والمحاذاة.

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

إعدادات الاستعلام: ما هو المحتوى الذي سيتم عرضه؟

تتيح لك علامة تبويب المحتوى في وحدة الحلقة التحكم في كيفية الاستعلام عن محتوى الحلقة وعرضها مثل:

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

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

ترقيم الصفحات

تتيح لك علامة التبويب ترقيم الصفحات التحكم في كيفية تقسيم المحتوى وعرضه عبر صفحات متعددة - وهو أمر محسّن لتحسين التنقل وتجربة المستخدم.

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

تساعد هذه الخيارات في تخصيص تسليم المحتوى لأهداف تخطيطك وأهداف تفاعل المستخدم.

البيانات الديناميكية مع اتصالات الحقل

داخل تخطيط الحلقة ، يمكنك استخدام اتصالات الحقل لسحب بيانات النشر ديناميكيًا مثل:

• ما بعد العنوان
• صورة مميزة
• مقتطف أو محتوى كامل
• الحقول المخصصة
• المؤلف ، التاريخ ، الفئة ، العلامات

يمكن توصيل أي وحدة نمطية تدعم المحتوى الديناميكي (مثل العنوان ، الصورة ، الزر ، HTML ، وما إلى ذلك) بالبيانات النشر.

التصميم المتقدم والمنطق الشرطي

هل تريد تصميم أنواع المنشورات المختلفة بشكل مختلف أو إظهار/إخفاء العناصر بناءً على الظروف؟ تدعم وحدة الحلقة المنطق الشرطي وفئات CSS المخصصة .

على سبيل المثال ، يمكنك:

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

يتيح لك ذلك ضبط تجربة المستخدم والحفاظ على العلامات التجارية المتسقة عبر المحتوى الخاص بك.

حالات استخدام وحدة حلقة العالم الحقيقي

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

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

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

الأفكار النهائية: لماذا تستخدم وحدة الحلقة؟

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

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