Thủ thuật blogspot - Dautoblog

Tạo Trang Báo Lỗi 404 Cho Blogspot

Tạo Trang Báo Lỗi 404 Cho Blogspot
Trong quá trình bạn viết Blog thì chắc chắn sẽ có các link bị hỏng và một số bài viết bị xóa vì lý do nào đó. Và để thân thiện hơn với người dùng khi truy cập đến một trang không tồn tại trong Blog của bạn, gần đây google đã hỗ trợ tính năng báo lỗi và chuyển hướng rất hữu ích. Nhưng thay vì bạn phải sử dụng trang báo lỗi với dòng chữ và con số 404 khô khan thì ta hoàn toàn có thể tạo ra trang thông báo lỗi 404 Page Not Found theo ý của mình để thân thiện hơn với độc giả và đồng thời cũng tốt cho việc làm seo của bạn.
Thủ thuật tạo trang báo lỗi 404 cho blogspot thì xưa như trái đất nhưng các bài hướng dẫn chỉ có tính chất gợi mở,và thủ thuật tạo trang toàn màn hình có thể còn xa lạ với các bạn mới tham gia cộng đồng blogger.
Các bạn để ý trong code áp dụng thủ thuật phần nằm trong 2 thẻ
<style>Nội dung</style>
chính là lệnh CSS để tạo trang toàn màn hình.Lệnh này áp dụng có khác nhau giữa template free(tự thiết kế) và simple(do blogger cung cấp) vì template free thường sử dụng thẻ (div id) cho phần body còn simple lại sử dụng thẻ (div class)và cách viết css cũng khác nhau.
Tạo Trang Báo Lỗi 404 Cho Blogspot
Xem thử:

DEMO

Hoặc bạn có thể làm sai lệch URL bài viết này trên thanh công cụ trình duyệt:
Để thiết kế trang báo lỗi 404 thì Template của bạn phải có hàm <b:include data='top' name='status-message'/> và hàm này phải được gọi ra. Hiện nay đa số các Template free của các bạn không có phần này, chỉ những mẫu blog Simple của blogspot mới còn. Bạn vào Template tìm thẻ <b:includable id='main' var='top'> và dán đoạn code dưới đây vào sau nó:

<b:if cond='data:numPosts == 0'>

<data:navMessage/>

</b:if>


Lưu mẫu lại

Với blog nào đã có đoạn code như trên rồi thì bỏ qua bước này. Tiếp theo bạn đăng nhập nhập vào vào blog và nhấn vào Cài đặt (Setting) => Tùy chọn tìm kiếm => ở mục Lỗi và chuyển hướng => bấm vào chỉnh sửa (Trong phần đóng khung màu đen như hình dưới nhé). Sau khi bấm vào chỉnh sửa thì sẽ hiện ra một cái khung và bạn dán đoạn code dưới đây vào:



<div style='background:#ddd;border-radius:5px;border: 1px solid #E8E8E8; padding:20px;'>

<p style='line-height: 26px'><strong> <font color='#ff0000' size='5'> Rất tiếc! </font> <br/> <font color='#666666'>

Hình như bạn có nhấp vào một liên kết bị hỏng hoặc một trang không tồn tại. <br/>

Vui lòng thực hiện một trong các nội dung sau: </font></strong></p>

<ol style='line-height: 22px'>

<li><a href='javascript:history.go(-1)'>&#171; Go Back </a> </li>

<li>Về Trang chủ <a href='http://kartriderdautocrazy01.blogspot.com'> Bấm vào đây</a> <br/></li>

<li>Sử dụng hộp tìm kiếm thông minh với 2 lựa chọn</li>

</ol><center>

<form method=get action="http://www.google.com/search" class="googlesearch">

<input type="hidden" name="ie" value="UTF-8"/>

<input type="hidden" name="oe" value="UTF-8"/>

<table align="center">

<td class="bodyText"><input type="hidden" name="domains" value="kartriderdautocrazy01.blogspot.com"/>

<input type="radio" name="sitesearch" value=""/>Google.com<input type="radio" name="sitesearch" value="kartriderdautocrazy01.blogspot.com" checked />DautoCrazy.Blog<br/>

<input type="text" name="q" size="22" maxlength="255" value=""/>

<input class="button" type="submit" name="btng" value="Tìm kiếm"/></td></table></form></center>

<p align='center'><font size='7'>Cảm ơn bạn đã ghé thăm Blog!</font></p>

<p align='center'><img height="420" src="http://2.bp.blogspot.com/-J4idBkRpGTw/UwPigeuK9BI/AAAAAAAAlXY/sXAet4XvQeE/s1600/error-404-page.jpg" title="Rất tiếc về điều này!" width="600" /></p>

</div>

<style>

#sidebar-wrapper, #midsidebar-wrapper,#midle-wrapper,#footer-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer, #rsidebar-wrapper,#header-wrapper { display:none !important;}

#main-wrapper { width:98%!important;} .post { width:98%!important;}

</style>


Nhớ lưu cài đặt nhé.

Bạn thay các phần màu vàng cho phù hợp với blog của mình

Riêng phần màu xanh là để ẩn đi sidebar,header và footer nếu ở main có đặt tiên ích thì xác định id của tiên ích đó và thêm vào trước { display:none !important;} theo mẫu ,#HTML(số id)

Thay đổi màu nền,màu chữ cho phù hợp với màu nền blog.

Lưu ý:

Đối với các blog sử dụng mẫu mặc định do blogger cung cấp(mẫu simple) sử dụng code sau:

DEMO

<div style='background:#ddd;border-radius:5px;border: 1px solid #E8E8E8; padding:20px;'>

<p style='line-height: 26px'><strong> <font color='#ff0000' size='5'> Rất tiếc! </font> <br/> <font color='#666666'>

Hình như bạn có nhấp vào một liên kết bị hỏng hoặc một trang không tồn tại. <br/>

Vui lòng thực hiện một trong các nội dung sau: </font></strong></p>

<ol style='line-height: 22px'>

<li><a href='javascript:history.go(-1)'>&#171; Go Back </a> </li>

<li>Về Trang chủ <a href='http://kartriderdautocrazy01.blogspot.com'> Bấm vào đây</a> <br/></li>

<li>Sử dụng hộp tìm kiếm thông minh với 2 lựa chọn</li>

</ol><center>

<form method=get action="http://www.google.com/search" class="googlesearch">

<input type="hidden" name="ie" value="UTF-8"/>

<input type="hidden" name="oe" value="UTF-8"/>

<table align="center">

<td class="bodyText"><input type="hidden" name="domains" value="kartriderdautocrazy01.blogspot.com"/>

<input type="radio" name="sitesearch" value=""/>Google.com<input type="radio" name="sitesearch" value="kartriderdautocrazy01.blogspot.com" checked />DautoCrazy.Blog<br/>

<input type="text" name="q" size="22" maxlength="255" value=""/>

<input class="button" type="submit" name="btng" value="Tìm kiếm"/></td></table></form></center>

<p align='center'><font size='7'>Cảm ơn bạn đã ghé thăm Blog!</font></p>

<p align='center'><img height="420" src="http://2.bp.blogspot.com/-J4idBkRpGTw/UwPigeuK9BI/AAAAAAAAlXY/sXAet4XvQeE/s1600/error-404-page.jpg" title="Rất tiếc về điều này!" width="600" /></p>

</div>

<style>

.content .sidebar, #header, #HTML1, #HTML2, #HTML3, #HTML4,#HTML5, #HTML6, #HTML7, HTML8, #HTML9, #HTML10, .footer-outer, .gapad2, .blog-pager,.tabs-inner,.comments { display:none !important;}

.post-outer { width:940px !important;}

</style>


.content .sidebar,#header và .footer-outer, dùng để ẩn đi toàn bộ cạnh bên blog,phần header và đáy còn #HTML từ 1 đến 10 dùng để ẩn tiện ích có thể có trên phần main.Nếu ai có hơn 10 tiện ích trên main ^^ thì cứ thêm vào theo mẫu trên.

Chúc thành công!

Nguồn sưu tầm.
Comments blogger

Không có nhận xét nào :