Cara membuat pesan khusus untuk laman tidak ditemukan Kotak Pencarian

بِسْـــــــــمِ ﷲِالرَّحْمَنِ الرَّحِيم
Cara membuat pesan khusus untuk laman tidak ditemukan Kotak Pencarian
. Pada posting terdahulu kita juga telah membahas tentang Cara pesan khusus untuk laman tidak ditemukan Kotak Pencarian berikut ini link posting tersebut : https://caraeditblogger.blogspot.co.id/2014/08/membuat-pesan-khusus-untuk-laman-tidak.html
Pada posting terdahulu https://caraeditblogger.blogspot.co.id/ telah membuat posting tentang :"pesan khusus untuk laman tidak ditemukan", pada posting tersebut pesan khusus untuk laman tidak ditemukan masih sangat sederhana yaitu seperti gambar dibawah ini


Namun pada posting kali ini "Cara pesan khusus untuk laman tidak ditemukan Kotak Pencarian" pengunjung yang nyasar akan di alihkan ke sebuah halaman berikut pesan dan disediakan sebuah kotak pencarian / kolom pencarian seperti gambar dibawah ini:

Berikut cara membuatnya:

1. Login ke blogger.com
2. Setelan › Preferensi penelusuran
3. Pesan Khusus untuk Laman Tidak Ditemukan ?
4. Masukkan kode berikut :

<div class="pagefound">
<div class="links">
<h2>Maaf. Halaman ini tidak ditemukan, mungkin url telah berubah atau telah dihapus</h2>
<h3>Silahkan cari melalui Kotak Pencarian "Cara Edit Blog" dibawah ini</h3>
<style>


#search-box {
position: relative;
width: 100%;
margin: 0;
}

#search-form
{
height: 40px;
border: 1px solid #999;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #fff;
overflow: hidden;
}
#search-text
{
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-button {
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: #C0C0C0;
-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-box'>
<form action='/search' id='search-form' method='get' target='_top'>
<input id='search-text' name='q' placeholder='Pencarian Cara Edit Blog' type='text'/>
<button id='search-button' type='submit'><span>Search</span></button>
</form>
</div>
</div>
</div>

Semoga posting dari Cara Edit Blog ini bermanfaat, jangan lupa berkunjung kembali ke blog :Cara Edit Blog.