Blogger thật sự không năng động và không thể cạnh tranh với Wordpress nhưng ở đây mình sẽ hướng dẫn bạn tạo một trang tìm kiếm thay thế cho trang lỗi 404 như của Wordpress.

Khi người dùng chọn bất cứ một liên kết nào sai hoặc không tồn tại, họ sẽ được chuyển hướng đến trang này, họ sẽ có thêm một lựa chọn là tìm kiếm thông tin về bài đăng khác thay vì phải quay về trang chủ.

Hơn nữa, đây là một tùy chọn đặt biệt nó cũng tương đối đầy đủ với chức năng tìm kiếm cơ bản



Hướng dẫn
Bước 1: Vào trang Tổng Quan -> Cài đặt -> Tùy chọn tìm kiếm -> Không tìm thấy trang tùy chỉnh

Bước 2: Coppy đoạn code bên sau vào ô bên dưới:




<style>
#search-button-links1 {
    position: relative;
    top: 0;
    right: 0;
    height: 60px;
    width: 580px;
    font-size: 18px;
    color: #000;
    text-align: center;
    text-decoration:none;
    line-height: 42px;
    border-width: 0;
    background-color: #5caddf;
margin:5px;
    cursor: pointer;
}
#search-box1 {
    position: relative;
    width: 100%;
    margin: 0;
}
#search-form1 {
    height: 40px;
    border: 1px solid #999;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    overflow: hidden;
}
#search-text1 {
    font-size: 14px;
    color: #ddd;
    border-width: 0;
    background: transparent;
}
#search-box input[type="text"] {
    width: 90%;
    padding: 11px 0 12px 1em;
    color: #333;
    outline: none;
}
#search-button1 {
    position: absolute;
    top: 0;
    right: 0;
    height: 42px;
    width: 80px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    line-height: 42px;
    border-width: 0;
    background-color: #4d90fe;
    -webkit-border-radius: 0px 5px 5px 0px;
    -moz-border-radius: 0px 5px 5px 0px;
    border-radius: 0px 5px 5px 0px;
    cursor: pointer;
}
</style>
<div id='search-box1'>
  <form action='/search' id='search-form1' method='get' target='_top'>
    <input id='search-tex1t' name='q' placeholder='Search ThatsBlogging' type='text'/>
    <button id='search-button1' type='submit'><span>Search</span></button>
  </form>
</div>
<p style="color:#e33633; font-family:verdana, sans serif; font-size:16px; padding:24px; text-decoration:none">This Page has been removed for safety purposes | Visit <a href="http://thatsblogging.blogspot.com">ThatsBlogging</a>


Bạn có thể thay thế những dòng màu đỏ bằng nội dung mình muốn. Đây chỉ là một đoạn CSS nhỏ và 2 thẻ <div> giúp bạn tạo ra một hộp tìm kiếm đơn giản.

Hy vọng bạn sẽ thích nó. Nếu có vấn đề gì vui lòng để lại lời nhắn nhé/
Chúc các bạn thành công.

Đăng nhận xét

 
Top