موضوع مسطح
Flatsome عبارة عن سمة WordPress قوية مصممة لمواقع التجارة الإلكترونية وتأتي مع تكامل WooCommerce.
إنها واحدة من سمات WooCommerce الأكثر شهرة على ThemeForest. اعتبارًا من وقت كتابة هذا البرنامج التعليمي، كانت المبيعات قد تجاوزت 174,500 وتقييمًا رائعًا بـ 4.8 نجوم من أكثر من 6,600 مراجعة.
تم تصميم Flatsome في المقام الأول مع وضع المستخدمين المبتدئين وغير المتمرسين في مجال التكنولوجيا في الاعتبار.
يعد هذا أمرًا رائعًا للأشخاص الذين يرغبون في بدء عمل تجاري عبر الإنترنت ولكنهم لا يعرفون كيفية البرمجة أو ليس لديهم الميزانية اللازمة لتوظيف مبرمج محترف. مع Flatsome، ستتمكن من إنشاء موقع ويب ذو مظهر احترافي باستخدام أدوات بسيطة وبديهية.
الآن، يأتي Flatsome مليئًا بالعديد من الميزات والوظائف الرائعة. لعرض ما هو متاح وكيفية عمله، لدينا برنامج تعليمي سريع يوضح لك كيفية إنشاء صفحة منتج WooCommerce باستخدام Flatsome.
لذلك، دون مزيد من اللغط، دعونا نبدأ:
جدول المحتويات:
- موضوع مسطح
- الفرق بين Flatsome وWooCommerce وWordPress
- أنشئ صفحة منتج WooCommerce باستخدام قالب Flatsome
- الخطوة 1: حدد تخطيطًا لصفحة المنتج
- (اختياري) الخطوة 2: إنشاء صفحة المنتج يدويًا
- الخطوة 3: تخصيص صفحة المنتج
- تغليف
الفرق بين Flatsome وWooCommerce وWordPress
بينما نرحب بقرائنا الجدد، يجب علينا إدخال بعض المعلومات الضرورية للتأكد من أن جميع قرائنا على نفس الصفحة. سنناقش هنا الفرق بين المصطلحات الثلاثة التي سنستخدمها خلال هذه المقالة.
لنبدأ مع ووردبريس. إنها منصة يمكنك من خلالها تثبيت سمات ومكونات plugin مختلفة لإنشاء موقع الويب الخاص بك. هناك الآلاف من plugin والموضوعات المتاحة لإنجاز المهام الأخرى وفقًا لمتطلباتك.
WooCommerce هو plugin نقوم بتثبيته على WordPress ويسمح لك بإضافة ميزات مختلفة إلى موقعنا. من خلال تثبيت هذا plugin ، يمكننا أن نجعل موقعنا الإلكتروني ومتجرنا عبر الإنترنت مزودين بوظائف إضافية مثل عربة التسوق، ومعالجة الدفع، وإدارة المنتجات، وما إلى ذلك.
أخيرًا، ولكن بالتأكيد، أحد العناصر الأكثر أهمية هو النظرة المستقبلية لموقعنا الإلكتروني. Flatsome هو موضوع يسمح لنا بتخصيص منظور موقعنا وفقًا لرغباتنا. على سبيل المثال، إذا كان شعار شركتك باللون البرتقالي، فقد ترغب في أن ينعكس لون موقع الويب الخاص بك. هذا ما يمكن أن توفره لك Flatsome.
أنشئ صفحة منتج WooCommerce باستخدام قالب Flatsome
نظرًا لأن جميع قراءنا لديهم معرفة حول WordPress وWoCommerce وFlatsome، فقد حان الوقت بالنسبة لنا للمضي قدمًا في تخصيص صفحة منتجاتنا باستخدام أداة إنشاء UX الرائعة التي تأتي مع سمة Flatsome. إنها ميزة السحب والإفلات التي تجعل حياة المصمم سهلة للغاية.
لقد قام الجميع تقريبًا بالتسوق عبر الإنترنت، ربما بسبب الأوقات الصعبة التي واجهناها في الأشهر القليلة الماضية. كان البقاء في المنزل هو الحل الأكثر أمانًا لنا جميعًا. وهذا هو السبب الذي يجعل جميع قرائنا يتفقون على حقيقة أن المتجر عبر الإنترنت أكثر تعقيدًا مقارنة بالموقع القياسي.
ومع ذلك، بمساعدة WooCommerce وFlatsome، أصبحت هذه المهمة سهلة للغاية. أنت بحاجة إلى الجلوس والتخطيط لكيفية ظهور موقع الويب الخاص بك، وهذا كل شيء. سيكون WooCommerce موجودًا لمساعدتك في خيارات الإنشاء الخاصة به. يمكنك إنشاء متجر متكامل عبر الإنترنت في دقائق معدودة عن طريق السحب والإفلات.
مع WooCommerce و Flatsome ، ستتمكن من منح أفكارك حول امتلاك متجر عبر الإنترنت حياة جديدة تمامًا. يجب أن يتمتع موقع الويب الخاص بك بمظهر عصري وجميل حتى يتمكن من جذب العملاء. ولذلك فإن Flatsome هو الحل الأفضل لجميع مشاكلك، لذا قم بتحميله من هنا ودعنا نبدأ.
يحتوي Flatsome على بعض الميزات الرائعة، ولكن أحد الأجزاء هو أنه أصبح الاختيار الأفضل لأكثر من 300000 مستخدم. تساعد الأداة النهائية في إنشاء بعض مواقع الويب سريعة الاستجابة دون الحاجة إلى ترميز سطر واحد. علاوة على ذلك، فإن قدرتها على إنشاء بعض المتاجر الإلكترونية المبتكرة والفريدة من نوعها تجعلها أكثر جدارة.
لذلك، دون إضاعة المزيد من الوقت، دعونا ننتقل إلى البرنامج التعليمي. يأخذك هذا البرنامج التعليمي خلال العملية الكاملة لتصميم صفحة المنتجات. ستساعدك الصور في الحصول على فكرة أفضل عن كيفية سير المهمة خلال هذه العملية.
الخطوة 1: حدد تخطيطًا لصفحة المنتج
أولاً، سنبدأ بتحديد تخطيط لصفحة المنتجات. سيؤدي هذا الاختيار إلى إنشاء صفحة أساسية لمتجرنا الإلكتروني، والتي سنقوم بتخصيصها وفقًا لرغباتنا لاحقًا. سيرشدك هذا الدليل خطوة بخطوة خلال عملية تخصيص الصفحة.
بالنسبة لهذا amp ، سنواصل استخدام خيار Classic Shop. ومع ذلك، ليس هناك أي قيود عليك. ستكون عملية التخصيص مماثلة لكل تخطيط تحدده. سيكون الاختلاف الوحيد هو أن البنية الأساسية للصفحة ستكون مختلفة عن الأخرى.
بالانتقال إلى أداة تخصيص المنتج، أطلقنا عليها اسم الشريط الجانبي الأيسر ذو الارتفاع الكامل.
هناك خياران متاحان لتخصيص صفحة المنتجات. الأول يجب أن يتم باستخدام منشئ UX، بينما الآخر هو إنشاء الصفحة يدويًا. إذا قمت بتحديد الخيار الثاني، فسيتعين عليك التوجه إلى الوثائق الرسمية وتحديد موقع الرموز القصيرة. إذا كنت مبتدئًا وهذه هي تجربتك الأولى في إنشاء متجر عبر الإنترنت، فإنني أوصي بالذهاب إلى هذا الخيار الأول.
(اختياري) الخطوة 2: إنشاء صفحة المنتج يدويًا
فيما يلي لقطة شاشة لصفحة التوثيق الرسمية لـ Flatsome. يمكنك كتابة كلمة الرموز المختصرة والبحث عنها.
بمجرد الضغط على بحث، ستكون هناك قائمة بالرموز القصيرة المعروضة على الشاشة. يمكنك اختيار الرموز المختصرة المهمة لصفحة المنتج. يتطلب استخدام الرموز القصيرة جهدًا أقل، ولكن من الضروري أن يكون لديك القليل من الخبرة العملية في استخدام WordPress واستخدام الرموز القصيرة.
فيما يلي قائمة بالرموز القصيرة التي يمكنك استخدامها على موقع الويب لإنشاء الصفحات.
في هذا amp ، سنقوم بتخصيص تخطيط الشريط الجانبي الأيسر كامل الارتفاع؛ وبالتالي، سوف نقوم بنسخ الكود الخاص بالتصميم. فيما يلي صورة للتطبيق، ولكن يمكنك نسخها بسهولة من الهيكل.
ابدأ في إنشاء كتلة بعنوان. إذا كنت ترغب في تطوير الرأس، فأنت بحاجة إلى النقر فوق "إضافة جديد" المتوفر ضمن كتل UX الموجودة في لوحة التحكم الخاصة بك.
يمكنك تسمية الكتلة حسب رغباتك. هنا في هذا amp ، قمنا بتسمية الاتحاد باسم "تخطيط الشريط الجانبي الأيسر كامل الارتفاع". بعد ذلك، يمكنك رؤية الرموز القصيرة داخل محرر الكتلة. بمجرد الانتهاء من نسخ الرموز القصيرة المطلوبة، يمكنك الضغط على نشر.
سنكون على قدم المساواة بعد هذه الخطوة الصغيرة حيث يمكننا تخصيص صفحتنا وفقًا لرغباتنا. انتقل الآن إلى خيار سمة صفحة المنتج واضغط على أيقونة التخطيط المخصص.
بمجرد الانتهاء، ستتمكن الآن من إنشاء كتل من القائمة المنسدلة Custom Product Layout.
اختر الكتلة التي أنشأناها للتو. كان هدفنا الرئيسي من إنشاء هذه المجموعة هو إنشاء صفحة منتج منها. وفقًا لهذا amp ، فإن تخطيط الشريط الجانبي الأيسر ذو الارتفاع الكامل هو الكتلة، بينما في نهايتك، سيكون كما قمت بتسميته.
بمجرد الانتهاء، فقط اضغط على زر النشر؛ سيتم حفظ الإعدادات.
الخطوة 3: تخصيص صفحة المنتج
لقد حان الوقت بالنسبة لنا لبدء التخصيص. أولاً، سوف نتنقل في صفحة المنتجات الحالية من الواجهة الأمامية التي قمنا بتعيينها مسبقًا في الخطوات.
من المهم أن تختار منتجًا معينًا نحتاج إلى إعداده. يجب أن يكون لديك تفاصيل كاملة وصور للعمل الذي نحتاج إلى تخصيصه. بهذه الطريقة، تصبح العملية أكثر راحة لتصور قسم الصفحة الذي ستقوم بإنشائه.
خيار UX builder مرئي. فقط اضغط على الزر لبدء التخصيص.
بعد فتح UX Builder، يمكنك أن ترى من الصورة أن عناصر صفحة المنتج متاحة في اللوحة الجانبية اليسرى لصفحة منتجاتك.
اللوحة الجانبية اليسرى هي الكتلة التي أنشأناها في البداية. لقد أنشأناه بمساعدة الرموز القصيرة المأخوذة من الوثائق.
لديك خيارات لإعادة ترتيب العناصر من اللوحة اليمنى وتغيير الإعدادات من خيار العنصر. في هذا amp ، سنقوم بإعادة ترتيب السعر المتوفر في القائمة اليسرى.
علاوة على ذلك، فهو يسمح لك أيضًا بإعادة ترتيب العناصر من معاينة المنشئ ووضع مكونات إضافية على صفحة منتج المنشئ. في هذا العرض التوضيحي، تمت إعادة ترتيب قسم علامات تبويب المنتجات والمنتج ذي الصلة بمجرد سحب وإسقاط بسيط.
بفضل وظيفة السحب والإفلات المهمة، فإن Flatsome جاهز لتزويدك بما تبحث عنه على موقع الويب الخاص بك. باستخدام الوحدات القابلة للتخصيص بدرجة كبيرة، يمكنك إنشاء بعض الصفحات الرائعة بسهولة. ميزة السحب والإفلات تجعل الحياة أكثر راحة.
تغليف
من الضروري أن يكون لديك عمل تجاري عبر الإنترنت في هذا العصر الحديث لأن الناس يفضلون البقاء في المنزل ليظلوا آمنين. لذا ابدأ في بناء أول متجر إلكتروني لشركتك مع Flatsome وأذهل عملائك بتفرده وإبداعه. علاوة على ذلك، لا توجد فوضى في التعليمات البرمجية في محرر المحتوى، فقط بضعة أسطر من الرمز القصير. Flatsome هو بلا شك أفضل موضوع واجهته. لذلك ليست هناك حاجة للبحث عن أي موضوع آخر، فقط اضغط على التنزيل وابدأ في إنشاء متجرك المخصص عبر الإنترنت على الفور.
