چگونه صفحات ووکامرس خود را با المنتور سفارشی کنید

WooCommerce بهترین افزونه وردپرس برای راه اندازی یک فروشگاه آنلاین است. تنها مشکل این است که در حالی که به شما امکان کنترل اکثر تنظیمات فروشگاه را می دهد، و این فرآیند ایجاد محصول را ساده می کند، در هنگام طراحی اجازه سفارشی سازی زیادی را نمی دهد.

چندین راه وجود دارد که می توانید با Elementor Pro این مشکل را حل کنید:

مسئله اصلی که ما در اینجا با آن سروکار داریم این است ووکامرس به کاربران امکان سفارشی کردن صفحاتی مانند موارد زیر را نمی دهد:

• خرید کنید
• تولید – محصول
• سبد خرید
• وارسی
• حساب من

زیاد تم های ممتاز WooCommerce Elementor یک راه حل ساده برای این مشکل ارائه دهد. در هر موضوع، نسخه‌های نمایشی وب‌سایت یا قالب‌های صفحه را خواهید یافت که گزینه‌های طرح‌بندی متعددی را برای صفحات تجارت الکترونیک شما ارائه می‌دهند.

مثلا، MyDecor دارای نه طرح بندی محصول برای انتخاب:

اگر نیازی ندارید یا می خواهید زمان زیادی را صرف سفارشی سازی صفحات ووکامرس خود کنید، این بهترین روش برای شما خواهد بود.

پس از آپلود تم خود در وردپرس و نصب نسخه ی نمایشی دلخواه خود، از آن استفاده کنید پلاگین صفحه ساز Elementor برای اصلاح طرح ها و چیدمان ها برای به دست آوردن بهترین نتایج، باید از ویجت های Elementor Pro استفاده کنید.

به هر حال، اگر کنجکاو هستید که از کدام تم های WooCommerce سازگار با Elementor بهتر استفاده کنید، برخی از توصیه های ما را بررسی کنید:

سه صفحه وجود دارد که ووکامرس پس از نصب افزونه به طور خودکار برای شما ایجاد می کند:

اکثر مضامین ممتاز وردپرس همین کار را می کنند.

اگر به داخل این صفحات در وردپرس نگاهی بیندازید، به جای جایی که محتوا باید باشد، یک کد کوتاه خواهید دید:

پیش‌نمایش این صفحه را باز کنید و یک مورد اساسی پیدا خواهید کرد سبد خرید صفحه:

هیچ اشکالی در این طراحی وجود ندارد. با این حال، اگر بخواهید ساختار آن را کمی متفاوت بسازید – مثلاً با اضافه کردن یک نوار کناری در سمت راست صفحه، چطور؟ یا اگر بخواهید بخشی با موارد فروش یا لیست علاقه مندی ها را در زیر سبد خرید اضافه کنید، چه؟

تنها راه برای سفارشی کردن این سه صفحه ووکامرس، حذف کد کوتاه و ویرایش آنها در Elementor است. در اینجا فرآیندی است که برای انجام آن دنبال خواهید کرد:

قابل اعتماد و متخصص صفحات و صفحه از پیش ساخته شده ووکامرس را که می خواهید ویرایش کنید پیدا کنید:

موردی را که می خواهید ویرایش کنید باز کنید. در این مثال، ما روی آن کار خواهیم کرد وارسی.

در ویرایشگر وردپرس، را انتخاب کنید کد کوتاه مسدود کردن. سپس بر روی آن کلیک کنید گزینه ها دکمه (سه نقطه عمودی).

کلیک حذف کد کوتاه برای حذف بلوک از صفحه

صفحه را به روز کنید. سپس روی آبی کلیک کنید با Elementor ویرایش کنید دکمه در بالا برای باز کردن ویرایشگر.

متأسفانه، الگوهای صفحه و بلوک Elementor کمک چندانی به شما نخواهد کرد. از زمان نوشتن این مطلب، هیچ قالبی برای محتوای صفحه سبد خرید، تسویه حساب یا حساب وجود ندارد.

گفتنی است، به جای آن می توانید از ویجت های WooCommerce Elementor Pro استفاده کنید. فقط مطمئن شوید که تنظیمات کلی طرح زمینه خود را به منظور به حداقل رساندن میزان ویرایش سبکی که باید در اینجا انجام دهید، پیکربندی کرده اید.

نکته جالب در مورد استفاده از ویجت های Elementor Pro این است که تقریباً برای هر صفحه ای که می خواهید شخصی سازی کنید، یکی وجود دارد:

وارسی یک صفحه پرداخت با:

• فرم جزئیات صورتحساب
• فیلد یادداشت سفارش
• جعبه خلاصه
• بخش کوپن
• دکمه خرید (با شرایط قرارداد خدمات)

سبد خرید یک صفحه سبد خرید با:

• جزئیات سبد خرید
• فیلد کوپن
• کل خرید با محاسبات حمل و نقل

حساب من یک صفحه حساب کاربری با برگه هایی برای:

• داشبورد
• سفارشات
• دانلودها
• آدرس ها
• جزئیات حساب
• خروج

با هر یک از این ویجت ها، می توانید نحوه نمایش هر بخش و همچنین طراحی کلی صفحه را سفارشی کنید. در برخی موارد، می‌توانید برخی از ویژگی‌ها (مانند کد کوپن) را زمانی که به تجربه خرید شما بی‌ربط هستند، غیرفعال کنید.

به هر حال، می توانید ابزارک های دیگری را به این صفحات ووکامرس اضافه کنید. Elementor دارای ویجت های حرفه ای برای انواع چیزها است – پودرهای سوخاری، به فروش می رساند، دسته بندی محصولات، و بیشتر.

وقتی سفارشی کردن طرح خود را تمام کردید، روی سبز کلیک کنید به روز رسانی دکمه در گوشه سمت راست پایین سپس به داشبورد وردپرس خارج شوید.

این فرآیند را برای هر تعداد صفحه که برای سفارشی کردن نیاز دارید تکرار کنید.

از این روش برای ساخت ووکامرس خود استفاده کنید خرید کنید و تولید – محصول صفحات با Elementor Pro.

قبل از ادامه این گردش کار، ایده خوبی است که حداقل یک محصول را در فروشگاه خود بارگذاری کنید. در غیر این صورت، نمی‌توانید داده‌ها یا تصاویر واقعی را هنگام کنار هم قرار دادن و سفارشی‌سازی طرح‌های خود مشاهده کنید.

از داشبورد وردپرس، محل را پیدا کنید قالب ها منو. سپس انتخاب کنید تم ساز:

Theme Builder یک ویژگی حرفه ای است که کاربران را قادر می سازد تا طرح های سفارشی برای حیاتی ترین اجزا و صفحات یک وب سایت ایجاد کنند. هنگامی که WooCommerce نصب می شود، کاربران توانایی شخصی سازی آن را به دست می آورند تک محصولی و آرشیو محصولات صفحات با المنتور

برای ایجاد صفحه ای برای فروشگاه خود، ماوس را روی آن نگه دارید آرشیو محصولات و روی دکمه آبی رنگ علامت مثبت کلیک کنید. برای ایجاد یک صفحه برای محصولات جداگانه، ماوس را روی آن نگه دارید تک محصولی و روی دکمه آبی رنگ علامت مثبت کلیک کنید.

به عنوان مثال، ما یک طرح بندی جهانی برای محصولات خود ایجاد خواهیم کرد.

پس از کلیک بر روی علامت مثبت، Elementor شما را به داخل سازنده می برد و قالب های بلوکی را در اختیار شما قرار می دهد که با هر چیزی که می خواهید ایجاد کنید مطابقت دارد:

حتی اگر چیدمان های از پیش ساخته شده دقیقاً همان چیزی نیست که شما تصور می کردید، یکی را انتخاب کنید که به کاری که می خواهید انجام دهید نزدیک است. شروع از یک الگو یک ترفند خوب برای صرفه جویی در زمان است زیرا می توانید پایه را رها کنید و سپس انرژی خود را روی ویرایش محتوا متمرکز کنید.

برای قرار دادن قالب در صفحه، روی رنگ سبز کلیک کنید درج کنید دکمه ای که در سمت راست بالای آن ظاهر می شود.

صفحه محصول یا فروشگاه خود را به عنوان پیش نویس ذخیره کنید و سپس به داشبورد وردپرس بازگردید. قابل اعتماد و متخصص قالب ها و الگوهای ذخیره شده. را کلیک کنید وارد کردن قالب ها فایل طراحی خارجی خود را وارد کنید:

المنتور از شما می پرسد که چه نوع صفحه ای است. سپس شما را به ویرایشگر Elementor می برد که در آنجا می توانید آن را سفارشی کنید.

شما نیازی به بازگشت به آن نخواهید داشت تم ساز اگر این مسیری است که می روید. فقط مطمئن شوید که مراحل 4 و 5 را تمام کرده اید تا بتوانید الگوی صفحه را طوری برنامه ریزی کنید که به عنوان یک طراحی صفحه جهانی نشان داده شود.

وقتی آماده شدید، با حذف ویجت‌ها و ویژگی‌هایی که به آن‌ها نیاز ندارید، شروع کنید. اینها باید عناصری باشند که با هیچ چیز دیگری جایگزین آنها نخواهید شد. به عنوان مثال، هنگام سفارشی کردن صفحه محصول خود، ستون تصویر را دست نخورده رها کردم:

با این حال، من تصویر پس‌زمینه‌ای را که برای نمایش عکس محصول اولیه تنظیم شده بود، حذف کردم. سپس آن را کشیدم تصاویر محصول ویجت در ستون

این به من امکان می دهد تا یک تجربه تصویر کامل تر و تعاملی تر از محصول ایجاد کنم. برای شروع، اگر بیش از یک تصویر محصول را در وردپرس بارگذاری کنم، گالری کامل در اینجا ظاهر می شود. ثانیاً، این ویجت دارای یک ویژگی بزرگنمایی شناور است که تصاویر را برای خریداران مفیدتر می‌کند زیرا می‌توانند جزئیات محصولات را از نزدیک ببینند.

اکنون، پس از حذف ویجت‌ها و بخش‌هایی که به آن‌ها نیاز ندارید، ادامه دهید و ویجت‌هایی را برای ویژگی‌هایی که از دست رفته‌اند به بوم اضافه کنید. شما احتمالا آنها را در زیر پیدا خواهید کرد تولید – محصول و ووکامرس دسته بندی ها. در صورت نیاز می‌توانید از سایر ویجت‌های Elementor نیز استفاده کنید.

در نهایت، مدتی را صرف مرور هر قسمت از صفحه کنید. محتوا و سبک هر چیزی را که به آن نیاز دارد سفارشی کنید. این به همان اندازه که برای بخش‌های مختلف صفحه صدق می‌کند، برای ویجت‌های فردی نیز صدق می‌کند.

وقتی طراحی نهایی خود را به پایان رساندید، روی فلش بالا سمت راست سبز کلیک کنید انتشار دکمه. انتخاب کنید شرایط نمایش:

در پاپ آپ زیر، روی اضافه کردن شرط دکمه. به طور پیش فرض، محصولات تک صفحه ای که ایجاد می کنید برای همه صفحات محصول اعمال می شود:

اگر می‌خواهید فقط برای انواع خاصی از محصولات نمایش داده شود، روی آن کلیک کنید محصولات کشویی را انتخاب کنید و دسته، برچسب یا سایر مشخصاتی را که می خواهید شرط را به آن محدود کنید، انتخاب کنید.

اگر می خواهید این طرح را برای همه محصولات به جز دسته یا نوع خاصی نمایش دهید، کلیک کنید اضافه کردن شرط یک بار دیگر و ایجاد کنید مستثنی کردن تنظیمات.

پس از اتمام تنظیم شرایط، کلیک کنید ذخیره و بستن. این کار به طور همزمان شرایط شما را ذخیره می کند و طرح جدید را در مناطقی از سایت که در آن قابل اجرا است منتشر می کند.

وب سایت خود را باز کنید و به صفحه محصول (یا صفحه محصول) بروید خرید کنید صفحه، اگر ابتدا آن را سفارشی کرده باشید). تغییرات منعکس شده را در آنجا خواهید دید.

WooCommerce یک راه حل عالی برای راه اندازی یک فروشگاه آنلاین است. تمام قطعات اساسی که برای شروع فروش محصولات خود نیاز دارید، دقیقاً در پلتفرم تعبیه شده است. با این حال، آن را در راه سفارشی سازی طراحی ارائه نمی دهد.

Elementor Pro با ابزار Theme Builder و ویجت های Pro خود راه حلی برای این مشکل به ما ارائه می دهد.

این پلاگین صفحه‌ساز ممتاز ساخت یک فروشگاه ووکامرس با Elementor و سپس سفارشی کردن بخش‌هایی از آن را که خود WooCommerce لمس نمی‌کند آسان می‌کند – مانند صفحات فروشگاه، سبد خرید و پرداخت.

دو عنصر Elementor-WooCommerce برای ساخت یک فروشگاه آنلاین با عملکرد بالا ضروری است. وقتی آماده هستید تا تجربه خرید سفارشی که امروز ایجاد کرده‌اید را ارتقا دهید، این افزونه‌های WooCommerce Elementor را امتحان کنید.