Home » » Cara Membuat Kotak Pemberitahuan Blog

Cara Membuat Kotak Pemberitahuan Blog


Trik kali ini Membuat Kotak Pemberitahuan Blog. Ada banyak cara untuk melakukan trik ini, di mana saya memperkenalkan sebuah aplikasi kecil Jquery dalam menciptakan Kotak Pesan Blog. Sebuah fitur khusus dari kerangka ini adalah bahwa pembaca dapat mematikannya jika diinginkan, sehingga memastikan estetika blog Anda.




Langsung saja ke langkah-langkahnya.

Langkah 1
Sign In Ke Akun Blog anda
Langkah 2
Masuk ke Rancangan
Langkah 3
Edit HTML
Langkah 4
Copy Kode dibawah ini. dan pastekan diatas kode </body>


<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
.notification{height:70px;width:480px;display:block;position:fixed;bottom:10px;left:10px;/*Border Radius*/border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;/*Box Shadow*/-moz-box-shadow:2px 2px 2px #cfcfcf;-webkit-box-shadow:2px 2px 4px #cfcfcf;box-shadow:2px 2px 2px #cfcfcf}
.notification span{background:url(https://lh5.googleusercontent.com/_U0QaeycS3vw/Taqu74WricI/AAAAAAAAAkE/eEcZwcRj0ko/close.png) no-repeat right top;cursor:pointer;display:block;width:19px;height:19px;position:absolute;top:-9px;right:-8px}
.notification p{width:400px;font-family:Arial,Helvetica,sans-serif;color:#323232;font-size:14px;line-height:21px;text-align:left;float:right;margin:10px 15px 0 0;*margin-top:15px;/*for lt IE8*/padding:0;/* TEXT SHADOW */ text-shadow:0 0 1px #f9f9f9}
.warning{border-top:1px solid #fefbcd;border-bottom:1px solid #e6e837;/*Background Gradients*/background:#feffb1;background:-moz-linear-gradient(top,#feffb1,#f0f17f);background:-webkit-gradient(linear,left top,left bottom,from(#feffb1),to(#f0f17f))}
.warning:before{content:url(https://lh3.googleusercontent.com/_U0QaeycS3vw/Taqu7wyV6rI/AAAAAAAAAkI/726O1B0-O94/warning.png);float:left;margin:15px 15px 0 25px}
.warning strong{color:#e5ac00;margin-right:15px}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){$(&#39;.notification&#39;).hover(function(){$(this).css(&#39;cursor&#39;,&#39;auto&#39;);});$(&#39;.notification span&#39;).click(function(){$(this).parent().fadeOut(800);});});</script>
<div class='notification warning'><span/>
<p><strong>Warning!</strong>Selamat datang di blog lora malunk, Tutorial blog Up To Date</p></div></b:if>


Langkah 5
Ganti tulisan yang dicetak TEBAL dengan sesuka anda.
Langkah 6
Simpan Template anda danlihat hasilnya sungguh sempurna
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Lora Malunk Blog
tutorial blog up to date
Loading...

+ komentar + 1 komentar

24 Oktober 2011 02.02

Mohon dukungannnya ne Gan dalam "ACER GURARU AWARD 2011" Terima Kasih ya Gan atas dukungannya.. klik di sini gan

Terimakasih Rino Safrizal atas Komentarnya di Cara Membuat Kotak Pemberitahuan Blog

Posting Komentar

Kebijakan berkomentar akan dihapus, jika tidak sesuai dengan aturan dibawah ini, Demi kenyamanan kita bersama :

» Menggunakan bahasa yang tidak sopan (Sara, Pornografi, Menyinggung)
» Duplikat komentar
» Komentar menautkan link secara langsung
» Komentar tidak berkaitan dengan artikel
» Judul Komentar Berupa Promosi

Terima Kasih .... Lora Malunk Blog

 

Configurasi

Alexa :
Stats :
Page Rank : Free PageRank Checker
DMCA :
Amung :
Bloggers : Bloggers - Meet Millions of Bloggers
Extreme :
eXTReMe Tracker
Support : Lora Malunk Blog | Songong Template | Tutorial Blog
Copyright © 2011. Lora Malunk Blog - All Rights Reserved
Template Modify by Lora Malunk Blog
Proudly powered by Blogger