اذهب إلى المحتوى

أفضل القوالب للتجارة الالكترونية ومتاجر ووكومرس


Ola Saleh

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

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

قوالب ووردبريس مناسبة للتجارة الإلكترونية

قد تتساءل ما الفرق بين قالب موقع عادي وقالب مخصص للمتجر الإلكتروني وهل يصلح أي قالب ووردبريس لأستخدمه في متجري؟

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

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

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

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

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

قالب لذيذ من بيكاليكا

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

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

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

قالب ASTRA من متجر قوالب ووردبريس

يتوفر من هذا القالب نسختان الأولى مجانية والثانية مدفوعة مستخدمة من قبل أكثر من مليون موقع. النسخة المدفوعة منه تكلف 59 دولار اشتراك لمدة عام ويمكنك استخدامها على عدد غير محدود من المواقع.

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

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

الفرق بين النسخة المدفوعة والمجانية هي في الدعم وسهولة التعديل على التصميم ويمكنك الاطلاع على التفاصيل عبر الرابط مقارنة بين Astra pro وAstra free.

كيفية تثبيت قالب من بيكاليكا

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

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

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

شراء قالب من بيكاليكا1.png

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

شراء قالب من بيكاليكا2.png

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

شراء قالب من بيكاليكا3.PNG

كل ما عليك الآن هو النقر فوق زر إتمام عملية الدفع ليتم اقتطاع سعر المنتج من رصيد حسابك في الموقع ويصلك إشعار بإتمام الطلب وتوفير رابط لتحميل القالب.

شراء قالب من بيكاليكا4.PNG

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

شراء قالب من بيكاليكا5.PNG

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

شراء قالب من بيكاليكا6.PNG

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

شراء قالب من بيكاليكا7.png

بعد اكتمال عملية التنصيب انقر فوق الرابط تفعيل لتفعيل قالب لذيذ في موقعك.

شراء قالب من بيكاليكا8.png

أخيرًا قم بتنصيب وتفعيل الإضافات المطلوبة مع القالب

شراء قالب من بيكاليكا9.PNG

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

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

شراء قالب من بيكاليكا10.png

بعد اكتمال عملية الاستيراد تظهر لك النافذة التالية التي تبين نجاح العملية:

شراء قالب من بيكاليكا11.PNG

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

شراء قالب من بيكاليكا12.png

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

شراء قالب من بيكاليكا13.png

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

كيفية تثبيت قالب من متجر ووردبريس الرسمي

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

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

سوف أستخدم موقع ووردبريس الذي أنشأته في درس سابق باستخدام استضافة Cloudways لذا سجل دخول لحسابك في الاستضافة وانتقل للوحة تحكم أدمن الموقع الموجودة على الرابط example.com/wp-login.php كما شرحنا في المقال السابق.

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

تثبيت استرا 1.jpg

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

تثبيت استرا2 .jpg

الآن اضغط على خيار "التنصيب الآن" ليبدأ الموقع برفع الملف من الحاسوب وفك ضغطه وتثبيته على الاستضافة.

تثبيت استرا3.jpg

وبعد الانتهاء من عملية التثبيت سوف يطلب منك الموقع تفعيل القالب وذلك بالضغط على خيار تفعيل.

تثبيت استرا4.jpg

بعد تفعيل القالب سوف يتم تحويلك إلى النافذة المبينة في الصورة التالية والتي تبين أنَّ القالب المفعل الآن أصبح Astra وفي حال قمت بزيارة الموقع سوف تلاحظ أنَّ شكله قد تغير.

تثبيت استرا 5.jpg

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

تثبيت استرا 6.png

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

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

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

لتثبت الإضافة يجب تسجيل الدخول للوحة تحكم الموقع بدور مسؤول ثم الانتقال إلى التبويب إضافات ثم تبويب "إضافة جديد" بعدها نكتب ضمن مربع البحث woocommerce ثم ننقر فوق زر التنصيب الآن للبدء بتنصيبها ثم زر تفعيل لتفعيلها على الموقع.

تثبيت استرا 7.jpg

بعد تفعيل الإضافة سوف ينقلك الموقع إلى صفحة إعداد إضافة ووكومرس WooCommerce ولأن إعداد الإضافة يتضمن العديد من المراحل سوف نتطرق لشرحها بالتفصيل في المقال التالي من هذه السلسلة، لذلك سنكتفي حاليًا بهذه الخطوة ونضغط على الرابط skip setup store details الظاهر أسفل الصفحة وسنعود لإتمام هذه العملية لاحقاً.

بالعودة لإضافة Starter Templates والبدء باستخدامها علينا التوجه من جديد للتبويب إضافات في لوحة التحكم والنقر فوق أضف جديد وكتابة starter templates Astra في مربع البحث وعند ظهور للإضافة المطلوبة ننقر فوق زر التنصيب الآن ثم تفعيل.

تثبيت استرا 8.png

بعد تفعيل الإضافة ستلاحظ وجود خيار جديد في التبويب المظهر باسم Starter Templates وبالنقر فوقه ستظهر لك صفحة تعريفية بالإضافة، انقر فوق الزر Build Your Website Now للبدء باستخدامها وبناء موقعك بالاستعانة بأحد تصاميمها.

الخطوة التالية هي تحديد إضافة باني الصفحات التي ستعتمدها لتحرير موقعك وهنا أفضل اختيار محرر ووردبريس الافتراضي Block Editor المعروف كذلك باسم محرر جوتنبرج Gutenberg فهو محرر مرن وسهل الاستخدام وقابل للتوسيع من خلال إضافات مساعدة بعدها سأنتقل مباشرة للخطوة التالية.

تثبيت استرا 9.png

تستطيع اختيار ما شئت من قوالب تعجبك وتتناسب مع تصميم ومحتوى موقعك، أما بالنسبة لي فسوف أختار التصميم Organic Store.

تثبيت استرا 10.png

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

تثبيت استرا 11.png

بعد انتهاء عملية الاستيراد بنجاح سوف تظهر لك رسالة تخبرك بأن الأمر تم بنجاح ويمكنك الآن استعراض الشكل الجديد للموقع بالنقر فوق الزر View your website وستلاحظ التغيير الكبير الذي ظهر على مظهر الموقع ومحتوياته من صفحات ومقالات.

تثبيت استرا 12.png

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

تثبيت استرا 13.jpg

خاتمة

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

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

اقرأ أيضًا


تفاعل الأعضاء

أفضل التعليقات

بتاريخ On 12‏/4‏/2021 at 11:05 قال Yara salhab:

Hi;

??why some themes have a child theme and others not 

بعض المصممين و المطورين يقومون بإستخدام Child Theme لتعديل سمة موجودة (في الثيم الأب أي الرئيسي) دون فقد القدرة على تحديث السمة الأصلية إذا لزم الأمر و وهذا الأمر يرجع للمصمم والمطور إذا أراد إنشاء Child Theme أو لا

رابط هذا التعليق
شارك على الشبكات الإجتماعية

بتاريخ On 12‏/4‏/2021 at 12:05 قال Yara salhab:

 cannot reach an starter template to import the elements

 even though I had installed the Elemenator plugin   

هل ممكن ترفقي رابط الثيم, أود الإطلاع عليه هل يوفر demos أو لا؟ 

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

رابط هذا التعليق
شارك على الشبكات الإجتماعية



انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أضف تعليق

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • أضف...