Chào các bạn, hôm nay mình sẽ hướng dẫn các bạn cách tạo hộp like và chia sẻ góc trái màn hình tuyệt đẹp. I. HƯỚNG DẪN THỰC HIỆN Đầu tiên bạ...
Chào các bạn, hôm nay mình sẽ hướng dẫn các bạn cách tạo hộp like và chia sẻ góc trái màn hình tuyệt đẹp.
I. HƯỚNG DẪN THỰC HIỆN
Đầu tiên bạn truy cập vào trang quản trị blogger rồi chọn Chủ đề => Chỉnh sửa. Sau đó các bạn tìm đến thẻ ]]></b:skin> rồi dán đoạn code sau lên trước thẻ đó:
[code type="Copy mã CSS này"]#conversions-box.conversions-box-open {bottom: 0;}
#conversions-box{background:rgba(0,0,0,0.8);position:fixed;z-index:9999;bottom:-95px;left:10px;color:#fff;font-size:13px;font-weight:700;font-family:Helvetica,Arial,sans-serif;text-shadow:px 1px 2px rgba(0,0,0,0.7);-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;-webkit-transition:all .5s ease-out;-moz-transition:all .5s ease-out;-ms-transition:all .5s ease-out;-o-transition:all .5s ease-out;transition:all .5s ease-out;padding:25px 35px 45px}
#conversions-box-close{position:absolute;top:10px;right:10px;background-size:16px 32px;width:9px;height:9px;text-decoration:none;padding:4px}
#conversions-box span {min-width: 100px;display: block;text-align: center;}
#conversions-box .fb-like {position: absolute;left: 15px;top: 51px;}[/code]
Tiếp theo các bạn dán đoạn code sau lên trước thẻ đóng </body>.
[code type="Copy mã Javascript này"]<div id="conversions-box" class="conversions-box-open">
<a href="#close" id="conversions-box-close">x</a>
<span>Like để nhận thủ thuật mới</span>
<div class="fb-like" data-href="https://www.facebook.com/FBabcBK" data-layout="button" data-action="like" data-size="small" data-show-faces="false" data-share="true"></div>
</div>
<script type='text/javascript'>
//<![CDATA[
jQuery('#conversions-box-close').on('click', function() {
jQuery(this).parent().remove();
});
//]]>
</script>[/code]
Cuối cùng lưu mẫu lại và xem thành quả.
Lưu ý: Đừng quên thay thế địa chỉ "FBabcBK" thành của bạn nhé.
II. LỜI KẾT
Vậy là chỉ với vài bước bạn đã có thể tự tạo box like và chia sẻ rất tuyệt vời rồi. Chúc các bạn thành công!
Nếu bạn gặp bất cứ lỗi nào trong quá trình thực hiện vui lòng để lại bình luận bên dưới bài viết này.
COMMENTS