شورت کد چیست و بهترین شورت کدهای ووکامرسی کدامند؟

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

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

شورت کد ووکامرس چیست؟

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

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

«با استفاده از شورت کد ووکامرس می‌توانید محتوای داینامیک را بدون افزودن کدهای طولانی و پیچیده به سایت اضافه کنید.»_ WooCommerce Docs

ساختار شورت کد و پارامترهای آن

شورت کدها معمولا به شکل زیر نوشته می‌شوند و گاهی دارای تگ باز و بسته هستند:

[shortcode]Content[/shortcode]

هر شورت کد ووکامرس می‌تواند چندین پارامتر داشته باشد که عملکرد آن را تعیین می‌کنند؛ مانند تعداد ستون‌ها، دسته‌بندی، ترتیب نمایش و غیره که در ادامه مشاهده می‌کنید:

• limit: تعداد محصولاتی که در صفحه نمایش داده می‌شوند. مثال:

[products limit="8"]

یعنی 8 محصول نمایش داده می‌شود.

• columns: تعداد ستون‌های نمایش محصول در صفحه. مثال:

[products columns="4"]

یعنی محصولات در 4 ستون مرتب می‌شوند.

• orderby: ترتیب نمایش محصولات. می‌تواند یکی از مقادیر date (تاریخ انتشار)، title (عنوان محصول)، popularity (محبوبیت) یا price باشد. مثال:

[products orderby="popularity"]

یعنی محصولات بر اساس محبوبیت مرتب می‌شوند.

•  order: جهت مرتب‌سازی، شامل ASC (صعودی) یا DESC (نزولی) مثال:

[products orderby="date" order="DESC"]

جدیدترین محصولات ابتدا نمایش داده می‌شوند.

• category: نمایش محصولات یک دسته‌بندی خاص. مثال:

[products category="clothing"]

فقط محصولات دسته “لباس” نمایش داده می‌شوند.

• on_sale: نمایش محصولات تخفیف‌خورده. مقدار true یا false می‌گیرد. مثال:

[products on_sale="true"]

یعنی فقط محصولات حراجی نمایش داده می‌شوند.

• ids: نمایش محصولات بر اساس شناسه (ID) آن‌ها. مثال:

[products ids="22,35,26"]

محصولات با شناسه‌های مشخص شده نمایش داده می‌شوند.

• skus: نمایش محصولات بر اساس SKU. مثال:

[products skus="SKU1,SKU2"]

برای درک بهتر این ساختارها، به مثال‌های زیر توجه کنید:

• نمایش ۸ محصول جدید در ۴ ستون:

[products limit="8" columns="4" orderby="date" order="DESC"]

• نمایش محصولات یک دسته‌بندی خاص به صورت شبکه ۳ ستونه:

[product_category category="clothing" per_page="8" columns="3"]

شورت کدهای صفحات ووکامرس

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

• صفحه سبد خرید: نمایش تمام آیتم‌های سبد خرید، تعداد و قیمت آن‌ها و مدیریت کوپن‌های تخفیف

[woocommerce_cart]

• صفحه پرداخت: نمایش فرم پرداخت و امکان تکمیل سفارش

[woocommerce_checkout]

• صفحه حساب کاربری: دسترسی به سفارش‌های گذشته، مدیریت آدرس‌ها و تغییر رمز عبور

[woocommerce_my_account]

• فرم پیگیری سفارش: امکان پیگیری وضعیت سفارش با شماره سفارش و ایمیل مشتری

[woocommerce_order_tracking]

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

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

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

• نمایش همه محصولات

[products]

• نمایش محصولات خاص با شناسه یا SKU

[products ids="1,2,3" skus="SKU1,SKU2"]

• نمایش یک محصول خاص

[product id="22"]

• نمایش چند محصول انتخابی

[products columns="3" ids="22,35,26"]

• نمایش صفحه کامل محصول

[product_page id="22"]

شورت کدهای نمایش محصولات بر اساس دسته‌بندی

شورت کدهای دسته‌بندی محصولات امکان نمایش محصولات یک دسته‌بندی یا لیست دسته‌ها را به ترتیب زیر به شما ارائه می‌دهند.

• نمایش دسته‌بندی‌ها

[product_categories number="6" columns="4" orderby="name" order="ASC"]

• نمایش محصولات یک دسته‌بندی خاص

[product_category category="clothing" per_page="8" columns="4"]

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

شورت کدهای محصولات ویژه و فیلترها

به کمک شورت کدهای پیشرفته می‌توانید محصولات خاص، تخفیف‌خورده یا محبوب را در صفحات مختلف نمایش دهید. این شورت کدها باعث افزایش فروش و هدایت مشتری به محصولات مهم می‌شوند و مدیریت نمایش محصولات را ساده می‌کنند.

• نمایش محصولات حراجی

[sale_products per_page="8" columns="4"]

• نمایش محصولات پرفروش

[best_selling_products per_page="8" columns="4"]

• نمایش محصولات جدید

[recent_products per_page="8" columns="4"]

• نمایش محصولات منتخب

[featured_products per_page="8" columns="4"]

شورت کدهای سفارشی‌سازی پیشرفته

ووکامرس به شما امکان تغییر ظاهر و تعداد محصولات نمایش داده شده با پارامترهای شورت کد را می‌دهد. استفاده درست از این شورت کدها باعث می‌شود صفحات سایت شما حرفه‌ای و واکنش‌گرا باشند.

• نمایش محصولات یک دسته‌بندی با فیلتر بر اساس ویژگی

[products category="clothing" attribute="color" filter="blue" per_page="6" columns="3"]

• نمایش محصولات با ترتیب سفارشی

[products ids="12,45,23" columns="3" orderby="title" order="ASC"]

• نمایش محصولات از چند دسته‌بندی

[products category="clothing,accessories" per_page="12" columns="4"]

بهترین افزونه‌ها و ابزارهای مکمل شورت کد

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

• Woo Shortcodes Kit: این افزونه مجموعه‌ای از شورت کدهای پیشرفته برای نمایش محصولات، دسته‌بندی‌ها، محصولات ویژه و شبکه‌های سفارشی ارائه می‌دهد و امکان ترکیب پارامترهای مختلف برای هر شورت کد را فراهم می‌کند.
• Elementor + WooCommerce Widgets: با استفاده از این ترکیب، می‌توانید صفحات فروشگاهی کاملا واکنش‌گرا و طراحی شده با ویجت‌های اختصاصی ایجاد کنید و انواع شورت کد ووکامرس را به شکل بصری مدیریت کنید. این ابزار برای مدیرانی که تجربه طراحی ندارند بسیار مناسب است.
• WooCommerce Blocks: این ابزار امکان ایجاد بلاک‌های تعاملی برای نمایش محصولات، دسته‌بندی‌ها و پیشنهادهای ویژه در صفحات مختلف فروشگاه را فراهم می‌کند و تجربه کاربری را بهبود می‌دهد.

نکات کاربردی استفاده از شورت کدها

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

１. سئو و سرعت سایت: تعداد شورت کدها در یک صفحه باید محدود باشد؛ نمایش تعداد زیاد محصولات یا ترکیب شورت کدهای سنگین می‌تواند بارگذاری صفحه را کند کند. برای حفظ سرعت، توصیه می‌شود شورت کدها بهینه و هدفمند استفاده شوند.

２. واکنش‌گرایی: تنظیم ستون‌ها (columns) و تعداد محصولات (per_page) برای موبایل و دسکتاپ ضروری است. این تنظیمات باعث می‌شوند کاربران در تمام دستگاه‌ها تجربه یکسان و رضایت‌بخش داشته باشند.

３. سفارشی‌سازی CSS: برای ظاهر حرفه‌ای و منحصر به فرد می‌توانید از کلاس‌های CSS شورت کد استفاده کنید و استایل دلخواه خود را اعمال کنید:

[products per_page="4" columns="2" class="custom-product-grid"]

و سپس در CSS سایت:

.custom-product-grid .product {
  border: 1px solid #ddd;
  padding: 15px;
  margin-bottom: 20px;
  transition: transform 0.3s ease;
}

.custom-product-grid .product:hover {
  transform: scale(1.05);
}

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

５. استفاده هدفمند: شورت کدها باید با هدف مشخص استفاده شوند؛ نمایش همه محصولات یا دسته‌بندی‌ها بدون برنامه‌ریزی می‌تواند باعث کاهش تجربه کاربری و خستگی بازدیدکننده شود.

تاثیر استفاده از شورت کد ووکامرس بر فروش

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

• نمایش محصولات ویژه و پرفروش باعث افزایش جذابیت صفحه و تحریک کاربران به خرید بیشتر می‌شود. مطالعات نشان داده نرخ خرید تا ۲۰٪ افزایش پیدا می‌کند.
• استفاده از شورت کدهای دسته‌بندی مرتب، باعث می‌شود کاربران راحت‌تر محصولات مرتبط را پیدا کنند. این روش میانگین زمان ماندگاری کاربر در صفحه را افزایش می‌دهد و نرخ خروج از سایت کاهش می‌یابد.
• شورت کدهای فیلتر و جستجوی پیشرفته تجربه کاربری را ارتقا می‌دهند و به کاربران کمک می‌کنند سریع‌تر محصول مورد نظر خود را بیابند، که مستقیما روی فروش تاثیرگذار است.

چرا استفاده از شورت کدها در ووکامرس ضروری است؟

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

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

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

سوالات متداول درباره شورت کد ووکامرس

شورت کد ووکامرس چیست و چه کاربردی دارد؟

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

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

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

[best_selling_products per_page="8" columns="4"]

آیا استفاده زیاد از شورت کدها باعث کندی سایت می‌شود؟

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

چگونه شورت کدها را سفارشی کنم؟

می‌توانید با پارامترهایی مانند columns ,per_page ,order و class شورت کدها را تغییر داده و با CSS سفارشی ظاهر آن‌ها را بهینه کنید.

آیا شورت کدها با موبایل سازگار هستند؟

بله، با تنظیم تعداد ستون‌ها و استفاده از CSS واکنش‌گرا می‌توان شورت کدها را برای موبایل و دسکتاپ بهینه کرد.