chèn nút print (in bài) vào blog/web
Hôm nay mình sẽ giới thiệu đến các bạn một thủ thuật mà các trang web ứng dụng khá nhiều và rất hữu ích cho người dùng trên blog/web. Đó là thêm tính năng in bài (Print) trên blog/web. Và mình sẽ giới thiệu đến các bạn cách để đưa tiện ích này vào blogger, với tiện ích này người đọc có thể in bài trên blog của bạn một cách nhanh chóng. Thủ thuật này không quá phức tạp, chỉ với vài bước đơn giản thì bạn có thể thiết lập được tính năng print cho blog của mình. bạn có thể xem demo ngay trên trang này.1. Đăng nhập tài khoản Blogger
2. Vào thiết kế và chọn chỉnh sửa HTML, nhấn (Mở rộng mẫu tiện ích)
3. Chèn code bên dưới vào sau (dưới) thẻ <head>
lick vào ảnh để xem ảnh lớn hơn
<style media='print' type='text/css'>
#linkbar-wrapper, #comments, #header-wrapper, .widget-content, #lower-wrapper, #header, #sidebar-wrapper,.sidebar, .comment-form,.post-footer,#blog-pager,.post-feeds,#backlinks-container,#navbar-section,.lowerbar-wrapper, #backbutton {display:none !important;}
#content-wrapper,#main-wrapper,#main {font-size:12px;float:none !important;overflow:visible !important;width:auto !important;}
#main a{color:#0000ff;text-decoration:none;}
</style>
#linkbar-wrapper, #comments, #header-wrapper, .widget-content, #lower-wrapper, #header, #sidebar-wrapper,.sidebar, .comment-form,.post-footer,#blog-pager,.post-feeds,#backlinks-container,#navbar-section,.lowerbar-wrapper, #backbutton {display:none !important;}
#content-wrapper,#main-wrapper,#main {font-size:12px;float:none !important;overflow:visible !important;width:auto !important;}
#main a{color:#0000ff;text-decoration:none;}
</style>
4. Tiếp đến bạn chèn nút print vào bài đăng code print có dạng
coppy code này
<b:if cond='data:blog.pageType == "item"'>
<span style='float:right;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2GGm8hSi96IHvj1mhkcpq0ysOnzOaAvkZBBbDSr3L-9yzcvMLv4yD13sNNOpXg_wC0iw0d4mHqUU1a5BThoGObIqzaWilMlhypNObFuz3qDCv-UAeCdTMg0Msv6tcClqA_Mg4N1vsL585/) left no-repeat; padding-left: 25px;'><a href='javascript:window.print()'>In bài này</a></span>
</b:if>
<span style='float:right;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2GGm8hSi96IHvj1mhkcpq0ysOnzOaAvkZBBbDSr3L-9yzcvMLv4yD13sNNOpXg_wC0iw0d4mHqUU1a5BThoGObIqzaWilMlhypNObFuz3qDCv-UAeCdTMg0Msv6tcClqA_Mg4N1vsL585/) left no-repeat; padding-left: 25px;'><a href='javascript:window.print()'>In bài này</a></span>
</b:if>
Tùy chọn vị trí nút print-có 2 lựa chọn cho bạn tại đây
lick vào ảnh để xem ảnh lớn hơn
A. Nếu bạn muốn đặt nút Print sau tiêu đề bài đăng, bạn chèn code ở bước 4 như bên dưới (xem ảnh hướng dẫn trên)
<div class='post-header-line-1'/>
<b:if cond='data:blog.pageType == "item"'>
<span style='float:right;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2GGm8hSi96IHvj1mhkcpq0ysOnzOaAvkZBBbDSr3L-9yzcvMLv4yD13sNNOpXg_wC0iw0d4mHqUU1a5BThoGObIqzaWilMlhypNObFuz3qDCv-UAeCdTMg0Msv6tcClqA_Mg4N1vsL585/) left no-repeat; padding-left: 25px;'><a href='javascript:window.print()'>In bài này</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<span style='float:right;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2GGm8hSi96IHvj1mhkcpq0ysOnzOaAvkZBBbDSr3L-9yzcvMLv4yD13sNNOpXg_wC0iw0d4mHqUU1a5BThoGObIqzaWilMlhypNObFuz3qDCv-UAeCdTMg0Msv6tcClqA_Mg4N1vsL585/) left no-repeat; padding-left: 25px;'><a href='javascript:window.print()'>In bài này</a></span>
</b:if>
B. Nếu muốn đặt nó cuối bài đăng thì bạn chèn như bên dưới
<data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<span style='float:right;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2GGm8hSi96IHvj1mhkcpq0ysOnzOaAvkZBBbDSr3L-9yzcvMLv4yD13sNNOpXg_wC0iw0d4mHqUU1a5BThoGObIqzaWilMlhypNObFuz3qDCv-UAeCdTMg0Msv6tcClqA_Mg4N1vsL585/) left no-repeat; padding-left: 25px;'><a href='javascript:window.print()'>In bài này</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<span style='float:right;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2GGm8hSi96IHvj1mhkcpq0ysOnzOaAvkZBBbDSr3L-9yzcvMLv4yD13sNNOpXg_wC0iw0d4mHqUU1a5BThoGObIqzaWilMlhypNObFuz3qDCv-UAeCdTMg0Msv6tcClqA_Mg4N1vsL585/) left no-repeat; padding-left: 25px;'><a href='javascript:window.print()'>In bài này</a></span>
</b:if>
Chúc bạn thành công
traidatmui
- Phần thể hiện code trong bài bạn sao thế nhỉ ?
Trả lờiXóamình chưa hiểu rõ ý bạn muốn hỏi gì?
Trả lờiXóacó phải là bạn muốn hỏi cách thể hiện code trên bài viết k?