كيفية تغيير قالب صفحة المتجر في WordPress

نشرت: 2022-09-27

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

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

يمكنك تغيير بنية صفحة المتجر الخاصة بك باستخدام Gutenberg Blocks في الخطوة 3. يمكن الوصول إلى إعدادات الحظر بالنقر فوق كل كتلة في القسم الأيمن. يمكنك إظهار متجرك عن طريق إدخال / التسوق بعد عنوان URL في الواجهة الأمامية لموقع الويب الخاص بك. الخطوة الأخيرة هي فحص مشروعك والانتهاء منه. حان الوقت الآن للتأكد من إعداد المتجر وتشغيله. نظرًا لأنه تم تطويره من قبل المطورين أنفسهم ، فإن WooCommerce Storefront هو إلى حد بعيد الموضوع الأكثر شعبية في السوق اليوم. سيتم توجيهك إلى صفحة المتجر بعد هذه الخطوة ، لأن عنوان URL المرتبط بصفحة متجرك (على سبيل المثال ، www.wooshop.com/shop) سيختفي بعد هذه الخطوة ، مما ينتج عنه ".com" أو ".in" نسخة من رابط موقع الويب الخاص بك.

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

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

هل يمكننا تحرير صفحة المتجر باستخدام Elementor؟

الائتمان: www.digitug.com

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

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

استخدم Elementor لتخصيص صفحات منتج Woocommerce بسهولة

يمكن استخدام هذه الأداة القوية كمكوِّن إضافي لبرنامج WordPress أو كامتداد لـ Shopify ، وهي منصة مستخدمة على نطاق واسع. إذا كنت تستخدم أيًا من هذه الأنظمة الأساسية ، فيمكنك تحرير صفحات المنتج في دقائق ، دون الحاجة إلى تعلم أي ترميز.
يمكنك البدء في استخدام WooCommerce على الفور باستخدام أحد القوالب المعدة مسبقًا لمجموعة متنوعة من السمات المختلفة. من السهل تخصيص تصميم بمجرد توفره في واجهة السحب والإفلات في Elementor.

تخصيص رمز Woocommerce لصفحة المتجر

الائتمان: quadlayers.com

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

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

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

ضع الكود التالي في ملف archive-product.html لتظهر لك أشهر المنتجات. بمساعدة Page Builder ، يمكن لأي شخص لديه خبرة قليلة في الترميز إنشاء موقع ويب. يمكن للمستخدمين تحرير صفحات متجرهم بسهولة باستخدام أداة إنشاء الصفحات. هناك أيضًا سمات أخرى متاحة ، مثل عدد الأعمدة وعدد العناصر المعروضة في كل عمود. يمكن استخدام جميع أدوات إنشاء الصفحات (Elementor و Divi و Visual Composer وما إلى ذلك) مع هذه الطريقة. هذا دليل خطوة بخطوة لإنشاء صفحة متجر WooCommerce عالية الجودة . يمثل الجمهور ونوع المنتج والموقع الجغرافي والصناعة وما إلى ذلك جميعًا اعتبارات مهمة لكل شركة.

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

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

Woocommerce: كيفية تجاوز صفحات التسوق على أساس كل منتج

يمكن تعيين صفحة متجر المنتج على أساس كل منتج بالنقر فوق رمز WooCommerce في إعدادات WooCommerce> المنتجات> صفحات التسوق.

تخصيص Woocommerce Shop Page Divi

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

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

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

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

هل Divi جيد لـ Woocommerce؟

تسمح لك وحدات Divi باستخدامها على أي صفحة أو منشور على موقع الويب الخاص بك (وليس فقط صفحات منتج WooCommerce ). يمكن تضمين زر Woo Add To Cart لمنتج معين في متجرك في صفحة مقصودة مخصصة للمنتج ، على سبيل المثال.

عنصر مقابل. ديفي: ما هو أفضل منشئ مواقع الويب؟

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

البرنامج المساعد لقالب صفحة متجر Woocommerce

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

يتم تضمين قوالب أرشيف المنتج كجزء من قالب صفحة متجر Wooocommerce. التغييرات التي أجريتها على نموذج متجري غير مرئية على صفحة المتجر. في هذه الحالة ، يجب عليك إنشاء سمة فرعية وإجراء هذه التغييرات في قالب فرعي حتى لا يتأثر متجرك بالتغييرات التي تطرأ على السمة الأصلية. يمكن العثور على الكود في الجزء العلوي من WP-content hemes ** theme * woocommerce * archive-product.php ، والذي سينشئ ملف content-shop.html في المجلد الجذر الخاص بالنسق الخاص بك. يستخدم هذا الرمز العلامة الشرطية is_shop لأنه كان على الصفحة التي كنت تحاول تغييرها. باتباع رمز get_header ، يمكنك التأكد من بقاء عنوان صفحة المتجر كما هو.

أين تجد قالب صفحة متجر Woocommerce

هناك عدد قليل من الأماكن التي يمكنك البحث عنها للعثور على قالب صفحة متجر WooCommerce. الأول هو البحث عنه على موقع WooCommerce. مكان آخر للبحث فيه هو موقع WordPress. أخيرًا ، يمكنك أيضًا البحث عنها على Google.

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

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

.php كيفية الوصول إلى قوالب Woocommerce

يمكن استخدام الكود التالي للوصول إلى القوالب بمجرد اكتشافها:
يتوفر عنوان URL التالي للتنزيل المجاني من: http://example.com/wp-content/plugins/woocommerce/templates/.
في هذا المثال ، سيتم استخدام الكود التالي للوصول إلى قالب أرشيف المنتج: * br. على موقع الويب www.example.com/wwe-content/plugins/wwe-commerce/templates/product-archive ، يوجد مثال لصفحة مكونات WordPress الإضافية.