[Tips] - Tôi đã làm gì với trang lỗi 404 error trong Blogspot

404 error Blogspot

Trong Seo Blogspot thì việc gặp những trang lỗi 404 error cũng khiến blog hay website của bạn tụt hạng ghê gớm. Một phần cũng khiến độc giả của mình cụt hứng khi click vào link mà không có kết quả gì, việc đó khiến cho việc lần sau họ không bao giờ click vào blog của bạn nữa. Chính vì lý do đó hôm nay Đỗ Mạnh Hồng sẽ giúp cho các bạn tạo một trang báo lỗi 404 error cực kỳ chuyên nghiệp.

DEMO

Cách để tạo trang lỗi 404 error như sau :

Bước 1 : Truy cập vào phần quản trị Blogger > Mẫu (templates) > Chỉnh sửa HTML

Bước 2 : Tìm đến thẻ </body> và dán đoạn code sau trên thẻ </body>

<!--404--><b:if cond='data:blog.pageType == &quot;error_page&quot;'><style type='text/css'>a:link{color:#000;text-decoration:none}a:visited{color:#000;text-decoration:none;font:11px normal &#39;Cambria&#39;,sans-serif,Time New Roman}a:hover{color:#333;text-decoration:none}#search-box{position:relative;width:350px;margin:10px auto}#cse-search-box{height:30px;border-radius:2px;background-color:#fff;overflow:hidden;border:1px solid #bbb}#search-text{font-size:12px;color:#ddd;border-width:0;background:transparent}#search-box input[type=&quot;text&quot;]{width:85%;padding:5px 20px 12px 0;color:#666;outline:0}#search-button{position:absolute;top:0;right:0;height:32px;width:20px;margin-top:10px;font-size:14px;color:#fff;text-align:center;line-height:0;border-width:0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijLXtf0XtaqZTzrpb2wlPAx9ynI-RNyT4IPbz5Jv-h_duanCBff6n34gOCFMv3Rzk6ZayaYjOp_MD_HrF3_Vr0jAox_ExsRC08UPyAx4SKpxBwAF0MMDqweRKTrYa-3kDa7WYqZ5-VxwA/s200/search-c.png) no-repeat;cursor:pointer;outline:0}#error-page{font:normal normal 14px Verdana,Geneva,sans-serif;line-height:1.625;background-color:#e9e9e9;position:fixed!important;position:absolute;text-align:center;top:0;right:0;bottom:0;left:0;z-index:99999}#error-inner{margin:11% auto}#error-inner .box-404{font-family:Oswald,&quot;Arial Narrow&quot;,Sans-Serif;font-size:100px;color:#c0392b;margin:0 auto}#error-inner h1{text-decoration:none;font-size:140%;margin:0;padding:0}#error-inner p{line-height:.7em;font-size:15px}</style><div id='error-page'><div id='error-inner'><div class='box-404'>Lỗi 404</div><h1>Trang bạn tìm hiện không tồn tại</h1><p>Bài viết đã bị xóa hoặc không tìm thấy</p><p>vui lòng nhấn vào đây <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p><p>hoặc gõ từ khóa để tìm kiếm </p><div id='search-box'><form action='/p/tim-kiem_12.html' id='cse-search-box' method='get'><input id='search-text' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='gõ từ khóa ...'/><button id='search-button' type='submit'/></form></div></div></div></b:if>  <!--/404-->

Bước 3 : Lưu mẫu lại và thử xem với blogspot của mình nhé. Chúc các bạn thành công.

Bài Viết Cùng Chủ Đề

• [Tips] - Kỹ thuật phân trang cho bài viếtKỹ thuật phân trang là một kỹ thuật giúp những bài viết quá dài được chia thành 1, 2, 3 trang tùy ý để cho người đọc đỡ ...
• [Tips] - Hướng dẫn chi tiết cách tích hợp Responsive cho blogspotChào các bạn nói đến cách tích hợp Responsive vào blogspot thì khi bạn search google tìm được rất nhiều kết quả, nhưng ...
• [Tips] - Hướng dẫn tạo slider ảnh chuyên nghiệpSlider images là một trong những tiện ích cần thiết cho blogspot, mặc dù là nó không có cũng không sao, nhưng slider ản ...
• [Tips] - Hướng dẫn tối ưu blogspot chuẩn PageSpeed InsightsPageSpeed Insights là công cụ check tối ưu cho blogspot và website, với công cụ này khi bạn check với website mà tầm 80 ...
• [Tips] - Hướng dẫn tích hợp giao diện mobi cho blogspotChào các bạn ở bài trước mình đã hướng dẫn các bạn tích hợp giao diện Responsive cho blogspot, nay mình sẽ hướng d ...