كيفية استخدام تكرار متداخل في عنصر Elementor لتخصيص خطط الأسعار
إن استخدام أدوات التصميم مثل Elementor يمكن أن يسهل إنشاء صفحات ويب احترافية بسرعة. من بين الميزات البارزة التي يوفرها Elementor هي القدرة على إضافة عناصر متكررة باستخدام التحكم المتداخل، وهو أمر مفيد بشكل خاص عند إنشاء خطط تسعير مع ميزات مضافة. في هذا المقال، سنتناول كيف يمكن تنفيذ التحكم المتداخل في تكرار عناصر Elementor، مما يتيح لك إضافة ميزات إلى خطط التسعير دون أن يتسبب ذلك في إضافة خطة جديدة عند إضافة ميزات جديدة.
فهم التحكم في التكرار المتداخل
التحكم في التكرار يسمح لك بإنشاء مجموعات من العناصر القابلة لتكرارها في واجهة المستخدم الخاصة بك. في حالة خطط التسعير، قد تحتاج إلى إدراج ميزات متعددة لكل خطة بدون إضافة خطة جديدة في كل مرة. تعتبر هذه عملية بسيطة إذا تم إعدادها بشكل صحيح.
خطوات إعداد التحكم المتداخل في التكرار
للبدء، يجب عليك إنشاء قسم جديد لخطط التسعير باستخدام start_controls_section
. هذه الخطوة تمنحك الفرصة لتحديد الخصائص والمميزات التي تريد عرضها. بعد ذلك، يجب عليك إعداد مثيل من Repeater
لخطط التسعير، حيث يمكنك إضافة تحكمات مختلفة مثل اسم الخطة، والسعر، والوصف.
إليك كيفية إعداد هذا الجزء:
$plan_repeater = new \Elementor\Repeater();
$plan_repeater->add_control(
'plan_name',
[
'label' => esc_html__('اسم الخطة', 'apct-pricing-card-widget'),
'type' => Controls_Manager::TEXT,
'default' => esc_html__('أساسي', 'apct-pricing-card-widget'),
'label_block' => true,
]
);
من الضروري أيضاً إدراج التحكم في الميزات باستخدام Repeater متداخل. يجب التحقق من كيفية إعداد Repeater للميزات داخل Repeater الخطط. هذا يضمن أن كل خطة تحتوي على مجموعة من الميزات الخاصة بها.
$feature_repeater = new \Elementor\Repeater();
$feature_repeater->add_control(
'feature_text',
[
'label' => esc_html__('نص الميزة', 'apct-pricing-card-widget'),
'type' => Controls_Manager::TEXT,
'default' => esc_html__('عنصر الميزة', 'apct-pricing-card-widget'),
'label_block' => true,
]
);
ثم، يمكنك إضافة قائمة الميزات إلى Repeater الخطط، مما يسمح لك بتنظيم الميزات بطريقة مرتبة.
تجنب إضافة خطة جديدة مع كل ميزة جديدة
واحدة من المشكلات الشائعة عند العمل مع أدوات التكرار المتداخلة هي إضافة خطط جديدة عندما تهدف فقط لإضافة ميزات لأحد الخطط. لضمان عدم حدوث ذلك، تأكد من أن إعدادك صحيح. عند إضافة التحكم لمخطط الميزات داخل Repeater الرئيسي الخاص بخطط التسعير، يجب أن تضمن عدم وجود تعارضات في التعريف.
ببساطة، يجب إرفاق Repeater الميزات مع الـ Repeater الخاص بخطط التسعير بدون تغيير في الـ ID للمخطط الأساسي.
التقدم بخطواتك
مع الانتهاء من إعداد الـ Repeater المتداخل، يمكنك الانتقال إلى مرحلة العرض. سيساعدك استخدام render
على استخراج البيانات المعروضة بشكل مناسب. يمكن أن يبدو ذلك كما يلي:
protected function render() {
$settings = $this->get_settings_for_display();
foreach ($settings['plans_list'] as $item) {
foreach ($item['features_list'] as $feature) {
// عرض المعلومات هنا
}
}
}
إن اتباع هيكل الشفرة هذا يضمن لك إنشاء واجهة مرنة وفعّالة، مما يسهل إدارة الميزات أثناء عملك على خطط التسعير.
خاتمة
بعد تنفيذ الخطوات المذكورة، ستتمكن من إضافة ميزات إلى خطط التسعير الخاصة بك دون إدخال قلق حول إضافة خطط جديدة بشكل غير متوقع. إن الفهم السليم لكيفية استخدامها سيمكنك من تصميم مخططات تسعير معقدة وجذابة في Elementor. تعتبر مراقبة العناصر المتداخلة أمرًا بالغ الأهمية، ويساعدك ذلك في تحقيق مرونة أكبر في تصميمك. تحقيق التوازن بين التكرار والوظيفة سيسمح لك بتقديم أفضل تجربة مستخدم لموقعك الإلكتروني.