Halaman Pesan Pembuka Saat membuka Blog - Kali ini saya akan share cara membuat pesan pembuka ketika masuk blog dengan background yang menutupi seluruh tampilan blog anda dengan Wallpaper dan tombol untuk menghilangkannya seperti pada gambar di bawah atau silahkan coba pada demonya.
Bagi yang sudah jelas dengan tampilan gambar dan Demonya berikut ini langkah-langkah untuk mengerjakannya
CSS KODE
#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://islamiworld.com/wp-content/uploads/2014/07/Ramadan.jpg) no-repeat top center;}
Setelah itu cari kode <body> lalu salin dan tempel kode dibawah ini dan letakkan dibawah kode yang anda cari tadi.
HTML CODE
<!-- Pesan Pembuka -->
<div id='welcomeoverlay'/>
<div id='welcomebox'>
<p>“Marhaban Ya Ramadhan”<br/>
Saya, Sagitarius Kusadhi selaku admin Shaggy Web mengucapkan<br/>
"Selamat menunaikan ibadah puasa,<br/>
semoga kita selalu diberkahi di bulan yang penuh berkah ini...amin."</p>
<div class='welcomeclose' onclick='document.getElementById("welcomebox").style.display="none";welcomeoverlay.style.display="none";'>Continue Reading →</div>
</div>
Anda juga bisa mengganti tampilan backgroundnya pada code CSSnya yang berwana MERAH dan juga mengganti salam pembukanya pada code HTMLnya
Mungkin sekian postingan dari saya mengenai Halaman Pesan Pembuka Saat membuka Blog semoga postingan ini menarik dan dapat berguna bagi anda semuanya.
Re-Post: KompiAjaib
Re-Post: KompiAjaib
HAPPY CODE and HAPPY BLOGGING
EmoticonEmoticon