Header ads

Thiet ke cong trinh dep

Mẹo tạo một bài đăng tràn màn hình cho blogspot

Ngoài các bài đăng thông thường, các bạn cũng có thể tạo các bài đăng đặt biệt kiểu như E-magazine hay landing-page với bộ cục rộng rãi nhằm truyền tải các hình ảnh đẹp hay các ý đồ về thiết kế đồ họa mà các bài đăng thường không thể hiện hết được. Bài này mình sẽ chia sẽ với các bạn cách tạo một bài post tràn màn hình để giúp các bạn làm phong phú thêm nội dung của trang blog của mình nhé

Tạo một bài đăng tràn màn hình cho blogspot
Cách tạo một bài đăng tràn màn hình cho blogspot cực kỳ đơn giản chứ không phức tạp như các bạn nghĩ đâu nhé



1. Bài đăng tràn màn hình là gì?


Khi viết blog, có nhiều khi bạn thấy một bài tâm đắc nào đấy và muốn nó thực sự nổi bật. Bạn muốn xuất hiện căng tràn hết màn hình luôn. Hoặc cũng có thể là một trang giới thiệu chính cho wesite, blog kiểu như landing page mà các bạn không muốn xuất hiện bố cục side bar có thể làm loãng ý đồ muốn truyền tải

Đối với các theme blogger premium mới nhất 2019, các bạn chỉ việc chèn dòng  full-width    trực tiếp vào bài đăng là được. Rất đơn giản do trên html các nhà thiết kế đã tích hợp dòng code vào template rồi. Các bạn chỉ việc sử dụng thôi


Tuy nhiên ban cũng có thể làm theo cách này cực kỳ nhanh chóng trong vòng một nốt nhạc


2. Demo bài đăng tràn màn hình


Demo một bài đăng tràn màn hình kiểu e-magazine: demo bài đăng full-width

Một bài mẫu điền hình cho kiểu bài đăng theo phong cách e-magazine nhưng đã blog hóa cho thấy nếu các bạn có một chút khéo léo và biết kết hợp sẽ tạo nên một bài đăng cực kỳ nổi bật, lôi cuốn. Việc bố cục các phần text, hình ảnh đã được thiết kế độc đáo làm nên một thể thống nhất và hài hòa


Ở một ví dụ khác đơn giản hơn, mình tạo một bài đăng để gửi trực tiếp cho khách hàng xem nên phải chú trọng vào nội dung một cách cao nhất do đó mình quyết định chọn kiểu bài đăng tràn màn hình. Các bạn thấy có tiện lợi không nào, vừa thực hành blog vừa làm công việc chuyên môn cũng ok nhé

3. Cách làm như sau


-Khi viết bài các bạn cứ viết bình thường
-Chuyển sang chế độ viết HTML và chèn code sau vào ở đầu bài


<style > #main-wrapper {width:100%;} #sidebar-wrapper{display:none} </style> 

<!-- phần nội dung bài đăng -->

Các bạn cũng có thể tùy biến code trên như sau



<style > #main-wrapper {width:100%;}  </style>
<!-- phần nội dung bài đăng -->





-Lưu lại và kiểm tra thành qủa nhé
Chúc các bạn làm thành công và tạo được nhiều nội dung hay trên blog của mình nhé


Góc Bình Luận

1 Comments


- Chèn ảnh vào khung nhận xét với cú pháp: [img]Link-ảnh-chèn[/img]
- Tùy chọn các biểu tượng Emoticons khác nhau của yahoo