Các Plugin cần chuẩn bị để tạo Short code làm tiếp thị liên kết

1. Advanced Custom Fields PRO: cái này dùng để cài đặt nhúng các trường dữ liệu cần thiết cho short code. Lưu ý là bản Pro mới dùng được, bản free thì không đủ tính năng.

2. Custom Post Type UI: cái này để tạo danh mục sản phẩm riêng cho AFF. Cái này dùng bản free được.

Các bước thực hiện tạo Short code affiliate

Bước 1. Tạo Danh mục sản phẩm mới với Custom Post Type UI

Vào Custom Post Type UI -> add/edit post type -> điền “shopee_product” vào các trường dữ liệu như hình, rồi bấm add post type.

Sau khi tạo xong trên cột Menu Dashboard sẽ xuất hiện thêm dòng shopee product, nhưng lúc này vẫn chưa sử dụng được.

Bước 2. Thêm trường dữ liệu vào shopee product bằng Advanced Custom Fields PRO

– Vào AFC -> Fields Group -> And new Group, sau đó sẽ ra bàng để các bạn điền thông tin cho group

– Điền tên trường: shopee product

– Thêm Field 1: Product Image, Loại image

– Thêm Field 2 là Affiliate Shops, Type đặt dạng Repeater.

Ở dưới Sub Fileds thì thêm 3 trường dữ liệu:

• Shop Name: text
• Affiliate Link: Url
• Shop Price: text

( Bạn muốn thêm trường gì thì có thể thay đổi và thêm ở đây )

– Cài đặt output cho trường dữ liệu: Post type is equal to shopee product, để gắn các trường dữ liệu này vào danh mục sản phẩm đã tạo ở trên.

Bước 3. Thêm sản phẩm vào Shopee product.

Lúc này các bạn vào shopee product trên Dashboard,

• Thêm sản phẩm, điền tên sản phẩm, URL sản phẩm có thể để mặc định theo tên hoặc tùy chỉnh
• Thêm ảnh sản phẩm
• Trong trường Affiliate Shop các bạn có thể thêm nhiều dòng, mỗi dòng sẽ đại diện cho 1 link AFF, lúc này bạn sẽ điền Shop name, link aff, giá sản phẩm.
• Sau khi tạo sản phẩm xong bạn sẽ có 1 URL sản phẩm như: https://domain.com/shopee_product/slug-san-pham
• Thì sử dụng cái slug-san-pham đó cho vào đoạn code này là thành shorcode:

Sau khi có short code rồi bạn có thể thêm vào bất cứ bài blog nào phù hợp.

Ảnh minh họa sản phẩm aff được hiển thị trên website:

Bước 4. Hiển thị Short code lên trên website

Sau khi đã tạo được sản phẩm shopee aff rồi, thì bạn cần tạo Short code và ném nó vào các bài blog trên website.

1. Cài đặt code hiển thị trong file Function.php, truy cập Giao diện -> Sửa tệp tin giao diện -> rồi thêm đoạn code này vào, thêm xong thì nhớ lưu lại:

Đây là đoạn code đã được mình tinh chỉnh, thêm lượt đánh giá 5* ảo để trông cho đẹp mắt:

// Tạo shortcode aff shopee //

function aff_product_shortcode($atts){

    $atts = shortcode_atts([

        ‘slug’ => ”

    ], $atts);

    $product = get_page_by_path(

        $atts[‘slug’],

        OBJECT,

        ‘shopee_product’

    );

    if(!$product){

        return ”;

    }

    $id = $product->ID;

    $title = get_the_title($id);

    $reviews = 99 + ($id % 800);

    $image = get_field(‘product_image’, $id);

    if(is_array($image)){

        $image_url = $image[‘url’] ?? ”;

    }elseif(is_numeric($image)){

        $image_url = wp_get_attachment_url($image);

    }else{

        $image_url = $image;

    }

    ob_start();

    ?>

    <div class=”aff-product-box”>

        <div class=”aff-product-image”>

            <?php if($image_url): ?>

                <img src=”<?php echo esc_url($image_url); ?>” alt=”<?php echo esc_attr($title); ?>”>

            <?php endif; ?>

        </div>

        <div class=”aff-product-info”>

            <h3 class=”aff-product-title”>

                <?php echo esc_html($title); ?>

            </h3>

            <div class=”aff-product-rating”>

                ★★★★★

                <span>(<?php echo $reviews; ?> đánh giá)</span>

            </div>

            <?php if(have_rows(‘affiliate_shops’,$id)): ?>

                <?php while(have_rows(‘affiliate_shops’,$id)): the_row();

                    $shop_name  = get_sub_field(‘shop_name’);

                    $shop_price = get_sub_field(‘shop_price’);

$shop_price = preg_replace(‘/[^0-9]/’, ”, $shop_price);

                    $shop_link  = get_sub_field(‘affiliate_link’);

                ?>

                    <div class=”aff-shop-row”>

                        <span class=”aff-shop-price”>

                            <?php echo number_format((int)$shop_price, 0, ‘,’, ‘.’); ?>₫

                        </span>

                        <a href=”<?php echo esc_url($shop_link); ?>”

                           target=”_blank”

                           rel=”nofollow sponsored”

                           class=”aff-product-button”>

                            Mua tại <?php echo esc_html($shop_name); ?>

                        </a>

                    </div>

                <?php endwhile; ?>

            <?php endif; ?>

        </div>

    </div>

    <?php

    return ob_get_clean();

}

add_shortcode(‘aff’,’aff_product_shortcode’);

2. Cài đặt hiển thị trong Custome CSS:

Lúc này Short code đã hoạt động, nhưng nó vẫn khá xấu, vì thế cần cài đặt CSS để nó hiển thị đẹp mắt hơn. Kích thước, bố cục website của mình có thể khác các bạn, nên việc méo hình có thể xảy ra, lúc này hãy chỉnh sửa lại các thông số trong css để hiển thị phù hợp hơn.

Bạn vào Giao diện -> Tùy chỉnh -> Css bổ xung rồi thêm đoạn code này vào:

/* cài đặt aff link shopee */
.aff-product-box{
display:flex;
gap:20px;
padding:15px;
border:1px solid #e5e5e5;
border-radius:8px;
margin:20px 0;
align-items:flex-start;
}

.aff-product-image{
width:300px;
flex-shrink:0;
}

.aff-product-image img{
width:300px;
height:300px;
object-fit:contain;
display:block;
}

.aff-product-info{
flex:1;
}

.aff-product-title{
margin:0 0 10px;
font-size:24px;
font-weight:700;
line-height:1.4;
}

.aff-product-rating{
color:#f5a623;
font-size:16px;
margin-bottom:20px;
}

.aff-product-rating span{
color:#666;
margin-left:5px;
}

.aff-shop-row{
display:flex;
align-items:center;
gap:15px;
margin-bottom:12px;
}

.aff-shop-price{
width:140px;
color:#e53935;
font-size:22px;
font-weight:700;
}

.aff-product-button{
display:inline-block;
background:#ee4d2d;
color:#fff !important;
padding:8px 15px;
border-radius:5px;
text-decoration:none;
font-weight:600;
}

.aff-product-button:hover{
opacity:.9;
}

3. Thêm Short code vào bài viết hay vị trí cần hiển thị:

Trong quá trình soạn thảo blog, bạn có thể thêm Short code vào bất cứ vị trí nào trong bài viết, ở đầu, giữa, cuối đều được.

Sau đó save bài viết lại và truy cập link bài blog trực tiếp để thấy sản phẩm shopee aff đã được hiển thị.

Ví dụ mình viết bài về các bài tập tay, tập ngực, mình gắn liên kết tới các loại tạ tay, bạn có thể tham khảo hiển thị shop tạ tay trong bài viết này: https://suckhoeplus.net/bai-tap-nguc/

Tạo shortcode làm tiếp thị liên kết giúp website trình bày sản phẩm trực quan, dễ quản lý và có thể tái sử dụng ở nhiều vị trí khác nhau. Khi kết hợp shortcode với nội dung hữu ích, nút kêu gọi hành động và cách đặt liên kết hợp lý, bạn có thể xây dựng hệ thống affiliate chuyên nghiệp hơn và tối ưu khả năng chuyển đổi. Bạn cũng có thể xem thêm các kiến thức về website, WordPress và tối ưu nội dung để hoàn thiện website và nâng cao hiệu quả tiếp thị liên kết.