1BANNER 123
4.9/5 - (65 bình chọn)

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 đề

the_title();

Hiển thị liên kết

the_permalink();

Hiển thị ảnh thumnail

the_post_thumbnail("thumbnail",array( "title" => get_the_title(),"alt" => get_the_title() ));

Hiển thị giá sản phẩm định dạng HTML

global $product;
echo $product->get_price_html();

Hiển thị mã SP

echo get_post_meta( get_the_ID(), '_sku', true );

Hiển thị tình trạng sp

echo get_post_meta( get_the_ID(), '_stock_status', true );

Hiển thị đánh giá sản phẩm

echo $product->get_rating_html();

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

woocommerce_template_single_title();

Hiển thị khu vực đánh giá sản phẩm

woocommerce_template_single_rating();

Hiển thị khu vực giá sản phẩm

woocommerce_template_single_price();

Hiển thị khu vực mô tả sản phẩm

woocommerce_template_single_excerpt();

Hiển thị khu vực add to cart

woocommerce_template_single_add_to_cart();

Hiển thị khu vực meta của sản phẩm

woocommerce_template_single_meta();

Hiển thị khu vực chia sẻ thông tin sản phẩm

woocommerce_template_single_sharing();

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é.

Thông tin sản phẩm giống vậy nè.

Các bạn chỉ cần nhập đoạn code sau vào file function.php

function add_custom_product(){;
    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

.bottom-order {
    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ả

Kết quả của function trên

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *