في هذا المنشور، سنوضح لك كيفية الجمع بين Elementor وWC Product Table لإنشاء موقع WordPress أكثر تخصيصًا مع زيادة مبيعات متجر WooCommerce الخاص بك أيضًا.
يعمل WordPress على تبسيط عملية إنشاء موقع ويب وتشغيله بسرعة. WooCommerce هو plugin WordPress يسمح لك بتحويل أي موقع ويب WordPress إلى متجر إلكتروني يعمل بكامل طاقته. أنت تخاطر بإنشاء موقع مقلد، ومع ذلك، إذا واصلت استخدام خياراته وميزاته الافتراضية، فقد لا يكون هذا مناسبًا لاحتياجات عملك. من المهم تحديد أفضل الأدوات لتصميم وتخصيص موقع الويب الخاص بك حتى يصل إلى ما تريده.
plugin لـ WordPress وWooCommerce لتحسين وظائف متجرك — Elementor، على سبيل المثال amp هي الأداة الأكثر مباشرة لتخصيص صفحة منتج WooCommerce الخاصة بك. على الرغم من أنها واحدة من أهم مزاياها، إلا أن لها أيضًا بعض العيوب المهمة. على amp ، عند دمج مكونات WordPress plugin من مؤلفين مختلفين، فإنك تتعرض لخطر مواجهة أخطاء التوافق والتعقيدات الأخرى؛ ليس هذا هو الحال عند استخدام WooCommerce Product Table plugin Elementor لمواقع WordPress الإلكترونية. سيكون لديك تحكم أكبر في مظهر موقعك ووظائفه عند استخدام أي من هذه plugin ، ويمكن استخدامها معًا للحصول على المزيد من النتائج الممتازة.
- نظرة عامة سريعة على جدول منتجات WooCommerce وأطر عمل Elementor
- لدمج جدول منتج WooCommerce في محرر نصوص أو عنصر واجهة مستخدم للرمز القصير، اتبع الخطوات التالية:
- يمكن استخدام الأكورديون وعلامات التبويب والمفاتيح لتنظيم العديد من جداول المنتجات.
نظرة عامة سريعة على جدول منتجات WooCommerce وأطر عمل Elementor
كما ذكرنا سابقًا، هناك مجموعة واسعة من مكونات WordPress plugin المتاحة لمساعدتك في إنشاء موقع WordPress أفضل مخصص وفقًا لمتطلباتك المحددة. تم تصميم بعض plugin لاستخدامها على نطاق واسع، بينما تم تصميم البعض الآخر لإضافة جانب أو ميزة معينة.
Elementor هو amp على النوع الأول من التطبيق:
يوفر لك plugin لإنشاء الصفحات واجهة جديدة تمامًا لإنشاء صفحات الويب وإنشاء موقع WordPress الخاص بك. يمكنك الحصول على قدر كبير من التحكم في الطريقة التي يتم بها تجميع موقع الويب الخاص بك عن طريق الاختيار من مكتبة واسعة من عناصر واجهة المستخدم والكتل والتخطيطات وتخصيصها.
على الرغم من أن جدول منتجات WooCommerce يعد حلاً أكثر عمومية، إلا أنه أكثر استهدافًا أيضًا:
يتيح لك هذا plugin إنشاء جداول ديناميكية وقابلة للتخصيص بالكامل تسرد منتجات وخدمات WooCommerce الخاصة بك. ومع ذلك، نظرًا لتفاعلها مع WooCommerce، فإن هذه الجداول مناسبة بشكل خاص لعرض العناصر والخدمات بطريقة سهلة الاستخدام وجذابة للمتسوقين عبر الإنترنت. يتفاعل plugin Posts Table Pro بالتساوي مع Elementor ويسرد أي نوع محتوى WordPress في جدول بدلاً من مجرد منتجات WooCommerce (إذا كنت ترغب في عرض شيء منفصل عن المنتجات - مثل المنشورات أو الصفحات أو المستندات)، فيمكن استخدامه بدلاً من ذلك.
WooCommerce Product Table مع بعضهما البعض، يوفران إمكانات متنوعة بشكل كبير. يمكنك الاستفادة منها لإنتاج بعض التأثيرات المهمة للغاية التي ستساعد في زيادة عدد المبيعات لمتجر WooCommerce الخاص بك.
الآن حان الوقت للبدء في العمل. في الأقسام التالية، سنلقي نظرة على بعض amp الواقعية لكيفية استخدام جدول منتجات WooCommerce وElementor لإنشاء تأثيرات مشابهة لتلك الموضحة أعلاه.
عندما يتعلق الأمر بالجمع بين هذين المكونين plugin ، فإن الحدود هي السماء - وهذه مجرد أمثلة قليلة من الاحتمالات. مع القليل من التجربة والخطأ، يمكنك تجميع صفحات مختلفة معًا باستخدام نفس النهج الأساسي الذي سنوضحه.
أولاً وقبل كل شيء، ستحتاج إلى التأكد من تثبيت كلا plugin بشكل صحيح على موقعك. من الجيد أن يكون تثبيت Elementor وتكوين جدول منتجات WooCommerce أمرًا سهلاً ومباشرًا. يجب أيضًا تثبيت WooCommerce نفسه وتمكينه قبل أن تتمكن من متابعة هذه الخطوة. وبعد ذلك ستكون جاهزًا للبدء في العمل على مشروعك.
لدمج جدول منتج WooCommerce في محرر نصوص أو عنصر واجهة مستخدم للرمز القصير، اتبع الخطوات التالية:
لنبدأ بالتطبيق الأساسي والأكثر فائدة قدر الإمكان. وبدلاً من ذلك، إذا كنت تريد ببساطة استخدام جدول منتج ديناميكي على موقع Elementor الخاص بك، فيمكنك إضافته إلى عنصر واجهة المستخدم وإظهاره في الواجهة الأمامية لموقع الويب.
تأكد من أنك تستخدم محرر Elementor عند فتح أي صفحة أو منشور لإنجاز ذلك. إذا ظهرت لك واجهة WordPress المألوفة، فانقر فوق الزر "تحرير باستخدام Elementor" للتبديل إلى واجهة Elementor:
إذا كانت هذه هي المرة الأولى التي تعمل فيها مع Elementor، فلنقم بجولة صغيرة حول النظام الأساسي. ستظهر منطقة كبيرة على اليمين حيث سيتم عرض المحتوى الخاص بك، وسيتم تحديثه في الوقت الفعلي عند إضافته وتعديله. على الجانب الأيسر من الشاشة، توجد قائمة بـ "الأدوات" التي يمكنك سحبها إلى المنطقة المخصصة ثم إعادة تنظيمها وتكوينها حسب الحاجة:
يمكن استخدام جدول المنتج مع مجموعة متنوعة من أدوات Elementor المختلفة. إذا كنت تريد فقط عرض جدول منتج واحد على الصفحة، فيمكنك تحقيق ذلك عن طريق تضمين قسم نص تمهيدي في كود HTML الخاص بالصفحة. التقط أداة محرر النصوص وانقلها إلى مكان فارغ كما يلي:
بعد ذلك، يمكنك النقر داخل الأداة لإزالة النص الافتراضي واستبداله بأي محتوى تريده. عندما يتعلق الأمر بجدول المنتج نفسه، يمكنك تضمينه عن طريق لصق هذا الرمز القصير البسيط:
[جدول المنتج]
عندما تقوم بإدراج الرمز القصير في صفحتك، سيظهر الجدول في الموقع الذي تحدده، والذي يمكنك التحقق منه من خلال عرضه على الواجهة الأمامية:
إذا كنت تريد فقط استخدام عنصر للكود نفسه، فيمكنك استخدام أداة الرمز القصير.
لا تنس أبدًا حفظ الصفحة عند الانتهاء من تحديد موضع الجدول، بغض النظر عن المكان الذي تقرر وضعه فيه. بعد ذلك، قد ترغب في إجراء بعض التغييرات على كيفية ظهور الجدول ووظائفه.
ارجع إلى لوحة تحكم WordPress الخاصة بك وانتقل إلى علامة التبويب WooCommerce > الإعدادات لإكمال هذه المهمة. يمكن العثور على جداول المنتجات عن طريق تحديد المنتجات في الجزء العلوي من الشاشة ثم جداول المنتجات:
يمكن العثور على قائمة شاملة بالخيارات لتكوين جدول منتج WooCommerce الخاص بك هنا. لديك سيطرة كاملة على المعلومات التي تظهر في الجدول، ويمكنك تخصيصها عن طريق إضافة عوامل التصفية والمتغيرات، من بين أشياء أخرى. راجع وثائق plugin لمزيد من المعلومات حول الاختيارات المختلفة.
ستتمكن من تعديل جدول المنتج الذي أنشأته للتو باستخدام Elementor دون الحاجة إلى القيام بأي شيء آخر. بمجرد الانتهاء من تخصيص الجدول وفقًا لمواصفاتك، ما عليك سوى حفظ تغييراتك، وستكون جاهزًا للبدء!
يمكن استخدام الأكورديون وعلامات التبويب والمفاتيح لتنظيم العديد من جداول المنتجات.
يعمل الحل أعلاه بشكل جيد إذا كنت تريد تقديم جدول واحد يحتوي على منتجات WooCommerce الخاصة بك. إذا كنت ستقوم بإنشاء العديد من الجداول، كل منها يحتوي على فئة مختلفة من الكائنات، فهذا ليس الخيار الأفضل.
هناك عدة طرق مختلفة لتحقيق ذلك في Elementor. على amp ، يمكن استخدام عنصر واجهة المستخدم Accordion لتوليد نفس التأثير الذي رأيناه في دراسة الحالة الأخيرة. بدءًا من منطقة التحرير اليمنى، انقل أداة Accordion إلى منطقة التحرير اليسرى.
يمكنك إنشاء أي عدد تريده من علامات التبويب المنفصلة من خلال النقر على علامات الزائد، ويمكنك تخصيص العناوين والنصوص داخل كل علامة تبويب. بالإضافة إلى ذلك، يمكنك إضافة جدول منتج إلى علامة تبويب واحدة أو أكثر باستخدام نفس الرمز القصير كما ذكرنا سابقًا.
بالطبع، سيؤدي مجرد إضافة الرمز القصير الأساسي إلى سلسلة متتالية من جداول المنتجات المماثلة، وهو على الأرجح ليس ما كنت تبحث عنه في المقام الأول. بدلاً من ذلك، ستحتاج إلى تخصيص كل رمز قصير لعرض منتجات محددة فقط - على سبيل amp ، عناصر من فئة معينة - بدلاً من جميع المنتجات.
سيتم تحديد الطريقة التي تستخدمها حسب المنتجات التي ترغب في تضمينها وحذفها من كل جدول معني. للحصول على معلومات إضافية، يرجى الاطلاع على الدليل الكامل لتخصيص الرموز المختصرة لجدول منتجات WooCommerce.
تجدر الإشارة إلى أنه يمكنك تحقيق تأثير مماثل بمساعدة بعض أدوات Elementor المفيدة الأخرى؛ يشتمل ذلك على أداة Toggle وأداة Tabs، من بين المكونات الأخرى. فيما يتعلق بتقديم العديد من جداول منتجات WooCommerce بطريقة جذابة ومنظمة جيدًا، فإن Elementor هي أداتك المفضلة.
قم بتنظيف العلامات غير المتقنة بفضل أدوات تنظيم HTML وCSS وJavaScript المجانية عبر الإنترنت!
ضع بعض التفكير الجاد في تصميم موقع التجارة الإلكترونية الخاص بك إذا كنت تريد أن يبرز عملك عن المنافسة. على amp ، ستحتاج إلى تحديد الطريقة الأكثر فعالية لعرض منتجاتك، ومن الأفضل أن يكون ذلك بأسلوب سهل الاستخدام وجذاب للعين.
لحسن الحظ، فإن استخدام plugin WooCommerce Product Table مع Elementor يجعل هذه المهمة سهلة. يمكن استخدام الرمز القصير لجدول المنتج الخاص بك لعرض كل ما يقدمه موقعك (أو مجرد مجموعة مختارة) بطريقة ديناميكية حقًا.
