4/23/2015

Tạo một tiện ích nằm bên cạnh post body của Blogger


Có lẽ đây cũng là một thủ thuật khá quen thuộc bởi vì đã có một bài viết mà Lãng Tử Studio chia sẻ với bạn đọc về cách chèn quản cáo vào Blogspot ở nhiều vị trí đã có nói về nhiều trường hợp chèn tiện ích ở nhiều vị trí khác nhau trong đó cũng có việc chèn tiện ích nằm
ngay bên cạnh phần post body.
Và bài viết này để rõ ràng hơn nữa thì mình chia sẻ để trả lời thêm cho bạn đọc vì nhiều bạn có comment hỏi vậy các trường hợp chèn Like Facebook, ảnh quảng cáo,...vào phía đó thì như thế nào.
Nội dung dưới đây sẽ giúp bạn trả lời được những việc đó và nếu bạn thích thú với demo trực tiếp bên dưới thì có thể làm theo hướng dẫn ngay dưới đây

1. Thêm vào bên cạnh 1 bài viết

- Khi các bạn chọn đăng mới, chỉnh sửa một bài viết thì soạn thảo ở chế độ HTML

Sau đó dán đoạn code dưới đây ngay đầu tiên của bài viết
<div class="widget-beside-post" style="clear: left; display: inline-block; float: left; height: 400px; margin: 12px 20px -50px 0px; width: 234px;">
Dán nội dung của bạn vào đây
</div>


Ví dụ:
<div class="widget-beside-post" style="clear: left; display: inline-block; float: left; height: 300px; margin: 12px 20px -50px 0px; width: 234px;">
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/noithatpv&amp;width&amp;height=235&amp;colorscheme=light&amp;show_faces=true&amp;header=true&amp;stream=false&amp;show_border=true" style="border: none; height: 235px; overflow: hidden; width: 100%;"></iframe>
</div>
Ví dụ trên là mình sử dụng tiện ích like Facebook nằm bên cạnh.

2. Thêm widget vào bên cạnh tất cả các bài viết

Để thêm vào mặc định tất cả các bài viết các bạn làm như sau:
- Vào bảng điều khiển Blogger -> Template (Mẫu) -> Chỉnh sửa HTML (Edit HTML)
- Tìm tới (Dùng tổ hợp phím Ctrl + F) đoạn dưới đây
<div class='post-body entry-content'>
Nếu xuất hiện 2 đoạn code tìm được thì chọn đoạn code thứ 2 nhé. Và dán code tương tự như trên ngay dưới nó.
- Lưu mẫu lại và xem kết quả !
Chúc các bạn vui vẻ !

xem thêm các thủ thuật khác tại Lãng Tử Studio

0 nhận xét:

Đăng nhận xét