سفارشی سازی صفحه محصولات ووکامرس با المنتور

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

در این مقاله میخواهیم با نحوه ساخت صفحه نمایش محصولات ( woocommerce single product page) آشنا شویم. با فراگیری این آموزش میتوانید با المنتور پرو و بدون نیاز به کد نویسی خاصی صفحه نمایش محصولات ووکامرسی خود را توسعه دهید و سفارشی سازی کنید.

آنچه در این مطلب می خوانید

.
.
5 راهکار تخصصی
برای بهبود کار با المنتور

1. انتخاب و ایجاد قالب صفحه محصول

طراحی صفحه محصولات ووکامرس با المنتور

از منوی پیشخوان وردپرس در بخش قالب ها گزینه ی افزودن جدید را انتخاب کنید. بعد با صفحه ای که در تصویر زیر ملاحظه میفرمایید مواجه میشوید. نوع الگوی خود را بر روی Single Product و نامی برای صفحه محصول خود درج کنید و در نهایت نیز با با انتخاب گزینه Create Template وارد صفحه طراحی شوید

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

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

طراحی صفحه محصولات ووکامرس با المنتور

3. ابزارک هایی که صفحه محصول شما را تشکیل میدهد را اضافه کنید

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

4. تنظیم شرایط نمایش و انتشار قالب

شرایط نمایش را تنظیم کنید تا مشخص شود الگوی شما در چه محصولاتی نمایش داده شود و در آخر نیز الگو را انتشار دهید

نکات تکمیلی

  1. برای اینکه اطمینان حاصل کنید تا الگوی شما از لحاظ استاندارد های طراحی مناسب است توصیه میشود با چندین محصول مختلف پیش نمایش کنید.
  2. میتوانید از هر ویجت دیگری برای جذاب تر کردن صفحه محصول خود استفاده کنید. مثل دکمه های اشتراک گذاری، ابزارک های نمایش تصاویر، تب های آکاردئونی و…  حتی میتوانید از ضمینه های سفارشی با استفاده از محتوای پویا ویژگی های متمایزی به قالب خود اضافه کنید.
  3. ساده ترین راه برای ساخت قالب Single Product استفاده از بخش کتابخانه و الگو های آماده است اما پیشنهاد مجموعه ایران المنتور ساخت یک قالب سفارشی بر اساس نیاز و نوع محصولات خود است.
  4. المنتور بستری کاملا منعطف را برای طراحی یک صفحه نمایش محصول را مهیا میکند و این قابلیت را به شما میدهد که بدون کد نویسی و استفاده از افزونه های متعدد وردپرسی با عملکرد کاملا بصری یک قالب صفحه محصولات ووکامرسی را طراحی کنید پس میتوانید با استفاده از المنتور  و قابلیت قالب سازی ووکامرس المنتور پرو  صفحات محصول خود را سفارشی سازی کنید

گروه تعامل با کاربران فعال المنتور

ID: ir_elementor

پرسشی دارید؟ پاسختان را خواهیم داد ...

138 پاسخ

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

    1. سلام خیلی ممنون از شما
      بنظر میاد که مشکل از قالب سایت شما باشد. به صورت موقت قالب خود را تغییر دهید، اگر مشکل برطرف شد میتوانید از توسعه دهنده قالب خود موضوع را پیگیری کنید

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

    1. سلام
      نه دیگه !!! شما یک قالب می سازید و این قالب بر روی تمامی محصولات شما لحاظ می شود.

  3. سلام وقت بخیر
    بخش کامنت صفحات محصول در گوشی موبایل و حتی دستکاپ به این صورته که بخش دیگاه های ارسال شده در کنار بخش ارسال دیدگاه قرار دارد (یعنی دکمه ارسال،باکس نام و نام خانوادگی،ایمیل و محل نوشتن)
    چطوری میشه کاری کرد دیدگاه های ارسال شده بیاد بالای باکس های مشخصات و دکمه ارسال قرار بگیرد؟
    و اگه شدنی هست آیا از بخش cssهای اضافی المنتور میشه این تغییرات را انجام داد؟
    خیلی ممنون میشم اگه کمک کنید

    1. سلام
      استایل کامنت ها از قالب گرفته میشه، برای رفع موضوع دو راه دارید
      1- تغییر قالب
      2- کدنویسی CSS سفارشی

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

    می خواستم بدونم من چجوری می تونم امکان نمایش محصولات متغییر رو داخل المنتور نمایش بدم؟ آیا ادانی براش وجود داره ؟ راه حل چیه؟

    1. سلام
      تنظیمات محصولات متغیر در ابزارک سبد خرید می باشد. المنتور آنچنان تنظیمات گسترده ای برای محصولات متغیر ندارد اما مشکلی در نمایش ندارد. لطفا برسی کنید ببنید محصولات متغیر خود را به درستی طراحی و مشخص کرده باشید.

  5. سلام وقت بخیر
    اگر بخوایم محصولات ووکامرس رو تکی یا جداگانه با المنتور ویرایش کنیم راهی هست ؟

    1. سلام
      فقط ابزارک content را به صفحه اضافه کنید و هر محصول را همانند برگه ها و نوشته دیگر میتوانید به صورت شخصی سازی با المتنور ویرایش کنید

  6. سلام قیمت ویژه (حالتی که تخفیف میخوره)برای من اعمال نمیشه علتش چیه؟

    1. سلام
      اطمینان حاصل کنید که از نسخه بروز المنتور و المنتورپرو استفاده می کنید

    1. سلام
      افزونه المنتور با EDD در حال حاظر سازگاری نداره

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

    1. سلام
      راستش متوجه نشدم، اگر امکانش هست یک تصویر ارسال کنید

  8. در افزونه المنتور پرو زمانی که تب اطلاعات محصول را اضافه می کنیم در قسمت توضیحات تکمیلی:

    1. چطور میتونم فونت توضیحات رو تغییر بدم و مثل بقیه فونت ایران یکان باشه؟

    2.برای رفع مشکل چسبیدن حروف به ستون سمت راست راه حلی وجود داره؟

    3.آیا امکان تغییر نام توضیحات تکمیلی به مشخصات وجود داره؟

    1. 1 – لینک آموزش رو مشاهده کنید : https://iranelementor.com/insert-font-fullweb/
      2 – میتونید اما باید از کدنویسی CSS استفاده کنید که البته کار سختی نیست و فقط نیازمند دانش ابتدایی در رابطه با زبان CSS است
      3 – افزونه ووکامرس فارسی رو نصب کنید از منو پیشخوان > ووکامرس فارسی > حلقه های ترجمه – متن خودتونو با متن فعلی جایگزین کنید

  9. سلام یه سوال دیگه داشتم من الان قالب سلام المنتورم به طور پیشفرض یه صفحه محصولات خودش داره الان این صفحه ای که من میسازم رو چطور بکنمش صفحه محصولاتم؟ بعلاوه اون بخش دیدگاه که میزدین وکنشگرا رو و حالت اتو میزاشتین میرفت بالا تر و هم تراز سکشن بالاییش میشدو من اون رو هرچقدر زدم نرفت بالا تر حتی طرح بندی صفحه رو هم عوض کردم نرفت

    1. سلام
      تمامی قالب های وردپرس یک صفحه به عنوان صفحه محصول به صورت پیشفرض دارند. برای شخصی سازی صفحه محصول کافیه مراحل گفته شده در آموزش را دقیق و صحیح پیش برید

    2. سلام.ببخشید برای تک تک محصولات باید این کارو انجام بدیم؟

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

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

جلسات آموزشی
سطح پیشرفته

گروه تعامل با کاربران فعال المنتور

ID: ir_elementor

مینی دوره طراحی مگامنو

فقط 3 روز

%50 تخفیف

دریافت راهنمای تخصصی برای بهبود کار با المنتور
دریافت راهنمای تخصصی برای بهبود کار با المنتور

ویرایش پروفایل