มี Plugin ไหนทำปุ่ม Grid / List สำหรับ Woocommerce ได้บ้างครับ

หน้าแรก ฟอรั่ม ถามปัญหาการทำเว็บด้วยเวิร์ดเพรส มี Plugin ไหนทำปุ่ม Grid / List สำหรับ Woocommerce ได้บ้างครับ

กำลังดู 6 ความเห็น
  • ผู้เขียน
    ข้อความ
    • #314911
      Top
      Participant

      อยากทำปุ่ม Grid/List แบบเว็บในรูปครับ แล้วก็ส่วนด้านบนที่เป็นหมวดหมู่แบบในรูปพอจะใช้ Plugin ตัวไหนทำได้บ้างครับ

       

    • #314982
      Facebook Profile photoBenn
      Participant

      ผมไม่แน่ใจว่าในตอนนี้จะมี Plugin ที่แสดงผลได้แบบในตัวอย่างหรือเปล่า อาจจะต้องแยกเป็น 2 กรณี

      1. ตรงปุ่มเปลี่ยน List/Grid ผมเขียน CSS + jQuery + Cookie เอง ถ้าเปลี่ยน Class ให้เปลี่ยนรูป + AddClass/RemoveClass ปกติ ลองศึกษาดูนะครับ https://www.w3schools.com/jquery/html_addclass.asp
      2. แสดงผล Category ตรงนี้จะเป็น Custom page ที่เขียนขึ้นด้วยโค๊ดเพื่อให้แสดงผลแบบที่เห็นนะครับ (ผมเขียนเอง)

      โค๊ดจะประมาณนี้ครับ

      <?php
      $product_cat_id = get_queried_object();
      $parent_id = $product_cat_id->term_id;
      $termchildrens = get_terms(‘product_cat’, array(‘parent’ => $parent_id));

      $s_slider = ‘s-grid -m2 -d4’;
      ?>

      <div class=”category-items <?php echo $s_slider; ?>”>
      <?php
      foreach($termchildrens as $termchildren) {

      if($termchildren && $termchildren->term_id != 15){
      $thumbnail_id = get_woocommerce_term_meta( $termchildren->term_id, ‘thumbnail_id’, true );
      if($thumbnail_id){
      $image = wp_get_attachment_url( $thumbnail_id );
      }else{
      $image = ‘/wp-content/uploads/woocommerce-placeholder.png’;
      }
      echo ‘<div class=”‘ . $slider . ‘ category-item cat-‘.$termchildren->term_id.'”>’;
      echo ‘<a href=”‘ . get_category_link( $termchildren->term_id ) . ‘” title=”‘ . sprintf( __( “View all posts in %s” ), $termchildren->name ) . ‘” ‘ . ‘>’;
      echo “<img src='{$image}’ alt=” width=’300′ height=’100′ />”;
      echo ‘<h2>’ . $termchildren->name.'</h2>’;
      echo ‘</a>’;
      echo ‘</div>’;
      }
      }
      ?>
      </div>

      ที่เหลือก็จัด CSS ตามต้องการครับ

      • #315044
        Top
        Participant

        ขอบคุณครับ จะเอาไปลองทำดูครับ

    • #317165
      Top
      Participant

      $parent_id = $product_cat_id->term_id;

      Code บรรทัดนี้ผมลองแล้วมันขึ้นแบบนี้ครับ Warning: Undefined property: WP_Post_Type::$term_id

    • #317271
      Facebook Profile photoK
      Keymaster

      แปลว่าน่าจะ $product_cat_id = get_queried_object();  เก็บค่าตัวแปรนี้ไม่มานะครับ อาจต้องมีโค้ด้านบนก่อนหน้านี้อีกสักหน่อย

      แต่จริงๆ ตัวนี้น่าจะเป็นแค่ loop ที่จะใช้ดึงสินค้าที่เราต้องการมาแสดงเท่านั้นนะครับ ขึ้นอยู่กับว่าเราอยากดึงสินค้าอะไรมาแสดงนะครับ

      โค้ดที่จะให้ทำงานส่วนนี้จริงๆ คิดว่าน่าจะเป็นส่วน jQuery กับ Css มากกว่านะครับ

    • #317273
      Facebook Profile photoK
      Keymaster

      ถ้าไม่อยากแก้โค้ดเยอะอาจลองดู plugin แนวนี้จะพอตอบโจทย์ไหมนะครับ

      ตัวอย่าง

    • #317275
      Top
      Participant

      ขอบคุณครับ รบกวนสอบถามอีกนิดนึงครับ หน้าแรกเมนูแนวตั้งข้างสไลด์นี้ใช้ plugin ตัวไหนทำหรอครับ

    • #317432
      Facebook Profile photoK
      Keymaster

      ส่วนนี้เขียนโค้ดเองเหมือนกันครับ

      แต่ถ้าเป็น plugin ตัว mega menu อาจทำได้ใกล้เคียงอยู่นะครับ อาจต้อง css สักหน่อย

กำลังดู 6 ความเห็น

  • คุณต้องเข้าสู่ระบบเพื่อตอบกลับกระทู้นี้