Thêm đánh giá bài viết với Star ratings cho blogspot

Đánh giá bài viết với Star ratings cho blogspot
Cáo phó:
Blogger đã fix lại và bỏ hẳn nên không còn tác dụng nữa.
Star ratings là một plugin của blogger dành cho blogspot để khách truy cập đánh giá bài viết trên blogspot.
Plugin này khi được khách nhấn các trạng thái cảm nhận về bài viết sẽ có các ngôi sao màu vàng nổi lên với giá trị là 5 ngôi sao và với 5 trạng thái rõ ràng là:
- Ghét bài này
- Không thích bài này
- Thích bài này
- Rất thích
- Yêu thích.
5 trạng thái này được bố trí ở iframe bên phải tương ứng với 5 ngôi sao hoạt hình.Nhìn thì nó không được hoành tráng như kk star ratings của Wordpress nhưng cũng đủ chức năng.
+ Ưu điểm:
- Làm cho bài viết thêm hấp dẫn bởi hình thức chuyên nghiệp.
- Kết quả tìm kiếm nếu có sao thì hấp dẫn nhấp chuột hơn.
+ Nhược điểm:
- Nếu khách truy cập dù trong bụng thích nhưng họ cứ nhấn ghét thì chả biết cuộc đời sẽ đi về đâu.
Đây là một plugin khá thú vị cho blogspot nhưng không hiểu tại lý do gì mà blogger đã lãng quên.
Vào những năm này của thập kỷ trước nó vẫn đang được sử dụng còn bây giờ thì đã bỏ nhưng các blogspot vẫn dùng mẫu cũ tạo từ trước những năm 2010 thì vẫn còn đoạn javascript cho tiện ích này.
Đánh giá bài viết với Star ratings cho blogspot
Trong ảnh phần khoanh đỏ chính là sự hiện diện của nó trước đây
Nếu bạn muốn kích hoạt cho nó hoạt động trở lại thì điều này là hoàn toàn có thể.
Xem thử:

DEMO

Do vậy khi cài đặt tiện ích này sẽ có 2 trường hợp bạn phải giải quyết.
Trường hợp 1
Blogspot không còn thẻ <b:include name='feedLinks'/> và không còn đoạn javascript ngay sau nó.
Bước 1
Cách 1
Dán đoạn javascript sau vào trước thẻ </body>
<script src='http://www.google.com/jsapi' type='text/javascript'/>
    <script type='text/javascript'>
      google.load("annotations", "1", {"locale": "<data:top.languageCode/>"});
      function initialize() {
        google.annotations.setApplicationId(<data:top.blogspotReviews/>);
        google.annotations.createAll();
        google.annotations.fetch();
      }
      google.setOnLoadCallback(initialize);
    </script>
Tiện ích sẽ có ngôn ngữ là tiếng Anh.
Cách 2
Trả lại <b:include name='feedLinks'/> và thêm javascript.
Bạn mở rộng thẻ <b:includable id='main' var='top'> ở cuối gần thẻ đóng nó có dạng:
<b:else/>
    <b:include name='mobile-main'/>
  </b:if>
  <b:if cond='data:top.showPlusOne'>
    <data:top.googlePlusBootstrap/>
  </b:if>
</b:includable>
Bạn thêm đoạn code sau vào ngay trên <b:else/>
<!-- feed links -->
    <b:include name='feedLinks'/>
<script src='http://www.google.com/jsapi' type='text/javascript'/>
    <script type='text/javascript'>
      google.load("annotations", "1", {"locale": "<data:top.languageCode/>"});
      function initialize() {
        google.annotations.setApplicationId(<data:top.blogspotReviews/>);
        google.annotations.createAll();
        google.annotations.fetch();
      }
      google.setOnLoadCallback(initialize);
    </script>
Tiện ích có ngôn ngữ là tiếng Việt.
Bước 2
Tìm tới thẻ <div class='post-footer'> và dán đoạn code sau vào sau nó
<b:if cond='data:blog.pageType == &quot;item&quot;'>
   <span class='star-ratings'>
      <div expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:background-color='#fff' g:height='35' g:type='RatingPanel' g:width='155' />
   </span>
   <div style='clear: both;'/>
</b:if>
Nếu sử dụng cách 2 thì trị số g:width='155' sửa lại thành 220 cho vừa với tiếng việt.
Lưu mẫu và xem kết quả.
Trường hợp 2
Bước 1
+ Nếu blogspot đang sử dụng mẫu cơ bản có từ trước những năm 2010 thì vẫn còn thẻ <b:include name='feedLinks'/> và ngay sau nó là đoạn javascript:
<b:if cond='data:top.showStars'>
    <script src='http://www.google.com/jsapi' type='text/javascript'/>
    <script type='text/javascript'>
      google.load("annotations", "1", {"locale": "<data:top.languageCode/>"});
      function initialize() {
        google.annotations.setApplicationId(<data:top.blogspotReviews/>);
        google.annotations.createAll();
        google.annotations.fetch();
      }
      google.setOnLoadCallback(initialize);
    </script>
</b:if>
Bạn chỉ cần bỏ thẻ điều kiện là 2 dòng tô màu vàng là xong bước 1.
Tiện ích sẽ có ngôn ngữ là tiếng Việt vì là blog tiếng Việt.
+ Nếu blogspot sử dụng HTML dựa trên nền tảng HTML mới của blogger thì vẫn có thẻ <b:include name='feedLinks'/> nhưng không có đoạn javascript thì bạn cứ thêm vào sau nó đoạn javascript đã bỏ thẻ điều kiện.
Bước 2
Tìm tới thẻ <div class='post-footer'> và dán đoạn code sau vào sau nó
<b:if cond='data:blog.pageType == &quot;item&quot;'>
   <span class='star-ratings'>
      <div expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:background-color='#fff' g:height='35' g:type='RatingPanel' g:width='220' />
   </span>
   <div style='clear: both;'/>
</b:if>
Lưu mẫu và xem kết quả.

Lưu ý:
+ Tiện ích là để khách truy cập cảm nhận bài viết của bạn chứ không phải để bạn tự sướng nên không nên tự sướng à nhầm tự click vào thành quả của mình.
+ Tiện ích chỉ có hiệu lực trên:
- Blogspot sử dụng tên miền riêng.
- Blogspot (blogspot.com) không sử dụng giao thức https.

Nhận xét

4 nhận xét :

  1. mình đã làm y hệt như bạn hướng dẫn nhưng vẫn không hiên thị bạn xem giúp mình với bạn ơi, blog của mình luuanh.com xin chân thành cảm ơn bạn

    Trả lờiXóa
    Trả lời
    1. Lưu mẫu rồi gửi vào chỗ biểu mẫu liên hệ cuối blog ý,tôi sửa rồi gửi lại cậu tải lên sau.

      Xóa
    2. Cậu vào tài khoản Gmeo của cậu rồi gửi vào tk của tôi là:
      doisong24@gmail.com
      Tệp xml là cái mẫu đó cậu gửi theo Tệp đính kèm.

      Xóa
    3. mình đã gủi tem qua email cho bạn bạn nhé. mong bạn giúp mình sớm với. cho mình cảm ơn bạn trước nhé.

      Xóa