Cách Ẩn Thanh Thông Báo Blogger Không Bị Giật Trang
Hướng Dẫn Ẩn Thanh Thông Báo Nhãn Blogger Không Bị Giật Trang
Khi sử dụng Blogger để xây dựng website, nhiều người gặp tình trạng xuất hiện một khung thông báo phía trên danh sách bài viết mỗi khi truy cập vào một danh mục.
Ví dụ:
“Hiển thị các bài đăng có nhãn Trading. Hiển thị tất cả bài đăng.”
Đây là thông báo mặc định của Blogger, giúp người đọc biết họ đang xem các bài viết thuộc nhãn nào.
Tuy nhiên, đối với những website được thiết kế giao diện riêng, thanh thông báo này đôi khi không cần thiết, gây mất cân đối bố cục và ảnh hưởng đến trải nghiệm người dùng.
Trong bài viết này, Viện Đào Tạo Đầu Tư Việt Nam sẽ hướng dẫn bạn cách ẩn hoặc loại bỏ thanh thông báo Blogger, đồng thời giải thích nguyên nhân khiến trang web xuất hiện khoảng trống rồi nhảy lên khi tải.
1. Thanh thông báo nhãn Blogger là gì?
Khi truy cập một đường dẫn danh mục như:
https://tenmiencuaban.com/search/label/Trading
Blogger có thể tự động hiển thị thông báo:
“Hiển thị các bài đăng có nhãn Trading. Hiển thị tất cả bài đăng.”
Thông báo này thường xuất hiện phía trên danh sách bài viết.
Mặc dù không phải lỗi hệ thống, thanh thông báo có thể gây ra một số bất tiện:
Chiếm diện tích hiển thị trên website.
Làm bố cục trang danh mục kém gọn gàng.
Không phù hợp với một số giao diện tùy chỉnh.
Có thể gây thay đổi bố cục nếu mã CSS hoặc JavaScript xử lý không đúng thời điểm.
2. Cách ẩn thanh thông báo Blogger bằng CSS
Đây là phương pháp đơn giản, phù hợp với người mới sử dụng Blogger.
Bước 1: Đăng nhập Blogger.
Bước 2: Truy cập Chủ đề → Chỉnh sửa HTML.
Bước 3: Nhấn Ctrl + F và tìm:
]]></b:skin>
Bước 4: Chèn đoạn CSS sau ngay phía trên dòng vừa tìm:
/* An thong bao nhan Blogger */
.status-msg-wrap,
.status-msg-border,
.status-msg-body,
.status-msg-bg,
.status-msg-hidden {
display: none !important;
}Bước 5: Lưu giao diện và tải lại website.
Đoạn CSS này giúp ẩn những phần tử thông báo sử dụng các lớp mặc định của Blogger.
Lưu ý: Phương pháp CSS chỉ ẩn phần tử khỏi giao diện, không loại bỏ mã tạo thông báo. Nếu website vẫn xuất hiện hiện tượng giật bố cục, bạn nên kiểm tra cấu trúc XML.
3. Cách loại bỏ thông báo trực tiếp trong XML Blogger
Đây là phương pháp phù hợp hơn khi muốn Blogger không xuất thông báo tại vị trí đó.
Trước khi chỉnh sửa, hãy sao lưu giao diện để có thể khôi phục nếu xảy ra lỗi.
Bước 1: Truy cập Blogger → Chủ đề → Chỉnh sửa HTML.
Bước 2: Tìm đoạn mã:
<b:include data='top' name='status-message'/>Trong một số giao diện, lời gọi này có thể nằm trong phần hiển thị danh sách bài viết.
Bước 3: Nếu xác định đúng đây là lời gọi thông báo nhãn, bạn có thể loại bỏ dòng mã này.
Bước 4: Kiểm tra xem giao diện có thêm lời gọi tương tự dành cho thiết bị di động hay không.
Bước 5: Lưu XML và kiểm tra lại các trang danh mục.
Quan trọng: Không nên xóa toàn bộ khối b:includable hoặc các thành phần khác khi chưa hiểu chức năng của chúng. Một số giao diện Blogger sử dụng cấu trúc tùy chỉnh nên vị trí và cách gọi thông báo có thể khác nhau.
4. Vì sao ẩn thông báo rồi website vẫn bị giật?
Nhiều người gặp hiện tượng khi tải trang:
Website xuất hiện một khoảng trống.
Danh sách bài viết bị đẩy xuống.
Sau một khoảng thời gian ngắn, nội dung nhảy lên vị trí bình thường.
Hiện tượng này được gọi là thay đổi bố cục trong quá trình tải trang, hay Layout Shift.
Một số nguyên nhân thường gặp bao gồm:
CSS hoặc JavaScript thực thi muộn: Thành phần đã được hiển thị trước khi mã ẩn được áp dụng.
Hiệu ứng chuyển động toàn trang: Một số giao diện sử dụng:
* {
transition: all .3s ease;
}Đoạn mã này áp dụng hiệu ứng chuyển tiếp cho các thuộc tính có thể chuyển động của toàn bộ phần tử. Khi chiều cao hoặc khoảng cách thay đổi, người xem có thể thấy quá trình dịch chuyển rõ hơn.
Widget và hình ảnh tải chậm: Các tiện ích, hình ảnh hoặc nội dung nhúng không được dự trữ kích thước có thể làm thay đổi chiều cao trang sau khi tải.
Vì vậy, loại bỏ thanh thông báo không đồng nghĩa với việc mọi hiện tượng giật trang đều biến mất.
5. Cách hạn chế giật bố cục khi tải trang
Để website Blogger hoạt động ổn định hơn, bạn nên thực hiện những bước sau:
Loại bỏ lời gọi thông báo ngay trong XML nếu không cần sử dụng.
Tránh dùng JavaScript tải muộn chỉ để xóa phần tử thông báo.
Hạn chế áp dụng
transition: allcho toàn bộ website.Thiết lập kích thước phù hợp cho hình ảnh và các tiện ích nhúng.
Kiểm tra các thành phần tải bất đồng bộ như quảng cáo, widget bài viết và nội dung bên thứ ba.
Sử dụng công cụ PageSpeed Insights để kiểm tra chỉ số Cumulative Layout Shift (CLS).
Bạn có thể kiểm tra tại:
Chỉ số CLS càng thấp thì bố cục trang càng ổn định. Theo ngưỡng Core Web Vitals, CLS từ 0,1 trở xuống được đánh giá là tốt.
6. Nên dùng CSS hay chỉnh XML Blogger?
| Tiêu chí | Ẩn bằng CSS | Loại bỏ trong XML |
|---|---|---|
| Dễ thực hiện | Dễ | Cần hiểu cấu trúc |
| Ẩn thông báo | Có | Có |
| Loại bỏ lời gọi tạo thông báo | Không | Có |
| Phù hợp với người mới | Có | Cần thận trọng |
| Khắc phục mọi nguyên nhân giật trang | Không | Không |
Nếu chỉ muốn ẩn nhanh thanh thông báo, CSS có thể đáp ứng.
Nếu muốn xử lý trực tiếp phần tạo thông báo, chỉnh XML là lựa chọn đáng cân nhắc.
7. Kết luận
Thanh thông báo nhãn Blogger là một tính năng mặc định, nhưng không phải website nào cũng cần hiển thị.
Việc ẩn hoặc loại bỏ thông báo giúp trang danh mục gọn gàng hơn, đặc biệt đối với những website có giao diện được thiết kế riêng.
Tuy nhiên, nếu sau khi ẩn thông báo mà website vẫn xuất hiện khoảng trống hoặc bị giật khi tải, bạn cần kiểm tra thêm CSS, JavaScript, hình ảnh và các tiện ích liên quan.
Lời khuyên: Luôn sao lưu giao diện Blogger trước khi chỉnh sửa XML và kiểm tra trên cả máy tính lẫn điện thoại.
Viện Đào Tạo Đầu Tư Việt Nam
Website: https://viendaotaodautu.click
Chia sẻ kiến thức công nghệ, xây dựng website và kiến thức đầu tư dành cho cộng đồng.
Bài viết mang tính hướng dẫn kỹ thuật. Các đoạn mã cần được điều chỉnh phù hợp với từng giao diện Blogger.
VĐTĐTVN
Không có nhận xét nào: