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

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

#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 ตามต้องการครับ