Share Code trang báo lỗi 404 Đẹp cho Blogger Blogspot

Vì 1 lý do nào đó bài viết mà bạn từng đăng lên Blogger - Blogspot bị xóa mà vẫn có những lượng tìm kiếm nhất định với bài viết đó. Cách duy nhất là tạo 1 trang báo lỗi 404. Hôm nay Code SEO xin chia sẻ với các bạn cách làm trang báo lỗi 404 với giao diện phẳng - đơn giản - đẹp mà CodeSEO.net đang sử dụng... Bộ code này mình sử dụng css đơn giản và script đếm thời gian chuyển hướng trang nhìn khá đẹp

Đầu tiên các bạn có thể xem demo tại http://codeseo.net/404

» Bắt đầu code và cách dùng

1. Đăng nhập vào tài khoản Blogger

2. Vào phần mẫu  (Tempalte)

3. Chọn chỉnh sửa HTML (Edit HTML)

4. Bạn tìm đến trước thẻ </body> và dán vào code sau

Bộ này gồm css và javascript

<!--Error Page Not Found by codeseo.net-->
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style type='text/css'>
#error-page{background-color:#e9e9e9;position:fixed!important;position:absolute;text-align:center;top:0;right:0;bottom:0;left:0;z-index:99999}#error-404{margin:11% auto}#error-404 .box-404{width:200px;height:200px;background:#21afa4;color:#fff;font-size:80px;line-height:200px;border-radius:10px;margin:0 auto 50px;position:relative}#error-404 .box-404::after{content:&quot;width:0;height:0;bottom:-8px;border-color:#21afa4 transparent transparent;border-style:solid;border-width:9px 9px 0;position:absolute;left:47%}#error-404 h1{text-transform:uppercase}#error-404 p{line-height:1.7em;font-size:15px;font-family:arial}
</style>
<div id='error-page'>
<div id='error-404'>
<div class='box-404'>404</div>
<h1>Trang bạn tìm kiếm không tồn tại</h1>
<p>Có thể URL bị hỏng hoặc đã bị ADMIN xóa bỏ</p>

Bạn sẽ trở về trang chủ <b>CodeSEO.net</b> sau <span id='time' style='color:red'>3</span> giây nữa<br/> 
<script type='text/javascript'> var jgt = 3; document.getElementById(&#39;time&#39;).innerHTML = jgt; function stime(){document.getElementById(&#39;time&#39;).innerHTML = jgt; jgt = jgt - 1; if(jgt == 0){clearInterval(timing); location = &#39;http://www.codeseo.net&#39;;} } var timing = setInterval(&quot;stime();&quot;,1000); </script>

  </div></div>
</b:if>
<!--/Error Page Not Found by codeseo.net-->

Các bạn thay các giá trị in đậm trong code theo ý muốn

3 là thời gian chuyển hướng trang

http://www.codeseo.net là địa chỉ mà bạn muốn chuyển hướng đến

Cảm ơn các bạn đã quan tâm có gì không hiểu hoặc không làm được các bạn có thể comment bên dưới

Socializer Widget by Nguyen D. Khanh

SOCIALIZE IT →

Tweet

FOLLOW US →

SHARE IT →

Các bạn có thể tham khảo thêm nhiều kiến thức từ các bài viết mà mình đã SEO bằng các Từ khóa bên dưới bài đăng nầy để tìm hiểu thêm về các khái niệm và ứng dụng có liên quan nhé..