Create 404 Eror Page In Blogger With Simple Flash Game Membuat Halaman Eror 404

Cara membuat halaman error 404 dengan game flash-1:

1. Lakukan login ke Blogger.
2. Setelah halaman dasboard terbuka, bagi yang masih menggunakan "Old Blogger Interface silahkan upgrade terlebih dahulu ke "New Blogger Interface".
   Blogger is getting a new look in April. Upgrade Now.
3. Settings/Setelan.
4. Search Preference/Preferensi Penelusuran.
5. Errors and redirections » Custom Page Not Found ? atau : Kesalahan dan pengalihan » Pesan Ubahsuaian untuk Laman Tidak Ditemukan ? Silahkan klik "Edit".
6. Simpan xHTML-1 dalam box yang tersedia.

   xHTML-1 :

   <center>
   Cihui... Rupanya anda tersesat! Kecian,dech... Hu ... makanya besok lagi klo mo bepergian bawa peta,dong!  Nich...,maen game  duluan n n'tar klo dah cape klik link-nya. Teman2 udah nundu, mbul!!<br/><a href="http://gubhugreyot.blogspot.com" title="Tuh ... liat ... tuh ... jalannya. Hih... ,dasar!">gubhugreyot : demos & tutorials</a>
   <script src="http://gubhugreyotprojects.googlecode.com/svn/widgets/flash-blogger-404-error-page.js" type="text/javascript"></script>
   </center>

7. Save Changes/Simpan Perubahan.
8. Buka salah satu posting dengan sedikit merubah URL-nya agar halaman error 404 terlihat (lihat contoh dua kasus di atas!).

Cara membuat halaman error 404 dengan game flash-2:

Untuk yang kedua, cara yang dipergunakan hampir sama, hanya anda harus menambahkan kode css di atas kode ]]></b:skin>

1. Lakukan proses seperti di atas (dg xHTML-1) dan simpan xHTML-2.
2. Setelah xHTML-2 tersimpan, lanjutkan dengan klik "Template".
3. Klik "Edit HTML".
4. Klik "Proceed/Lanjutkan".
5. Cari kode ]]></b:skin>.
6. Letakkan kode CSS di atas ]]></b:skin>.
7. Klik "Save Template/Simpan Template".
8. Buka sebuah alamat posting seperti cara yang dipergunakan pada xHTML-1.

xHTML-2 :

<center>
Cihui... Rupanya anda tersesat! Kecian,dech... Hu ... makanya besok lagi klo mo bepergian bawa peta,dong!  Nich..., maen game duluan n n'tar klo udah cape klik link-nya. Teman2 udah nundu, mbul!!<br/><a href="http://gubhugreyot.blogspot.com" title="Tuh ... liat ... tuh ... jalannya. Hih... ,dasar!">gubhugreyot : demos & tutorials</a>
<div class="GRflashgame1">
<div class="GRflashgame2">
<embed src="http://gubhugreyotprojects.googlecode.com/svn/flash/gubhugreyot-flash-cat-game.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="500" height="400" style="margin:-40px 0 0 -30px;"></embed>
</div>
</div>
</center>

Kode CSS :

.status-msg-wrap{
      position:fixed;
      z-index:9999;
      top:0; /* by: gubhugreyot */
      left:0;
      width:100%;
      height:100%;
      padding:0;
      margin:0;
      background: #7d7e7d;
      background: -o-linear-gradient(-45deg,#7d7e7d 1%,#6d6d6d 17%,#303030 17%,#6d6d6d 21%,#444444 28%,#6d6d6d 28%,#2b2b2b 30%,#6d6d6d 31%,#333333 35%,#828282 35%,#828282 91%,#333333 91%,#828282 92%);
      background: -moz-linear-gradient(-45deg,#7d7e7d 1%,#6d6d6d 17%,#303030 17%,#6d6d6d 21%,#444444 28%,#6d6d6d 28%,#2b2b2b 30%,#6d6d6d 31%,#333333 35%,#828282 35%,#828282 91%,#333333 91%,#828282 92%);
      background: -webkit-gradient(linear,left top,right bottom,color-stop(1%,#7d7e7d),color-stop(17%,#6d6d6d),color-stop(17%,#303030),color-stop(21%,#6d6d6d),color-stop(28%,#444444),color-stop(28%,#6d6d6d),color-stop(30%,#2b2b2b),color-stop(31%,#6d6d6d),color-stop(35%,#333333),color-stop(35%,#828282),color-stop(91%,#828282),color-stop(91%,#333333),color-stop(92%,#828282));
      background: -webkit-linear-gradient(-45deg,#7d7e7d 1%,#6d6d6d 17%,#303030 17%,#6d6d6d 21%,#444444 28%,#6d6d6d 28%,#2b2b2b 30%,#6d6d6d 31%,#333333 35%,#828282 35%,#828282 91%,#333333 91%,#828282 92%);
      background: -ms-linear-gradient(-45deg,#7d7e7d 1%,#6d6d6d 17%,#303030 17%,#6d6d6d 21%,#444444 28%,#6d6d6d 28%,#2b2b2b 30%,#6d6d6d 31%,#333333 35%,#828282 35%,#828282 91%,#333333 91%,#828282 92%);
      background: linear-gradient(-45deg,#7d7e7d 1%,#6d6d6d 17%,#303030 17%,#6d6d6d 21%,#444444 28%,#6d6d6d 28%,#2b2b2b 30%,#6d6d6d 31%,#333333 35%,#828282 35%,#828282 91%,#333333 91%,#828282 92%);
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d7e7d',endColorstr='#828282',GradientType=1);}
.status-msg-body{
      font-size:24px;
      color:#eee;
      text-shadow:2px 2px 2px #000;
      margin:0 auto;
      padding:40px 100px;
      height:550px;
      width:800px;
}
.status-msg-body a{
      color:#FC0;
      text-decoration:none;
}
.status-msg-body a:hover{
      color:#6FF;
      text-decoration:none;
}
.status-msg-bg{
      background:transparent;
}
.status-msg-wrap:after{
      position:absolute;
      right:40px;
      top:92%; /* by: http://gubhugreyot.blogspot.com, april, 2012 */
      font-size:12px;
      font-family:arial;
      transform:rotate(-45deg);
      -o-transform:rotate(-45deg);
      -moz-transform:rotate(-45deg);
      -webkit-transform:rotate(-45deg);
      -ms-transform:rotate(-45deg);
      color:#000;
      content:"gubhugreyot";
      text-shadow:0 0 0 #fff;
}
.GRflashgame1{
      margin:30px auto;
      width:450px;
      height:330px;
      border:10px solid #999;
      border-radius:15px;
      overflow:hidden;
      box-shadow:-3px -3px 3px #444,6px 6px 6px #222,0 0 20px #000;
}
.GRflashgame2{
      border:5px solid transparent;
      border-radius:6px;
      width:440px;
      height:320px;
      overflow:hidden;
}

Catatan/Keterangan :

1. Arahkan cursor ke gambar untuk melihat tutorial dalam gambar.
2. Ganti teks "Cihui... Rupanya anda tersesat! Kecian,dech ... dst" dengan teks lain yang membuat pengunjunglebih enjoy.
3. Ganti URL : "http://gubhugreyot.blogspot.com" dengan URL blog anda.
4. Ganti title "Tuh ... liat ... tuh ... jalannya. Hih... ,dasar!" dengan teks lain yang lebih tepat.
5. Untuk mengganti file flash, silahkan ganti : "http://gubhugreyotprojects.googlecode.com/svn/flash/gubhugreyot-flash-cat-game.swf"
6. width="500" height="400" style="...." bisa dideuaikan dengan file flash yang baru.