Làm việc lâu năm với woocommerce chắc các bạn sẽ bỏ túi cho mình một số hàm thông dụng đúng không? Hôm nay mình sẽ chia sẻ một số hàm mà mình hay sử dụng để mọi người có thể sử dụng khi cần nhé.
Các hàm thông dụng trong woocommerce
Hiển thị tiêu đề
Hiển thị liên kết
Hiển thị ảnh thumnail
Hiển thị giá sản phẩm định dạng HTML
echo $product->get_price_html();
Hiển thị mã SP
Hiển thị tình trạng sp
Hiển thị đánh giá sản phẩm
Ngoài các hàm này ra, các bạn hoàn toàn có thể sử dụng function chứ template có sẵn của woocommrece nhé. Cách này thích hợp cho các bạn đã sử dụng hook và muốn hiển thị thông tin từ các hook này.
Hiển thị khu vực tiêu đề sản phẩm
Hiển thị khu vực đánh giá sản phẩm
Hiển thị khu vực giá sản phẩm
Hiển thị khu vực mô tả sản phẩm
Hiển thị khu vực add to cart
Hiển thị khu vực meta của sản phẩm
Hiển thị khu vực chia sẻ thông tin sản phẩm
Nhân tiện đây mình chia sẻ các bạn cách để tạo được ô hiển thị thông tin sản phẩm giống TGDD nhé.
Các bạn chỉ cần nhập đoạn code sau vào file function.php
global $product;?>
<div class="bottom-order">
<div class="bottom-order__info">
<?php echo woocommerce_get_product_thumbnail();?>
<div class="bottom-order__info__title">
<?php the_title();?>
<?php echo $product->get_price_html();?>
</div>
</div>
<div class="bottom-order__buy">
<?php woocommerce_template_loop_add_to_cart();?>
</div>
</div>
<?php }
add_action('woocommerce_after_single_product_summary','add_custom_product');
Một chút css
padding-bottom: 15px;
overflow: hidden;
}
.bottom-order__info {
display: block;
vertical-align: middle;
float: left;
width: 35%;
}
.bottom-order__info img{
width: 70px;
height: auto;
margin: 0 10px 0 0;
}
.bottom-order__info__title{
display: inline-block;
width: 180px;
vertical-align: middle;
}
.bottom-order__buy{
display: block;
vertical-align: middle;
margin: 0;
float: right;
width: 64%;
text-align: right;
}
Và đây là kết quả
