Author : UnknownTidak ada komentar
 |
| dari blog smz |
hai sobat blogger ketemu lagi sama saya saipul muiz( muizcyan-xp) yang sebelumnya saya telah share cara membuat animasi di header blog dan sekarang saya mau share tentang bagaimana cara membuat custom page not found di blogger..
custom page not found sering disebut halaman yang tidak ditemukan atau pada saat kita mencari artikel di blog dengan kata kunci yang salah maka custom page not found tersebut akan muncull
lahh langsung saja ikuti tutorialnya bagaimana cara membuat custom page not found yang menarik..
- pergi ke template >> edit HTML
- temukan kode </head> agar mudah gunakan ctrl+f dan simpan kode dibawah ini diatas kode </head>
<b:if cond='data:blog.pageType == "error_page"'>
<style type="text/css">.status-msg-wrap{font-size:100%;margin:none;position:static;width:100%}.status-msg-border{display:none}.status-msg-body{padding:none;position:static;text-align:inherit;width:100%;z-index:auto}.status-msg-wrap a{padding:none;text-decoration:inherit}</style>
- save template
- Lalu pergi ke setelan>> preferensi penelusuran>>pesan khusus halaman tidak ditemukan(custom page not found)
- salin kode ini ke dalam kotak teks nya yang tersedia!!
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="/">Click here</a> to go to Homepage <br> Have a nice Day...</h3><img src="http://2.bp.blogspot.com/-ldrwg_L3hPw/T29ZifhYlUI/AAAAAAAAAMo/wdhPPVcNEDM/s1600/404+error+page+4.jpg"/>
- jika sudah simpan>>>
dan jika berhasil akan terlihat seperti gambar yang diatas lihat demonya
ini saya ngikuti tutornya blog smz
dan ada juga buatan saya yang dilengkapi dengan kotak searc h blogger
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h2 style="font-size: 35px;margin: 0;text-align: center;">MuizCyan Member I'm Sorry</h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="http://www.muizcyan.co.vu/">Click here</a> to go to Homepage <br> Have a nice Day... wayahna bongan maneh neangan teu pararuguh
wayahna sakali deuii nya bisi kahapus artikel ieu teh!!</h3>
<h3 style="font-size:17px;"><li>Silahkan gunakan kotak pencarian untuk mencari artikel lainnya</li></h3>
<center>
<form _lpchecked="1" action="/search" class="search-form" id="search_mini_form" method="get">
<input id="searchinput" name="q" onblur="if (this.value == '') {this.value = 'Type Here & Hit Enter';}" onfocus="if (this.value == 'Search the site') {this.value = '';}" type="text" value="Type Here & Hit Enter" />
<input id="searchbutton" style="vertical-align: top;" type="submit" value="Search!" />
</form>
</center>
<img src="http://2.bp.blogspot.com/-ldrwg_L3hPw/T29ZifhYlUI/AAAAAAAAAMo/wdhPPVcNEDM/s1600/404+error+page+4.jpg"/>
<style>
#searchinput {
background: #FFF url(http://1.bp.blogspot.com/-DqsSIdDHoXE/UC7emvfWcII/AAAAAAAAAwo/X7HUuvC4oBs/s000/search.png) no-repeat 7px 8px;
background-color: #FFF;
border: 1px solid #ddd;
color: #A0A0A0;
display: inline-block;
font-family:arial;
font-size: 12px;
font-weight:bold;
height: 24px;
width:300px;
margin: 0;
margin-top: 5px;
padding: 5px 15px 5px 28px;
vertical-align: top;
}
#searchinput:hover{
border: 1px solid #bebebe;
box-shadow: 0 1px 2px rgba(5, 95, 255, .1);
padding: 5px 15px 5px 28px;
}
#searchbutton {
background:#444;
color:#fff;
height:35px;
border-radius:5px 5px 5px 5px;
box-shadow:1px 2px 1px 1px #ABABAB;
border:1px solid #fff;
margin-top:3px;
padding:8px;
}
#searchbutton:hover{background:#555;}
</style>
tag
cara membuat custom page not found jadi lebih keren| trik mempercantik custom page not found di blogger| cara membuat gambar custom page not found| trik membuat redirect url custom page not found| trik membuat gambar ketika keyword yang kita cari di blog gagal atau not found 404
Posted On : Sabtu, 17 Mei 2014Time : 04.48