Thứ Năm, 1 tháng 5, 2014

Hướng dẫn thêm nút Like +1 Share cuối bài viết Blospot


Hướng dẫn thêm nút Like +1 Share cuối bài viết Blospot. Thêm nút Like cho bài viết Blogspot.Hướng dẫn thêm nút Like G+ Share cho bài viết blogspot

Chào mọi người thấy có nhiều bạn hỏi về vấn đề này nên mình viết bài hướng dẫn các bạn luôn ai chưa biết thì đọc nhé.

Để tạo được nút Like +1 Share cuối bài viết Blospot bạn làm như sau:

Bước 1: Đăng nhập Blogspot ==> Templates(Mẫu) ==> Edit HTML (chỉnh sửa HTML)

==> Khuyến khích các bạn down toàn bộ code về rồi sửa bằng Notepad ++ . Chú ý trước khi sửa sao lấy 1 bản gốc để tránh trường hợp code lỗi ko khôi phục được

Bước 2:   Tìm một trong các đoạn code bên dưới:



Đoạn 1: Như blog của mình là đoạn này nhưng chú ý nó có mấy đạn như này bạn thử cho vào cái cuối cùng xem thế nào

<data:post.body/>

Đoạn 2:
<div class='post-footer'>

Đoạn 3:
<div class='post-footer-line post-footer-line-1'>

Đoạn 4:
<div class='post-footer-line post-footer-line-2'>

Đoạn 5:
<div class='post-footer-line post-footer-line-3'>

Rồi thêm đoạn code dưới đây xuống dưới đoạn code trên (chú ý thay lần lượt chứ không phải thay tất nhé. Bạn thay từng cái 1 lưu temp lại và ra load lại trang xem nó hiển thị đúng chưa nếu đúng rồi thì ok đã thành công nhé)

<b:if cond='data:blog.pageType == &quot;item&quot;'>
                      <div style='border-top:3px solid #bbb;border-bottom:1px solid #bbb;width:100%;height:24px;text-align:left;font:normal 11px Arial;color:#333;margin:10px 0;padding:10px 0 5px'>
                        <div style='float:left;padding:1px 0;margin-right:15px;font:bold 13px Arial;color:#666'>
                          <strong>
                            LIKE and Share this article:
                          </strong>
                          :
                        </div>
                        <div class='addthis_toolbox addthis_default_style '>
                          <a class='addthis_button_facebook_like' fb:like:layout='button_count'/>
                          <a class='addthis_button_tweet'/>
                          <a class='addthis_button_google_plusone' g:plusone:size='medium'/>
                          <a class='addthis_counter addthis_pill_style'/>
                        </div>
                        <script src='http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4f57432236fb4dee' type='text/javascript'/>
                      </div>
                    </b:if>
Các bạn lưu lại ra check lại xem hiển thị ok chưa

Chúc các bạn thành công ! Gặp vấn đề gì vui lòng comment xuống dưới để được hỗ trợ


Không có nhận xét nào:

Đăng nhận xét