Featured Post (TOP)

27 Juli 2009

Cara Membuat Footer Navbar / Navbar Bawah



Pada kesempatan kali ini aku akan membaas tentang Cara Membuat Footer Navbar / Navbar Bawah. apa sih Footer Navbar / Navbar Bawah itu...??? Footer Navbar /Navbar Bawah itu sama seperti Strip Ad yang sebelumnya pernah aku bahas (kalau yang belum baca klik disini), tetapi kalau yang ini muncul pada bagian bawah blog kita.

sebagai contoh kalian bisa lihat di blog ku.
tidak banyak basa-basi langsung aja kita ke caranya :

1. Masuk ke Blogger -> Tata Letak -> Edit Html
2. Copykan kode berikut di atas kode ]]></b:skin>


#navbar-footer p.info {
float: right;
padding-right:40px;
line-height: 1.2;
height: 100%;
vertical-align: bottom;
}

#navbar-footer p {
float: left;
margin: 0px;
padding-top:4px;
padding-left:40px;
vertical-align: bottom;
line-height: 1.2;
}

#navbar-footer a {
color: #333;
}

#navbar-footer {
align: center;
position: fixed;
border-top: 1px solid #ddd;
border-bottom: 10px solid #f5f5f5;
background-color: #f5f5f5;
width: 100%;
left: 0px;
text-align: left;
color: #888;
font-family: Verdana;
font-size: 11px;
z-index:10000;
opacity: 0.9;
filter: alpha(opacity: 90);
bottom:0;
}


3. selanjutnya, masukkan kode berikut persis diatas kode </body>


<div id='navbar-footer'>
<p>
<img border='0' src='http://i595.photobucket.com/albums/tt40/rassiv/th_User-32x32.png'/>&#160;&#160;<a href='http://www.rassiv-web.co.cc'>Rassiv's Blog</a>&#160;&#169;&#160;2009-2010 <img border='0' src='http://www.mylivesignature.com/signatures/54487/240/54B382033CC46BF2A3C8D4D63FB5DF43.png'/></p>
<p class='info'>Creted &amp; Edited by <a href='http://www.rassiv-web.co.cc' target='_blank'>Rassiv Blog</a> | <a href='#' title='Back to Top'><- Back To Top -></a>
<br/>Best viewed in <img border='0' src='http://wiki.site5.com/images/f/f8/Firefox_icon.png'/> Email : <img border='0' src='http://i290.photobucket.com/albums/ll256/angkatan2006/icon/icon-email-small.png'/> rassiv.q@gmail.com
<br/>
</p>
</div>


* Silahkan Ubah teks berwarna merah sesuka kamu

4. SIMPAN dan selesai deh.... silahkan kamu lihat hasilnya

*Semoga Bermanfaat*

26 Juli 2009

Membuat Teks Berjalan Di Navbar Atas Part 2



pada kesempatan kali ini aku akan membahas tentang Membuat Teks Berjalan Di Navbar Atas. yah....! itukan udah dibahas sebelumnya...? eitssss, tapi tungu dulu kali ini yang Part 2 nya. kalau kalian masih penasaran, aku akan jelaskan:

Kalau kalian mengunjungi blogku pasti pada Navbar atas akan ada tulisan "WELLCOME TO RASSIV's BLOG", nah seperti itulah Teks Berjalan Di Navbar Atas Part 2 yang akan ku bahas. Menurutku trik ini agak sedikit unik karna Teks akan berjalan huruf demi huruf... gimana tertarik ? ok ikuti langkah berikut ini :

1. Log in ke Blogger -> Tata Letak -> Elemen Halaman -> Tambah Gadget
2. Copykan Kode di bawah ini pada kotak yang tersedia :


<script type="text/javascript">
//Created by Title bar Maker (http://www.bosiljak.hr/titlemaker)
function tb8_makeArray(n){
this.length = n;
return this.length;
}

tb8_messages = new tb8_makeArray(4);
tb8_messages[0] = "WELLCOME TO RASSIV's BLOG";
tb8_messages[1] = "PLEASE SEND YOUR COMMENT";
tb8_messages[2] = "THANK YOU FOR VISITED";
tb8_messages[3] = "GOOD LUCK";
tb8_rptType = 'infinite';
tb8_rptNbr = 5;
tb8_speed = 100;
tb8_delay = 2000;
var tb8_counter=1;
var tb8_currMsg=0;
var tb8_tekst ="";
var tb8_i=0;
var tb8_TID = null;
function tb8_pisi(){
tb8_tekst = tb8_tekst + tb8_messages[tb8_currMsg].substring(tb8_i, tb8_i+1);
document.title = tb8_tekst;
tb8_sp=tb8_speed;
tb8_i++;
if (tb8_i==tb8_messages[tb8_currMsg].length){
tb8_currMsg++; tb8_i=0; tb8_tekst="";tb8_sp=tb8_delay;
}
if (tb8_currMsg == tb8_messages.length){
if ((tb8_rptType == 'finite') && (tb8_counter==tb8_rptNbr)){
clearTimeout(tb8_TID);
return;
}
tb8_counter++;
tb8_currMsg = 0;
}
tb8_TID = setTimeout("tb8_pisi()", tb8_sp);
}
tb8_pisi()
</script>


lalu simpan deh.... dan lihat hasilnya !


Catatan :

* Ganti teks berwarna biru dengan kata-kata yang kamu suka
* Teks berwarna merah adalah kecepatan berjalannya teks ( ganti sesukamu )
*
Teks berwarna Ungu adalah Delay berjalanya teks ( ganti sesukamu)

 

Subscribe to our Newsletter

Contact our Support

Email us: Support@templateism.com

Our Team Memebers