آموزش نمایش نوار پیشرفت موجودی در ووکامرس با المنتور

آیا تا به حال به این فکر کرده‌اید که چرا در فروشگاه‌های بزرگ مانند دیجی‌کالا، نوارهای گرافیکی کوچک نشان‌ دهنده وضعیت موجودی یا میزان فروش محصولات را مشاهده می‌کنید؟ این ویژگی نه تنها یک عنصر ساده بصری است، بلکه یک استراتژی هوشمندانه برای افزایش فروش محسوب می‌شود.

در این آموزش گام‌ به‌ گام، که بخشی از “دوره آموزش طراحی سایت شبیه دیجی کالا با المنتور” است، یاد می‌گیرید چگونه بدون نصب افزونه‌ های سنگین و تنها با استفاده از یک کد سفارشی و المنتور پرو، نوار پیشرفت موجودی محصولات را به صفحات خود اضافه کنید. این روش به شما کمک می‌کند تا با ایجاد حس فوریت و اثبات محبوبیت، نرخ تبدیل بازدیدکنندگان به مشتریان را به طور چشمگیری افزایش دهید.

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

مزایای نمایش نوار پیشرفت موجودی در ووکامرس با المنتور

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

ایجاد حس فوریت و اصل کمیابی
وقتی مشتری متوجه می‌شود که تنها “۳ مورد” از محصول باقی مانده یا “۸۵ درصد” موجودی فروخته شده، ذهن او با سیگنال “کمیابی” تحریک می‌شود. این احساس که فرصت خرید ممکن است از دست برود، او را به تصمیم‌ گیری سریع وادار می‌کند. ترس از دست دادن فرصت، یکی از قوی‌ ترین عوامل تشویق به خرید در فروشگاه‌ های آنلاین است و این نوار پیشرفت موجودی محصولات ووکامرس ، دقیقاً این حس را القا می‌کند.

اثبات محبوبیت و جلب اعتماد مشتریان
نمایش “۷۵ مورد فروش رفته از این محصول” به مشتریان جدید نشان می‌دهد که این کالا مورد استقبال دیگران قرار گرفته و قابل اعتماد است. این اثبات محبوبیت، تردیدهای اولیه خریدار را برطرف کرده و اعتماد او را برای تکمیل سفارش افزایش می‌دهد. این ویژگی به ویژه برای محصولات تازه‌ اضافه‌ شده یا فروشگاه‌ های نوپا، نقش حیاتی ایفا می‌کند و به مدیریت موجودی ووکامرس کمک می‌کند.

بهبود تجربه کاربری با اطلاعات بصری جذاب
به جای نمایش متن ساده‌ای مانند “موجودی: ۱۰ مورد”، نوار پیشرفت اطلاعات را به صورت سریع و تصویری منتقل می‌کند. این عنصر، صفحه محصول را از حالت ایستا به پویا تبدیل کرده و به سفارشی‌سازی آن بر اساس هویت برند شما امکان می‌دهد. در نتیجه، کاربران زمان کمتری صرف درک وضعیت محصول می‌کنند و تجربه کاربری بهتری خواهند داشت.

پیش‌نیازهای لازم برای شروع این آموزش

برای پیاده‌سازی این ویژگی، به ابزارهای زیر نیاز دارید. مطمئن شوید که همه آن‌ها آماده هستند:

• ووکامرس: فروشگاه‌ساز اصلی شما باید نصب و فعال باشد تا مدیریت موجودی محصولات ووکامرس به درستی کار کند.
• افزونه المنتور پرو: نسخه حرفه‌ ای المنتور برای ویرایش صفحات محصولات با ویجت‌های پویا ضروری است.
• افزونه WPcode pro: برای افزودن کد سفارشی،میتوانید آنرا به فایل (functions.php) در قالب فعال سایت (ترجیحاً قالب فرزند) اضافه کنید اما پیشنهاد ما استفاده از افزونه WPcode Pro استفاده کنید.

آموزش گام‌ به‌ گام افزودن نوار پیشرفت وضعیت موجودی محصولات

این فرآیند در سه مرحله ساده انجام می‌شود: ایجاد کد سفارشی، طراحی قالب محصول در المنتور و قرار دادن نوار پیشرفت. هر گام را با دقت دنبال کنید تا نتیجه‌ای حرفه‌ای بگیرید.

گام اول: ایجاد کد سفارشی برای ساخت کد کوتاه
ابتدا، یک تابع ساده به سایت وردپرسی خود اضافه کنید تا منطق نوار پیشرفت را مدیریت کند. این کد، یک کد کوتاه به نام [mt_stock_progress] می‌سازد که می‌توانید آن را در صفحات محصولات قرار دهید.

از داشبورد وردپرس به بخش “نمایش > ویرایشگر پوسته” بروید.
از فهرست سمت چپ، فایل “توابع پوسته” (functions.php) را انتخاب کنید.
کد مربوط به ایجاد کد کوتاه را کپی کرده و در انتهای فایل قرار دهید. (نکته مهم: همیشه قبل از ویرایش، پشتیبان‌گیری از فایل بگیرید تا از مشکلات احتمالی جلوگیری شود).

این کد به طور هوشمند وضعیت موجودی را بررسی می‌کند: اگر محصول در دسترس باشد، تعداد فروش رفته، موارد باقی‌مانده و درصد فروش را بالای یک نوار رنگی نمایش می‌دهد. در صورت ناموجود بودن، نوار کامل خاکستری با پیام “ناموجود” ظاهر می‌شود.

گام دوم: طراحی یا ویرایش قالب تک محصول در المنتور
حالا زمان ادغام کد کوتاه در صفحه محصول است. از قابلیت “سازنده قالب” در المنتور پرو بهره ببرید.

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

گام سوم: افزودن نوار پیشرفت با ویجت کد کوتاه
این گام، نقطه اوج کار است و نتایج را فوراً نشان می‌دهد.

از پنل ویجت‌ های المنتور، “ویجت کد کوتاه” را جستجو کنید.
ویجت را به مکان مناسب در صفحه بکشید و رها کنید. بهترین مکان در صفحه تکی محصول ووکامرس، زیر قیمت و بالای دکمه افزودن به سبد خرید است، زیرا بیشترین تأثیر را بر تصمیم‌ گیری کاربر دارد.
در فیلد ورودی، کد کوتاه [mt_ptock_progress] را وارد کنید.

نوار پیشرفت بلافاصله به صورت پویا برای محصول در حال نمایش ظاهر می‌شود. قالب را ذخیره و منتشر کنید.

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

سفارشی‌سازی نوار پیشرفت موجودی برای هماهنگی با برند شما

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

نتیجه‌گیری: گامی به سوی فروشگاه هوشمند و پرفروش

با پیروی از این آموزش، حالا قادر هستید یکی از تکنیک‌های پیشرفته مدیریت موجودی ووکامرس را بدون افزونه پیاده‌سازی کنید. این نوار نه تنها صفحات محصولات را جذاب‌تر می‌کند، بلکه با استفاده از اصول روانشناسی مانند حس فوریت و اثبات محبوبیت، مستقیماً به افزایش فروش کمک می‌رساند. فروشگاه شما حالا یک گام به طراحی سایت فروشگاهی شبیه دیجی‌کالا نزدیک‌تر شده!

بخش پرسش‌های رایج (سوالات متداول)