Pesan Pembuka Ramadhan kartun

Oleh Unknown

Sabtu, 28 Juni 2014

Bagikan :

Tweet

Kali ini saya akan share Membuat Pesan Pembuka Versi Kartun

Berhubung Bulan ramadhan sudah dekat, saya berfikiran untuk membuat Pesan pembuka ini di blog 

Supaya Blog agan menghormati Bulan penuh berkah ini, dan mencerminkan Nama baik Blog agan

• Demo

Tutorialnya bisa kalian lihat dibawah ini

MENAMBAHKAN KODE CSS

Kemudian pindah Opsi ke menu Template pilih Edit HTML

Salin kode CSS berikut di atas kode  ]]></b:skin>

Gunakan CTRL  F untuk mempermudah pencarian

#welcomebox {position:fixed;top:5%;left:50%;width:70%;margin-left:-35%;z-index:1000000;text-align:center;} #welcomebox p{color:#fff;font-size:150%;line-height:1.6em;margin:-5px 0 50px;} .welcomeclose {background:#bbb;color:#111;border-radius:3px;padding:4px 10px;text-align:center;margin:0 auto;cursor:pointer;display:inline;} .welcomeclose:hover {background-color:#aaa} #welcomeoverlay {position:fixed !important;position:absolute; z-index:999999;top:0px;right:0px;bottom:0px;left:0px;background:#005629 url(http://th02.deviantart.net/fs71/PRE/i/2013/192/d/1/ramadhan_mubarak_by_nayzak-d6d3533.jpg) no-repeat top center;}

Url yang berwarna pink adalah URL gambar yang sama persis dengan demo, kalian bisa menggantinya dengan gambar yang lain atau bisa juga menggunakan Gambar di bawah ini

Gambar Alternatif



PENAMBAHAN CODE

Salin Code berikut di atas code </body>
Gunakan CTRL  F untuk mempermudah pencarian

<div id='welcomeoverlay'/> <div id='welcomebox'> <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> <p>&#8220;Marhaban Ya Ramadhan&#8221;<br/> Saya, Rudi Ardiansyah selaku admin CoretaNewbiee mengucapkan<br/> &quot;Selamat menunaikan ibadah puasa,<br/> semoga kita selalu diberkahi di bulan yang penuh mahrifah ini...amin.&quot;</p> <div class='welcomeclose' onclick='document.getElementById(&quot;welcomebox&quot;).style.display=&quot;none&quot;;welcomeoverlay.style.display=&quot;none&quot;;'>Lanjutkan Membaca &#8594;</div> </div>

Tulisan yang berwarna Merah bisa kalian ganti dengan Nama Sobat dan Nama Blog Sobat.
Simpan Template dan lihat hasilnya

Sekian Pembelajaran kali ini

Semoga bermanfaat, Terima Kasih