Thông thường, để giải quyết lỗi này, các blogger hay tạo trang 404 ( 404 Eror Page ) để thông báo cho người đọc biết rằng liên kết này đã hỏng và điều hướng người dùng đến trang chủ hoặc một liên kết khác.
Hướng dẫn cách tạo trang 404 cho Blogger
Để tạo trang 404 cho Blogger, chúng ta sẽ sử dụng thẻ điều kiện <b:if> , một ít HTML và CSS. Các bạn thêm đoạn code sau vào dưới thẻ <body><b:if cond='data:blog.pageType == "error_page"'>
.........
</b:if>
trong đó ..... là nội dung bạn muốn hiển thị trên trang 404, có thể là một đoạn text, hoặc một đoạn HTML và CSS
Nếu các bạn không rõ lắm về HTML vs CSS thì có thể sử dụng luôn mẫu mình giới thiệu sau đây
Bước 1 : Chèn đoạn code phía trên thẻ </head>
Mình sẽ sử dụng font Open Sans, nếu như các bạn thích sử dụng font này thì sử dụng font khác nhé.
Bước 2 : Chèn đoạn code sau dưới thẻ <body>
trong đó abcxyz.blogspot.com là đường dẫn blog của bnaj
Bước 3 : Chèn đoạn code sau phía trên thẻ ]]></b:skin>
Bước 4 : Save template lại và test
Chúc các bạn thành công
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700,600&subset=latin,vietnamese' rel='stylesheet' type='text/css'/>
Mình sẽ sử dụng font Open Sans, nếu như các bạn thích sử dụng font này thì sử dụng font khác nhé.
Bước 2 : Chèn đoạn code sau dưới thẻ <body>
<b:if cond='data:blog.pageType == "error_page"'>
<div id='error404'>
<div id='error-text'>
<span>404</span>
<p>Sorry, the page you are looking for could not be found</P>
<p><a href="http://www.abcxyz.blogspot.com">HOME PAGE</a></p>
</div>
</div>
</b:if>
trong đó abcxyz.blogspot.com là đường dẫn blog của bnaj
Bước 3 : Chèn đoạn code sau phía trên thẻ ]]></b:skin>
#error404{font-family:'Open Sans';text-align:center;font-weight:700;font-size:20px;position:fixed;width:100%;height:100%;line-height:1.5em;z-index:9999;background:#039BE6}
#error-text{top:30%;position:relative;font-size:20px;color:#eee}
#error-text span{position:relative;color:#fff;font-size:200px;padding:0 20px;border-radius:5px;font-weight:700;letter-spacing:3px;transition:all .5s}
#error404 p{margin-top:50px;color:#6CC5F1}
#error-text a{padding:15px 20px;border-radius:20px;border:1px solid #fff;color:#fff;text-decoration:none;font-weight:400}
Bước 4 : Save template lại và test
Chúc các bạn thành công
Cách làm này rất hay ạ, cảm ơn bạn chia sẻ
Trả lờiXóacảm ơn anh/chị đã quan tâm
Xóa