HACK LIKE, AUTO LIKE, HACK SUB FACEBOOK

HACKLIKE.PLUS là hệ thống hack like, hack sub, tăng like việt miễn phí chất lượng hàng đầu trên mạng xã hội Facebook 2019 👍

Đến ngay trang hack like miễn phí chất lượng nhất 2019 : https://hacklike.plus

Tạo nút in bài viết với trang xem trước cho Blog

Tài liệu
Tạo nút in bài viết với trang xem trước cho Blog
Chuyên mục
Người đăng
Đăng vào
Để tạo thêm tính chuyên nghiệp, mang lại sự thẩm mỹ cho bố cục bài viết và tất nhiên cũng vô cùng quan trọng người ta thường chèn nút in có thể bên dưới tiêu đề hoặc dưới cùng bài viết. Nó có tác dụng khi người đọc muốn in bài có thể xem trước nội dung trước khi bấm in trang.

Thông thường khi muốn in một trang nào đó trên web cách nhanh nhất là bấm tổ hợp phím Ctrl + P để hiện trang Print Preview. Tuy nhiên nếu bạn tạo trang bố cục bài viết xem trước giống như những trang tin tức tạp chí như vậy trông chuyên nghiệp hơn.

Cách làm ở đây có 3 vấn đề như sau thứ nhất bạn phải tạo bố cục cho trang Print Preview tức là khi bấm Ctrl + P và thứ hai là tạo trang xem trước trước khi bấm Ctrl + P và cuối cùng đặt nút in trong bài viết.

Tùy theo mỗi theme được thiết kết có id, class khác nhau do đó ở đây mình chỉ hướng dẫn phương pháp làm còn css bạn thay vào cho phù hợp

1. Tạo nút in bài viết


Tạo CSS cho nút in

.printBtn {    float:right;    cursor:pointer;}.printBtn:before {    font-family: fontawesome;    content: '\f02f';    float: left;    background: #005A89;    width: 25px;    vertical-align: text-bottom;    text-align: center;    color: #fff;    height: 18px;    line-height: 18px;    font-size: 14px;    border-radius: 3px;}

Đặt nút in vào bài viết

<div class='printBtn'/>

2. Tạo trang xem trước


Cách thực hiện sử dụng jquery thêm class trước tiếp và gọi nút in ví dụ

<script>//<![CDATA[$(".printBtn").click(function() {  $('#taskbar,.header-right,.sidebar-wrapper,.breadcrumbs,.post-social,.knc-menu-nav,.related-post,#related-posts,.keywords,.social-sharing-widgets,.fb-comments,.ads_Gg,#comments,#PopularPosts1,#PopularPosts2,#HTML4,.footer-wrapper,#footer,.ads-right, .ads-left').css('display','none')  $('body').css('background-color','#fff')  $('.header-wrapper').css('border-bottom','2px solid #ccc')  $('.main-wrapper').css('border','none')  $('.box').css('width','100%').css('float','none')  $('.post-metaDescription,.related-post,.post-body').css('padding-left','0')  $('.print').css('display','block')});//]]></script>

Thêm đoạn mã HTML để tạo nút IN TRANG (CTRL+P)

Tạo CSS

#printBtn {    // Viết css}.print{    display:none;}

Đặt đoạn mã HTML trong trang xem trước

<div id='printBtn'<a class='print' href='javascript:void(0);' onclick='javascript:window.print();' rel='nofollow' title='In bài viết này'>In trang (Ctrl+P)</a></div>

3. Tạo bố cục cho trang Print Preview


Thêm CSS

@media print {    // Viết css vào đây    #printBtn {display: none} // Ẩn nút IN TRANG (CTRL+P)}

Cách viết css các bạn kiểm tra phần tử xem class và điều chỉnh cho phù hợp.

Hiện có bình luận

Chào mừng bạn đến với dịch vụ tăng tương tác bán hàng trên Instagram, tăng auto like bài viết, hình ảnh video, tăng lượt theo dõi (follower) nick Instagram.

Xin chào, rất vui khi bạn có mặt tại hệ thống “sống ảo” trên Instagram này của mình 🙂 nếu bạn đang tìm kiếm một dịch vụ tăng like, tăng tương tác, người theo dõi cho tài khoản Instagram của bạn thì đây chính là nơi bạn cần 👍

Mọi thắc mắc cũng như thông tin về dịch vụ các bạn hãy vào trang web https://pro.blogaz.vn

Thông báo
Dịch vụ tăng tương tác bán hàng trên Instagram, tăng auto like bài viết, hình ảnh video, tăng lượt theo dõi (follower) nick Instagram. Xem ngay »
Xong

Zalo Chat

Skype Chat

Gửi Email

Call 0964863152

Liên hệ