Iris Tips
Iris TipsHide Widget Sidebar to make a full width Page or Post in Blogger
Bố cục hiện nay của đa số các blog có xu hướng chia theo tỷ lệ 7:3, trong đó 70% là nội dung bài viết (content) 30% còn lại chứa widget sidebar. Tỷ lệ đó có thể coi là khá ổn khi chúng ta đăng các bài viết bình thường, nhưng khi muốn tạo một Post hoặc một Page full width hoàn toàn, tức là không chứa Sidebar thì phải làm thế nào? Hãy theo dõi bài viết dưới đây để tạo 1 Page như vậy nhé.
Cách thực hiện
1Đầu tiên ta hãy tạo CSS để ẩn Sidebar#sidebar-wrapper {display:none!important;}
2Tiếp theo chúng ta sẽ nới rộng phần chứa nội dung bài viết thành 100% full width
#post-wrapper {width:100%!important;}3Nếu muốn ẩn luôn comment thì thêm đoạn CSS sau
#comments {display:none!important;}4Tổng hợp lại ta sẽ có đoạn CSS
<style type='text/css'>
#comments,#sidebar-wrapper {display:none!important;}
#post-wrapper {width:100%!important;}
</style>5Khi đăng bài bạn hãy chuyển sang tab HTML và thêm đoạn CSS bên trên vào.
Lưu ý: Tùy thiết kế từng template mà đoạn code trên có thể thay đổi.
Nếu có bất kỳ vấn đề khó khăn hay câu hỏi gì, bạn đừng ngần ngại, hãy để lại bình luận ở form bên dưới nhé.
Chúc bạn thành công!
Created by Iris Tips
Cho mình hỏi làm thế nào để cuộn trang mượt như trang này nhỉ?
Trả lờiXóahttp://expressmagazine.net/development/2641/cach-tao-google-api-marker-va-info-windows
jQuery Smooth Scrolling
XóaBạn kiếm smoothscroll.js, mình nghĩ code ở chỗ đó. Bỏ ký tự "\" là ra link.
XóaBài này thật hay và đúng là thứ mình cần và tìm lâu nay!Hay ở chỗ chỉ đơn giản ẩn Sidebar để mở rộng trang,không tính đến chuyện ẩn Widget,quá nhiều và phức tạp!Nhưng không hiểu sao,cũng như những bài khác cùng đề tài này,mình áp dụng không thành công!Template mình dùng là MiniMag.
Trả lờiXóaTemplate MiniMag thì bạn làm theo code này nhé
Xóa<style type='text/css'>
#footer, .sidebar-wrapper {display:none!important;}
.content {width:97.5%!important;}
</style>
Code trên mình đã ẩn luôn Footer, nếu muốn hiện bạn hãy bỏ #footer đi nhé.
p/s: Mình xóa các cm bên kia nhé. Sr bạn một lần nữa.
Cảm ơn bạn nhiều nhé!Để mình thử và nếu chưa được thì nhờ bạn giúp tiếp!
Trả lờiXóaYou are welcome /-lv
XóaCảm ơn bạn,quá tuyệt vời! Code thật hay và mình đã mất bao nhiêu thời gian mới tìm được giải pháp này!
Trả lờiXóaMình không ngờ nó đơn giản mà hiệu quả như vậy!Một lần nữa,cảm ơn bạn nhiều lắm!
Về sau bạn muốn ẩn thành phần nào thì bạn click chuột phải vào nó, chọn Kiểm tra phần tử xem thuộc class hay id nào, rồi thêm css display:none!important; như trên là được. :P
XóaCảm ơn sự chỉ dẫn tận tình của bạn!
Trả lờiXóaBạn có thể hướng dẫn mình làm cái sidebar thế này được không, cái template mình tải về chỉ có cái này là không giống trong demo thôi chắc tại miễn phí nên thế,
Trả lờiXóahttp://i.imgur.com/B2SgFcv.png
Đây là cái template đó: http://demo.mybloggerthemes.com/2015/04/fib-mag-blogger-templates.html
Cái này hình như hiện bài viết theo tag
Xóa<div id='beat2'></div>
<script type='text/javascript'>
ShowPost2({
idcontaint:"#beat2",
MaxPost:3,
Summarylength:70,
ImageSize:400,
FirstImageSize:400,
tagName:"Business"
});
</script>
<div class='clear'></div>
Bạn sửa Business thành tag bài viết của bạn xem.
Tải về không có cái tab business nào hết bạn ơi, làm sao để tạo tag bên sidebar vậy?
XóaSửa dòng script này lại thành tên blog bạn Accordion Menu sẽ tự động hiện bài viết theo tag của bạn. Nhớ để blog ở chế độ Public.
Xóa<script src='http://fib-mag.blogspot.com/feeds/posts/summary?max-results=1000&alt=json-in-script&callback=loadtoc'>
http://i.imgur.com/5FidpwH.png
Không hiểu lắm vì mình có rành cái này đâu, đặt ở đâu vậy?
XóaVào Mẫu >> Chỉnh sửa HTML >> Ctrl+F tìm dòng đó >> Sửa lại
XóaThử rồi nhưng vẫn không được bạn có thể qua giúp được không? tớ cộng bạn rùi
XóaSet Admin đi bạn
Xóarồi
XóaOk rồi đó bạn /-ok
XóaThanks bạn, nhưng nói thật là mình làm rồi nhưng không thấy gì, bạn chỉ minh bik chút được không
XóaTemplate bạn edit bị lỗi, bạn up lại template Fib-mag mặc định rồi sửa theo cách trên là được.
XóaTớ làm rồi, làm trên 1 blog khac rồi nhưng không được, lạ kinh, cảm ơn nhiều
Xóa/-st :D
Xóa/-sl
Trả lờiXóamình thấy phần code nhận xét của bạn hay ! bạn có thể hướng dẫn mình cách làm phần nhận xét giống bạn được không ? Có up hình /-sl
Trả lờiXóaTool up ảnh bạn có thể tham khảo bài viết này
Xóahttp://iris-tips.blogspot.com/2016/10/tao-cong-cu-up-anh-mini-danh-cho-blogger.html
Thử làm rồi, không được add ơi !
Trả lờiXóaTrang của bạn là quocduyauto phải không? Bạn thử dùng CSS này xem
Xóa<style type='text/css'>
.main-posts{width:100%!important;}
.sidebar,#wp-sidebar{display:none!important;}
</style>
Nhận xét này đã bị tác giả xóa.
Trả lờiXóaBạn chỉnh blog lại thành chế độ công cộng đi bạn để mình vào check
XóaBài này hay giờ mới tìm được ^^ Thanks Iris
Trả lờiXóaThank bạn nhé ^^
Xóaanh ơi ẩn sidebar trong joyful template thì như thế nào ạ, em làm cách này ko thành công.
Trả lờiXóaĐưa link trang web bạn ra đi bạn để bên mình check lại nhé
XóaNhận xét này đã bị tác giả xóa.
Xóaem làm được rồi anh ơi bị lỗi một xí code của anh tuyệt lắm ạ cám ơn anh nhìu ^^
XóaCám ơn bạn nhé, mấy nay hơi bận tí không sp ngay được, bạn thông cảm nhé |-f
Xóalàm ơn cho Anne hỏi, làm sao cho bài viết ra giữa ạ? Em ẩn sidebar rồi mà bài viết vẫn bến trái???
Trả lờiXóa>> https://nhathaomoc-inc.blogspot.com/2019/05/cung-ve-ay-xay-ap-yeu-thuong.html
làm ơn cho Anne hỏi, làm sao để bài viết ra giữa trang được ạ?
Trả lờiXóaEm ẩn sidebar rồi mà bài viết vẫn ở bên trái.
>> https://nhathaomoc-inc.blogspot.com/2019/05/cung-ve-ay-xay-ap-yeu-thuong.html
mình muốn ẩn sidebar bên phải sao bạn nhỉ ? namgia.net
Trả lờiXóamình chèn cái đoạn css này vào phần html mà nó ko đọc được là sao nhỉ ?
Trả lờiXóaMình thử làm theo mà trang của mình không sao mà kéo dài chiều ngang ra được, mong được giúp đỡ: https://www.lapmangfpt.asia/p/internet-fpt.html
Trả lờiXóatrang mình là www.truyentinnhanh.com mình đặt css vào rồi mà nó chỉ ẩn thôi không full được, bạn xem hướng dãn mình nha
Trả lờiXóaNgon
Trả lờiXóaHay quá bạn ạ !
Trả lờiXóa