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

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

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

همینطور که می دانید با استفاده از کوئری نمایش آخرین مطالب دسته خاص وردپرس می توان جدیدترین نوشته های هر دسته موضوعی وردپرس را نمایش داد اما در افزونه ساخت فروشگاه کالا ووکامرس به دلیل اینکه خود ووکامرس توسط پست سفارشی Post Types ایجاد می شود دیگر نمی توان از کوئری اشاره شده استفاده کرد.

کوئری و کد نمایش محصولات دسته خاص ووکامرس

اگر تصمیم دارید آخرین یا جدیدترین کالاهایی که در هر دسته ووکامرس منتشر شده اند را نمایش دهید می توانید از کوئری زیر استفاده کنید. با تغییر مقدار posts_per_page می توانید تعداد مطالب مورد نمایش را کنترل کنید و با تغییر متغییر product_cat به نام دسته مورد نظر امکان انتخاب دسته بندی دلخواه وجود دارد، در این مثال آخرین مطالب مربوط به دسته ronakweb انتخاب و نمایش داده می شوند. در کوئری زیر توابع مربوط به نمایش عنوان یا نام محصول، قیمت محصول، تصویر شاخص کالا و امکان افزودن به سبد خرید قرار داده شده که می توانید برخی امکانات دیگر مانند قابلیت امتیازدهی را نیز به آن بیافزایید.

<ul class="products">
<?php
$args = array(
'post_type' => 'product',
'posts_per_page' => 10,
'product_cat' => 'ronakweb',
'orderby' => 'rand'
);
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>
<h2>Shoes</h2>
<li class="product">    
<a href="<?php echo get_permalink( $loop->post->ID ) ?>" title="<?php echo esc_attr($loop->post->post_title ? $loop->post->post_title : $loop->post->ID); ?>">
<?php woocommerce_show_product_sale_flash( $post, $product ); ?>
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="ronakweb" width="300" height="300" />'; ?>
<h3><?php the_title(); ?></h3>
<span class="price"><?php echo $product->get_price_html(); ?></span>                    
</a>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</li>
<?php endwhile; wp_reset_query(); ?>
</ul>
1,390 بازدید 16 نظر
خیلی خوشم اومد.
به نظر من !!!
  1. احسان اسکندری می گه:
    ۱۶:۳۶ مورخه ۲۷ دی ۹۴

    بسیار عالی بود، ممنون بابت به اشتراک گذاری

  2. هادی می گه:
    ۱۱:۳۵ مورخه ۱۷ بهمن ۹۴

    با عرض سلام خدمت آقای کیانوش
    ضمن تشکر از اینکه این آموزش مفید رو در سایت قرار دادید ، دو تا سوال دارم که هر چی تو اینترنت گشتم پیدا نکردم و لطف می کنید اگه راهنمایی کنید:
    ۱-اگر بخواهیم در قسمت ‘product_cat’ به جای نام دسته از id دسته استفاده کنیم از چه تابعی باید استفاده کنیم ؟
    ۲-اگر بخواهیم در پایین هر محصول یک گزینه اضافه کنیم با عنوان توضیحات محصول که با کلیک کردن به بخش توضیحات اون محصول بره از چه تابعی باید استفاده کنیم؟

    • روناک وب می گه:
      ۱۱:۳۹ مورخه ۱۷ بهمن ۹۴

      سلام، نسبت به من و روناک وب لطف دارید. بهتره برای دریافت پاسخ توی انجمنهای پشتیبانی وردپرس عضو بشید و سوالات تون رو مطرح کنید تا دوستان پاسخ بدن وگرنه می تونید با یه جستجو ساده در گوگل به جواب برسید.
      برای سوال اول تون : از عبارت product_id و عدد مربوط به شناسه دسته داخل ‘id’ استفاده کنید ببینید نتیجه میگیرد.

      • هادی می گه:
        ۱۲:۰۰ مورخه ۱۷ بهمن ۹۴

        بسیار ممنون از پاسختون
        از product_id استفاده کرم جواب داد

    • مریم می گه:
      ۱۸:۵۳ مورخه ۲۳ خرداد ۹۵

      آفرین چه سوال خوبی پرسیدی

  3. آرش می گه:
    ۱۲:۰۱ مورخه ۰۴ اسفند ۹۴

    سلام آقای کیانوش ، من با کدی که برای نمایش محصولات دسته های خاص قرار دادید تونستم محصولات رو نمایش بدم ، اما روی هر محصول که کلیک میکنم به ID همون محصول میره *** ولی اطلاعات مخصوص به همون محصول رو نشون نمی ده و دوباره همون محصولات رو نشون میده ، صفحه single هم ایجاد کردم و فقط یک حلقه اصلی وردپرس فراخوانی کردم. اگر لطف بکنید راهنمایی کنید خیلی ممنون میشم.

    • روناک وب می گه:
      ۱۲:۱۱ مورخه ۰۴ اسفند ۹۴

      سلام. دقت کنید هدف از کوئری نمایش مطالب دسته خاص ووکامرس ساختار کلی کد هست که میتونید توابع داخل query رو به دلخواه تغییر بدید و حتما نیازی به استفاده از توابع ووکامرس برای نمایش آدرس محصول نیست و میتونید از تابع the_permalink وردپرس استفاده کنید.
      نکته : منظور از نام دسته ووکامرس همون cat slug یا نامک دسته هست که معمولا به صورت انگلیسی نوشته میشه و در آدرس دسته نمایش داده میشه. بهتره برای جلوگیری از ایجاد تداخل و مشکل با استفاده از cat slug جدیدترین مطالب دسته woocommerce رو نمایش بدید و از cat id استفاده نکنید.

      • سعید می گه:
        ۲۰:۰۳ مورخه ۱۷ فروردین ۹۵

        لطفا کمکم کنید

  4. سعید می گه:
    ۲۰:۰۳ مورخه ۱۷ فروردین ۹۵

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

    • روناک وب می گه:
      ۲۰:۳۵ مورخه ۱۷ فروردین ۹۵

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

  5. طراحی سایت حرفه ای می گه:
    ۰۱:۲۴ مورخه ۱۶ خرداد ۹۵

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

    • روناک وب می گه:
      ۰۵:۲۸ مورخه ۱۶ خرداد ۹۵

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

  6. مریم می گه:
    ۱۸:۵۲ مورخه ۲۳ خرداد ۹۵

    خیلی ممنونم. چه قدر خوب بود. آفرین امیدوارم که موفق باشی نمیدونی چه قدر شاد شدم خدا تنت رو سالم نگه داره
    توی wordpress.org گیج شده بودم کدوم کدها رو باید بذارم. و به جای product-cat نمیدونستم میتونم product id بذارم.

  7. فرونت می گه:
    ۱۷:۰۷ مورخه ۰۴ مرداد ۹۵

    ممنون، کد جالب و کاربردیه ولی متاسفانه برای من کار نکرد.
    من این کد رو در sontent-single-product.php به صورت تستی گذاشتم ولی به طرز عجیبی محصولات رو به صورت اریب نشون میده!

    یعنی نه افقی نه عمومی! اریب! از منتهی الیه بالا سمت راست تا منتهی الیه پایین سمت چپ!

    ۱- چکار کنم که محصولات رو به صورت افقی نشون بده؟

    ۲- چکار کنم که به صورت پیش فرض قالب محصولات رو نشون بده. آخه قالب من به صورتیه که وقتی ماوس روی محصول قرار می گیره، تصویر دوم شاخص رو نشون میده.

    • روناک وب می گه:
      ۱۷:۳۷ مورخه ۰۴ مرداد ۹۵

      سلام، شما چون کد رو داخل حلقه ووکامرس گذاشتین این مشکل بوجود اومده اگه میخایین توی ادامه مطلب و توضیحاتمحصول قرار بگیره باید کدها رو توی فایل single-product.php و قبل یا بعد از حلقه وردپرس و حلقه ووکامرس بزارید تا مشکلات اریب بودن حل بشه. برای فراخوانی محصولات پیش فرض توی کوئری معرفی شده بجای توابع حلقه فایل content-product.php ووکامرس رو فراخوانی و استفاده کنید. موفق باشید

با عضوت در خبرنامه ایمیلی جدیدترین مطالب و فیلم های آموزشی را در ایمیل تان دریافت کنید. اعضاء خبرنامه و صفحات اجتماعی روناک وب از امکانات ویژه ای برخوردار خواهند شد !!!