Hướng dẫn thêm nút mua hàng ở ngoài website

Mình nhận thấy ngày nay việc bán hàng không chỉ ở trên web của mình, mà còn bán ở nhiều sàn khác nhau. Nên phát sinh ra nhu cầu thêm nút mua hàng tại các sàn TMĐT khác.

• Hướng dẫn thay đổi độ dài của mô tả trong theme flatsome
• Hướng dẫn hiển thị biến thể sản phẩm dạng table
• Code chèn bài viết liên quan vào giữa nội dung bài viết đơn giản nhất
• Code bài viết liên quan theme flatsome không cần plugin
• Hướng dẫn sử dụng theme Flatsome từ căn bản đến nâng cao mới nhất

Hôm nay mình sẽ hướng dẫn cách thêm nút mua hàng tên các sàn TMĐT khác, với tùy chọn link riêng cho từng sản phẩm.

Bước 1: Cài plugin Advanced Custom Field

Để cài plugin, ta login vào Dashboard của web, chọn Plugin -> Cài mới

Gõ Advanced Custom Field vào ô tìm kiếm rồi click cài đặt khi Plugin hiện ra

Cuối cùng là click kích hoạt

Như vậy là đã cài xong plugin Advanced Custom Field

Bước 2: Thêm các trường (field) nhập link mua hàng vào sản phẩm

Sau khi cài đặt plugin, ta rê chuột vào Custom Field -> Add New

Tiếp đó ta gõ tên field group (tên gì cũng dc), rồi ở phần type ta chọn là Sản phẩm. Xong thì ta chọn Add Field để thêm trường vào, các thông số như hình

Các bạn lưu ý, hôm nay mình hướng dẫn tạo link cho 4 sàn, nên làm đúng theo hướng dẫn để khớp với đoạn code ở phần tiếp theo. Nhập đúng kiểu như trong hình, và add field cho đủ 4 cái như hình bên dưới. Sau đó bấm đăng để kích hoạt các field.

Thực hiện như trên thì khi ta chọn Sản phẩm -> Thêm mới sẽ thấy các field hiện ra dưới phần mô tả chi tiết và trên phần dữ liệu sản phẩm.

Bước 3: Code hiển thị các nút mua hàng ra bên ngoài

Các bạn vào Giao diện -> Sửa giao diện

Tiếp theo chọn functions.php, rồi chèn đoạn code sau vào ô nội dung, cuối cùng bấm Cập nhật tập tin là xong

Nội dung đoạn code:

//Thêm code vào đây
function link_san_tmdt() {
    $link_lazada = get_field('link_lazada');
    $link_tiki = get_field('link_tiki');
    $link_shopee = get_field('link_shopee');
    $link_sendo = get_field('link_sendo');
    ob_start();
    echo '<div class="link-san-tmdt">';
    // code đưa link lazada
    if($link_lazada) echo '<div class="link-item"><a href="'.$link_lazada.'" class="link-lazada" target="_blank">Mua trên Lazada</a></div>';	
    // code đưa link shopee
    if($link_shopee) echo '<div class="link-item"><a href="'.$link_shopee.'" class="link-shopee" target="_blank">Mua trên Shopee</a></div>';
    // code đưa link sendo
    if($link_sendo) echo '<div class="link-item"><a href="'.$link_sendo.'" class="link-sendo" target="_blank">Mua trên Sendo</a></div>';	
    // code đưa link tiki
    if($link_tiki) echo '<div class="link-item"><a href="'.$link_tiki.'" class="link-tiki" target="_blank">Mua trên Tiki</a></div>';
    echo '</div>';	
    echo '
    <style>.link-san-tmdt{margin-bottom:15px}.link-san-tmdt:after{content:"";display:table;clear:both}.link-san-tmdt>div{float:left;width:50%;padding:2px}.link-san-tmdt a{display:block;width:100%;text-align:center;padding:10px;color:#fff;font-size:16px;}a.link-lazada{background:#f57224}a.link-tiki{background:#017fff}a.link-shopee{background:#d0011b}a.link-sendo{background:#bc000b}</style>
    ';
    $link = ob_get_contents();
    ob_end_clean();
    echo $link; 
}
add_action('woocommerce_product_meta_start','link_san_tmdt',5);

Kết quả đạt được:

Chúc các bạn thành công!