Cách lấy thuộc tính các biến thể trong Woocomecer
Trong một số trường hợp để có thể tùy biến được Web thương mại điện tử xây dựng bằng Woocomecer thì bạn cần lấy từng giá trị của trường biến thể.
Lấy giữ liệu biến thể sản phẩm Woocomecer bằng Plugin
Mình chưa tìm hiểu xem có Plugin nào lấy được ko nhưng mình ko thích dùng nhiều Plugin lắm.
Chỉ có bần cùng ko code được thì mới dùng Plugin. Vì dùng nhiều Plugin sẽ khiến Website của bạn load chậm hơn khá nhiều, nhất là trong trang Admin.
Cách lấy giữ liệu biến thể sản phẩm Woocomecer bằng Code
Lấy từng trường biến thể Woocomecer
Để có thể có thể lấy được giữ liệu của 1 trường tùy chỉnh bất kỳ bạn chỉ cần sao chép đoạn code này và chỗ muốn hiển thị là đc nhé.
<div class=”thuoc-tinh”>
<div class=”mau-sac”><?php $fabric_values = get_the_terms( $product->id, ‘pa_mau-sac‘);
foreach ( $fabric_values as $fabric_value ) { ?>
<p class=”<?php echo $fabric_value->name; ?>”></p>
<?php } ?> </div>
</div>
Bạn lưu ý chỗ mình đánh dấu màu xanh lá cây nhé. Đó là đường slug của trường đó. Để có thể lấy được giữ liệu trường khác bạn chỉ cần thay thể thôi nhé.
Lấy tất cả các biến thể Woocomecer
Phần này bạn sẽ làm việc trong file Function.php nhé
/**
* Replace add to cart button in the loop.
*/
function
iconic_change_loop_add_to_cart() {
remove_action(
'woocommerce_after_shop_loop_item'
,
'woocommerce_template_loop_add_to_cart'
, 10 );
add_action(
'woocommerce_after_shop_loop_item'
,
'iconic_template_loop_add_to_cart'
, 10 );
}
add_action(
'init'
,
'iconic_change_loop_add_to_cart'
, 10 );
/**
* Use single add to cart button for variable products.
*/
function
iconic_template_loop_add_to_cart() {
global
$product
;
if
( !
$product
->is_type(
'variable'
) ) {
woocommerce_template_loop_add_to_cart();
return
;
}
remove_action(
'woocommerce_single_variation'
,
'woocommerce_single_variation_add_to_cart_button'
, 20 );
add_action(
'woocommerce_single_variation'
,
'iconic_loop_variation_add_to_cart_button'
, 20 );
woocommerce_template_single_add_to_cart();
}
/**
* Customise variable add to cart button for loop.
*
* Remove qty selector and simplify.
*/
function
iconic_loop_variation_add_to_cart_button() {
global
$product
;
?>
<div
class
=
"woocommerce-variation-add-to-cart variations_button"
>
<button type=
"submit"
class
=
"single_add_to_cart_button button"
><?php
echo
esc_html(
$product
->single_add_to_cart_text() ); ?></button>
<input type=
"hidden"
name=
"add-to-cart"
value=
"<?php echo absint( $product->get_id() ); ?>"
/>
<input type=
"hidden"
name=
"product_id"
value=
"<?php echo absint( $product->get_id() ); ?>"
/>
<input type=
"hidden"
name=
"variation_id"
class
=
"variation_id"
value=
"0"
/>
</div>
<?php
}
.products .variations {
border: 1px solid #eee;
position: relative;
margin-bottom: 50px;
}
.products .variations td {
display: block;
padding: 10px 20px 18px;
text-align: center;
border-bottom: 1px solid #eee;
}
.products .variations td:first-child {
padding-bottom: 0;
border: none;
}
.products .variations td:last-child {
padding-top: 5px;
}
.products .variations tr:last-child td {
border: none;
}
.products .variations td label {
font-weight: 600;
}
.products .variations td select {
width: 100%;
}
.products .variations .reset_variations {
margin: 10px 0 0;
position: absolute;
bottom: -35px;
left: 0;
right: 0;
}
Yêu cầu: bạn cần phải biết chút HTML, CSS để làm được dễ hơn nhé.
Nếu có thắc mắc gì bạn cứ để lại Comment mình sẽ có gắng giải đáp nhé