404 Error Page Not Found di Blog
Contoh Gambar Yang Mungkin Anda Maksud Seperti Ini :
Contoh Gambar Yang Mungkin Anda Maksud Seperti Ini :
Demo
Langkah-langkah membuat halaman Error 404 Not Found
- Masuk ke www.blogger.com atau klik Disini
- Pilih Menu Template Lalu Kilk Edit HTML
- Kemudian Copy kode berikut dan Pastekan tepat di bawah kode </head>
<b:if cond='data:blog.pageType == "index"'> <title><data:blog.pageTitle/></title> <b:else/> <b:if cond='data:blog.pageType == "error_page"'> <title>404: Page Not Found ~ <data:blog.title/></title> <b:else/> <title><data:blog.pageName/> ~ <data:blog.title/></title> </b:if> </b:if>
- Lalu masukan kode CSS berikut diatas kode ]]></b:skin> atau </style>
CSS
/*Desain Halaman 404 Error Not Found ----------------------------------------------- */ #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-inner { margin:11% auto; } #error-inner .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-inner .box-404::after { content:" "; width:0; height:0; bottom:-8px; border-color:#21afa4 transparent transparent; border-style:solid; border-width:9px 9px 0; position:absolute; left:47%; } #error-inner h1 { text-transform:uppercase; } #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="text"]{width:85%;padding:5px 20px 12px 0;color:#666;outline:none} #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/AVvXsEjsTh9bJmpSegXyp_SXBPvfoyUhRdwItHY2wuHzHnT1wl70EvqCClGEy0cw7_qZozZiAQyUekcm7h2otWYMDPcY1ZnkSVLytEVdnFz9nm8m3BEW3U-I3rDcnDz-RR6_MGKYST41e4mEoPA/s200/search-c.png) no-repeat;cursor:pointer} #error-inner p { line-height:0.7em; font-size:15px; }
- Masukan kode berikut tepat di atas kode </body>
<b:if cond='data:blog.pageType == "error_page"'> <div id='error-page'> <div id='error-inner'> <div class='box-404'>404</div> <h1>Halaman tidak ditemukan</h1> <p>Kemungkinan halaman telah dihapus, atau Anda salah menulis URL</p> <p>Kembali ke <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p> <div id='search-box'> <form action='/search' id='cse-search-box' method='get'> <input id='search-text' name='q' onblur='if(this.value=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=''' type='text' value='Cari di sini ...'/> <button id='search-button' type='submit'/> </form> </div> </div> </div> </b:if>
- Terakir Kilk Simpan atau Save Template
Sekian post dari saya.
SEMOGA BERMANFAAT
Jika anad ingin Copy + Paste Cantumkan Link Sumber nya,
Tolong hargai saya, jika kalian ingin di hargai maka hargailah orang lain...
SEMOGA BERMANFAAT
Jika anad ingin Copy + Paste Cantumkan Link Sumber nya,
Tolong hargai saya, jika kalian ingin di hargai maka hargailah orang lain...
Diposting oleh
Yahya Suteja
di
Pertamaxx
ReplyDeleteMantap tuh gan, izin Praktek gan
Hahaha,
DeleteIya silahkan gan :)
Ijin Praktek ya gan....
ReplyDeleteSedikit Saran... Tolong di Perbaiki Judul artikel ini.. :) ada Kesalahan di tulisan Note seharusnya NOT ... Thanks :)
silahkan gan :D
DeleteHahaha, ane kagak liat gan thanks yah sarannya (y)
mantap nh gan., pas buat untuk link yang sudah koid :D
ReplyDeleteiya gan.., iya tuh, thanks yah udah mampir :)
DeleteWah keren gan izin sedott ilmunya! :D
ReplyDeletehaha,..iya gan silahkan :)
Deletesilahkan gan :)
ReplyDeleteIzin Coba gan...
ReplyDeleteLumayan Kalau Ada Perbaikan Tempel Aja HTML Itu... :)
Thanks Gan
Silahkan Gan :)
DeleteHaha,...Iya Gan :)
Iya Sama-Sama Gan :)
sudah ane terapkan gan hehehe
ReplyDeleteok ok gan thanks yah :)
Deletetengkyu gan :D sangat bermanfaat
ReplyDelete