19 أمثلة على مواقع التجارة الإلكترونية Divi

إن تعدد استخدامات Divi يجعلها مثالية لمواقع التجارة الإلكترونية. يتكامل بشكل جيد مع WooCommerce وأنظمة التجارة الإلكترونية الأخرى. من المنطقي وجود الكثير من مواقع التجارة الإلكترونية التي تم إنشاؤها باستخدام Divi. في هذه المقالة ، سنلقي نظرة على 20 مثالًا لمواقع التجارة الإلكترونية التي تم إنشاؤها باستخدام Divi للمساعدة في إثارة خيالك.

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

1. شرق أفريقيا

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

انظر الموقع

2. الحلو سيسيليس

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

انظر الموقع

3. ورق وردي حديث

تبدو الصفحة الرئيسية لموقع Modern Pink Paper كمتجر وتستخدم ألوانًا ناعمة لجذب الجمهور المستهدف. يتضمن CTA لفئات مختلفة. تستخدم صفحات الفئات الأساسية نفس الصورة لكل فئة ولكنها تعرض العنوان فوق الصورة. تعرض صفحات الفئات الثانوية المنتجات ذات الفلتر. تحتوي صفحات المنتج على الكثير من خيارات الألوان والتخصيص. يمكن للمشتري تحديد اللون وإضافة اسم للتخصيص واختيار رؤية المنتج قبل الشحن وإضافة الرسائل والملاحظات. يستخدم وصف المنتج الأكورديون للأسئلة الشائعة.

انظر الموقع

4. تصاميم ورقة واحدة

يعرض One Leaf Designs صورًا للمنتج في شريط تمرير كامل العرض مع CTA متجر متبوعًا بقسم يضم أفضل البائعين. تعرض صفحة المتجر المنتجات في قسم محاصر يتداخل مع العنوان. تعرض صفحات المنتج المنتج بظل مربع لجميع الصور. تم تصميم النص ليتناسب مع الموقع. يتضمن روابط لمنتجات أخرى قد يحبها الزائر.

انظر الموقع

5. سلة إخوانه

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

انظر الموقع

6. محل العناية الطبيعية

يحتوي متجر Natural Care Shop على تصميم متجر جميل يحتوي على صور مرتبطة بالفئات. يستخدم ألوانًا ناعمة لجذب الجمهور المستهدف. تتضمن صفحات الفئات أدوات WooCommerce للشريط الجانبي و CTA في التذييل. يتم عرض المنتجات بصور كبيرة. تحتوي صفحات المنتج على رموز مصممة ومنتجات مماثلة في كلٍ من عنصر واجهة المستخدم وكصور CTA.

انظر الموقع

7. أبيس أستراليا

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

انظر الموقع

8. لاهلي

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

انظر الموقع

9. ليوكا

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

انظر الموقع

10. الرجل القذر

يوفر Scruffy Gentleman مربع بحث عن منتج أسفل العنوان متبوعًا بصورة خلفية كاملة العرض في المنظر. تقوم المنتجات المميزة بالتمرير فوقه وتداخل القسم التالي من المنتجات المميزة. يعرض قسم آخر CTA في المنظر متبوعًا بعناصر جديدة في المتجر. تتبع صفحة المتجر تصميمًا مشابهًا وتضيف شريطًا جانبيًا لـ WooCommerce. تظهر صفحات المنتج بالعرض الكامل وتتضمن صورًا كبيرة.

انظر الموقع

11. Veez

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

انظر الموقع

12. كوكو كوسكينو

يتضمن Coco Cuscino منزلق ملء الشاشة مع CTA متجر للفئات المختلفة. يظهر التمرير شريط تمرير لأحدث المنتجات مع عنوان قسم إلى اليسار. قسم آخر يتضمن CTAs لفئات مختلفة. تعتبر صفحات الفئات والمنتجات بسيطة وتحتوي على حدود ونصوص وأزرار وتذييل مخصص. تتضمن صفحة المنتج ظل الصندوق.

انظر الموقع

13. تارت وبيري

يعرض Tarte and Berry المنتجات في شريط تمرير ملء الشاشة باستخدام تأثير Ken Burns و CTA في المتجر. قسم صغير يوضح عملية الشراء بالأيقونات. فيما يلي قائمة كبيرة من المنتجات وقسم الشهادات. تتبع صفحة المتجر نفس التصميم ، ولكن بدون شريط التمرير. تم تصميم صفحات المنتج بحيث تتطابق مع الموقع وتتضمن مربعًا لإضافة رسالة مخصصة. الوصف يوضح المكونات. تعرض الصفحة أيضًا المنتجات ذات الصلة.

انظر الموقع

14. نيكي هيل الصيدلية

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

انظر الموقع

15. المسامير والعصفور

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

انظر الموقع

16. Kickbike

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

انظر الموقع

17. بوتيك غير مملح

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

انظر الموقع

18. ميسون للزهور

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

انظر الموقع

19. محل بسامي

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

انظر الموقع

خواطر ختامية

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

نريد أن نسمع منك. أي من مواقع التجارة الإلكترونية الخاصة بـ Divi هي المفضلة لديك؟ أخبرنا برأيك عنها في التعليقات.

صورة مميزة عبر TeraVector / shutterstock.com