Tampilkan postingan dengan label tips. Tampilkan semua postingan

Kamis, 14 Juni 2012

membuat menubar

MEMBUAT MENU BAR

1. Login pada blogger
2. masuk ke halaman Template
3. Edit HTML lalu Lanjutkan
4. Klik centang pada Expand Template Widget
5. Cari kode ]]></b:skin> (gunakan ctrl+f)
6. Pasang kode di bawah ini di atas kode ]]></b:skin>

#menubar{
width:900px;
height:32px;
background:#000fff;
float:center;
margin-bottom:10px;
}
#menubar ul{
float:left;
margin:0;
padding:0;
}
#menubar li{
float:left;
list-style:none;
margin:0;
padding:0;
}
#menubar li a, #menubar li a:link{
border-right:1px solid #F0512D;
float:left;
padding:8px 12px;
color:#fff;
text-decoration:none;
font-size:13px;
font-weight:bold;
}
#menubar li a:hover, #menubar li a:active, #menubar .current_page_item a {
color:#ffffff;
text-decoration:underline;
}
#menubar li li a, #menubar li li a:link, #menubar li li a:visited{
font-size: 12px;
background: #00ff11;
color: #fff;
text-decoration:none;
width: 150px;
padding: 0px 10px;
line-height:30px;
}
#menubar li li a:hover, #menubar li li a:active {
background: #F0512D;
color: #ffa500;
}
#menubar li ul{
z-index:9999;
position:absolute;
left:-999em;
height:auto;
width:170px;
margin-top:32px;
border:1px solid ##F0512D;
}
#menubar li:hover ul, #menubar li li:hover ul, #menubar li li li:hover ul, #menubar li.sfhover ul, #menubar li li.sfhover ul, #menubar li li li.sfhover ul{
left:auto
}
#menubar li:hover, #menubar li.sfhover{
position:static
}

7. Selanjutnya cari kode <div id='content-wrapper'>
8. Pasang kode di bawah ini di Atas kode yang bercetak tebal pada no 7

<div id='menubar'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
</ul>
</div>

9. Simpan Template dan lihat hasilnya

Untuk membuat sub menu (menu dropdown) agar mudah ganti saja kode pada no 8 dengan kode di bawah ini

<div id='menubar'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a>
<ul>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
<li><a href='http://blognya-reggy.blogspot.com/'>Edit me</a></li>
</ul></li>
</ul>
</div>

Keterangan:

Ganti tulisan yang berwarna Merah dengan url link menubar yang diinginkan, misal: link postingan, link kategori, link halaman statis atau lainnya
Ganti tulisan berwarna Biru dengan tulisan judul menubar tersebut, seperti: About, Contact, Guest book atau lainnya
Untuk mengubah panjang menubar bisa sobat ganti tulisan 900px menjadi sesuai dengan keinginan sobat
Nah, jika ingin menambah item menubar (list), sobat hanya tinggal Copy kode yang bergaris bawah, dan Paste di bawah kode yang bergaris bawah tersebut.

Selasa, 26 Juli 2011

Kode Warna html

Code warna html

berikut adalah kode warna html

#000000

#111111

#222222

#333333

#444444

#555555

#666666

#777777

#888888

#999999

#aaaaaa

#bbbbbb

#cccccc

#eeeeee

#ffffff

#0fffff

#00ffff

#000fff

#0000ff

#111fff

#333fff

#555fff

#777fff

#999fff

#fff999

#fff777

#fff555

#fff333

#fff000

#001111

#002222

#003333

#004444

#005555

#006666

#007777

#008888

#009999

#00aa99

#00ff11

#00ee11

#00dd11

#00cc11

#00bb11

#00aa22

#00aa44

#00aa66

#00aa88

#00aa99

#00ee11

#00ee44

#00ee66

#00ee88

#00ee99

#800000

#aa0000

#bb0000

#cc0000

#dd0000

#ee0000

#ff0000

#ff1100

#ff3300

#ff5500

#ff7700

#ff9900

#ff99aa

#ff99bb

Membuat tulisan terbalik

mau tulisan anda jadi terbalik kaya gini:

"tulisan terbalik ʞılɐqɹǝʇ uɐsılnʇ"

tulis saja tulisan anda di bawah ini lalu copy
Flip

Flip

Selamat mencoba................

Mau letakkan di blog anda?
Ini dia kode html nya

<html><head>
<!-- Help IE with utf8; thank you, Glards! -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="description" content="Turn text upside down. Rotate letters 180 degrees with Unicode.">
<title>Flip</title>
<style type="text/css">
textarea { font-family: "Arial Unicode MS", Batang }
h1 { margin-bottom: 2px;}
</style>
<script>
function flip() {
 var result = flipString(document.f.original.value.toLowerCase());
 document.f.flipped.value = result;
}

function flipString(aString) {
 var last = aString.length - 1;
 //Thanks to Brook Monroe for the suggestion to use Array.join
 var result = new Array(aString.length)
 for (var i = last; i >= 0; --i) {
  var c = aString.charAt(i)
  var r = flipTable[c]
  result[last - i] = r ? r : c
 }
 return result.join('')
}

var flipTable = {
a : '\u0250',
b : 'q',
c : '\u0254', //open o -- from pne
d : 'p',
e : '\u01DD',
f : '\u025F', //from pne
g : '\u0183',
h : '\u0265',
i : '\u0131', //from pne
j : '\u027E',
k : '\u029E',
//l : '\u0283',
m : '\u026F',
n : 'u',
r : '\u0279',
t : '\u0287',
v : '\u028C',
w : '\u028D',
y : '\u028E',
'.' : '\u02D9',
'[' : ']',
'(' : ')',
'{' : '}',
'?' : '\u00BF', //from pne
'!' : '\u00A1',
"\'" : ',',
'<' : '>',
'_' : '\u203E',
'\u203F' : '\u2040',
'\u2045' : '\u2046',
'\u2234' : '\u2235',
'\r' : '\n' //thank you, Yeeliberto
}

for (i in flipTable) {
  flipTable[flipTable[i]] = i
}
</script></head><body>
<h1>Flip</h1>
<form name="f">Original:
<br>
<textarea rows="5" cols="50" name="original" onkeyup="flip()"></textarea> <input value="Flip" onclick="flip()" type="button">
<br>
Flipped:
<br>
<textarea rows="5" cols="50" name="flipped"></textarea>
</form>

</small>
</p>
</body></html>

Cerita Kehidupan

Pages

Cari

calender

Labels

shoutbox

Blog Archive

Kamis, 14 Juni 2012

membuat menubar

Selasa, 26 Juli 2011

Kode Warna html

Membuat tulisan terbalik

Flip

Clock

About Me

Followers

Link

translate