Tạo tiện ích đánh giá 5 sao cho bài viết trong blogger

 hi xin chào tất cả mọi người nha, nay thì mình xin chia sẽ cho mọi người cách mà chúng ta có thể tạo một cái công cụ đánh giá năm sao cho bài viết trên blogger nhá. 

Tạo tiện ích đánh giá 5 sao cho bài viết trong  blogger


  • Cài đặt widget xếp hạng sao trong mỗi bài đăng blog trên trang web của bạn sẽ trông chuyên nghiệp hơn, ngoài ra nó cũng có thể dùng để đánh giá quan điểm của khách truy cập về nội dung trang web và tên miền của bạn đồng thời tăng SEO trên tìm kiếm của Google.
  • Trên các nền tảng blog như WordPress, tiện ích để cài đặt tiện ích xếp hạng sao được cung cấp theo mặc định, nhưng tiếc là dịch vụ Blogger của Google chưa có tính năng tiện ích xếp hạng sao. Vì vậy chúng ta phải tận dụng widget của bên thứ ba để có thể triển khai widget đánh giá trên blogger
  • Trong bài đăng này, tôi sẽ chia sẻ một hướng dẫn về cách đặt xếp hạng sao cho widget trên blogger. Nếu bạn quan tâm đến việc cài đặt nó trên bất kỳ blog nào bạn tạo, hãy đọc toàn bộ bài đăng bên dưới và làm theo các bước đã cho.

Cách thực hiện. 

chỉ áp dụng cho một số theme nhất định. Phổ biến là medium ui

Bước 1: truy cập vào trang quản trị blogger --> chủ đề --> chình sửa html 

Bước 2: Copy toàn bộ code bên dưới và dán vào phía trên của thẻ </head> 

<style type='text/css'>
/* Post Star Rating Widget By kimidev.site */
#wpac-rating:before{content:"Rate This Article";top:-15px;text-align:center;position:relative;width:100%;}
#wpac-rating .wp-stars .wp-star:hover:before{z-index:999;padding:3px 11px;background:#1a1d23f0;color:#fff;font-size:12px;border-radius:2px;white-space:nowrap;position:absolute;line-height:1.4;text-align:center;-ms-transform:translateX(-30%);-moz-transform:translateX(-30%);-webkit-transform:translateX(-30%);transform:translateX(-30%);top:100%;margin-top:9px;}
</style>
Bước 3: copy thẻ HTML bên dưới và dán vào phía dưới của thẻ <data:post.body/>

<div id="wpac-rating"></div>

Bước 4: Copy toàn bộ mã Javascript bên dưới và dán vào phái trên của thẻ </body> 

<script type="text/javascript">
wpac_init = window.wpac_init || [];
wpac_init.push({widget: 'Rating', id: 31970});
(function() {
    if ('WIDGETPACK_LOADED' in window) return;
    WIDGETPACK_LOADED = true;
    var mc = document.createElement('script');
    mc.type = 'text/javascript';
    mc.async = true;
    mc.src = 'https://embed.widgetpack.com/widget.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(mc, s.nextSibling);
})();
</script>
và bây giờ chỉ cần lưu lại và xem kết quả thui nhé. chúc các bạn thành công. 

phía trên là toàn bộ code giúp các bạn tạo một cái tiện ích đánh giá năm sao cho bài viết của mình. nếu như có thắc mắc hay bất cứ vấn đề nào thì hãy comment bên dưới mình sẽ giải đáp cho các bạn nhé. chúc các bạn một ngày tốt lành. 
Design by @KiMiDev

9 Nhận xét

Cảm ơn bạn đã nhận xét, chúng tôi sẽ quay lại và trả lời cho bạn sớm nhất có thể !!!

Mới hơn Cũ hơn

Nhận xét Mới