Jadwal Bebrbuka puasa 2013
17.51 |
Label:
Mahmud H Huseng
KLIK DAN LANJUTKAN → Jadwal Bebrbuka puasa 2013
Read User's Comments(0)
Cara Membuat Menu Horizontal Blog Drop Down Search Engine
09.36 |
Label:
Mahmud H Huseng
Cara Membuat Menu Horizontal Blog Drop Down Search Engine
merupakan menu laman blog yang terlengkap yang bisa anda pasang di blog
anda. Pada menu ini sudah disediakan beberapa sub-menu yang bisa anda
gunakan untuk menghemat ruang atau tempat di blog anda dan selain itu
juga sudah terdapat kolom pencarian yang akan membantu pengunjung blog
anda mencari artikel yang mereka inginkan. Seperti halnya membuat menu horizontal yang lain, yang telah saya jelaskan dibeberapa artikel, membuat menu horizontal blog drop down dengan serach engine juga sangat mudah dilakukan, seperti penjelasan berikut ini
Cara Membuat Menu Horizontal Blog Drop Down Search Engine
Semoga Bisa Membantu Agan Agan Semuanya
KLIK DAN LANJUTKAN → Cara Membuat Menu Horizontal Blog Drop Down Search Engine
Cara Membuat Menu Horizontal Blog Drop Down Search Engine
- Masuk ke akun blogger anda
- Pilih dan klik Template >> Edit Html >> Lanjutkan >> centang Expand Template Widget >> tekan Ctrl + F di keyboard
- Cari kode ]]></b:skin>
- Masukkan kode CSS berikut tepat diatas ]]></b:skin>
#menudropse{background:#000000 url() repeat-x;width:940px;margin:0 auto;padding:0 auto}
#menuwrapperdropse{width:940px;height:30px;margin:0 auto}.menusearch{width:300px;float:right;margin:0 auto;padding:0 auto}
.clearit{clear:both;height:0;line-height:0.0;font-size:0}
#menubardropse{width:100%}
#menubardropse,#menubardropse ul{list-style:none;font-family:Arial, serif;margin:0;padding:0}
#menubardropse a{display:block;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;text-shadow: 0px 1px 1px #000;color:#f2f1f1;border-right:1px solid #666;padding:9px 10px 8px}
#menubardropse a.trigger{background-image:url();background-repeat:no-repeat;background-position:right center;padding:9px 24px 8px 10px}
#menubardropse li{float:left;position:static;width:auto}
#menubardropse li ul,#menubardropse ul li{width:170px}
#menubardropse ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px}
#menubardropse li ul{z-index:100;position:absolute;display:none;background:#222;padding-bottom:5px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6)}
#menubardropse li:hover a,#menubardropse a:active,#menubardropse a:focus,#menubardropse li.hvr a{background-color:#222;color:#E98C0A}
#menubardropse li:hover ul,#menubardropse li.hvr ul{display:block}
#menubardropse li:hover ul a,#menubardropse li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none}
#menubardropse li ul li.hr{border-bottom:1px solid #444;border-top:1px solid #000;display:block;font-size:1px;height:0;line-height:0;margin:4px 0}
#menubardropse ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}
- Cari kode seperti berikut ini
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Panduan Template Blog(Header)' type='Header'/>
</b:section>
</div> - Letakkan kode menu horizontal berikut dengan memperhatikan dua pilihan ini
Jika anda ingin menampilkan menu horizontal diatas judul blog, letakkan kode menu horizontal dibawah <div id='header-wrapper'>
Jika anda ingin menampilkan menu horizontal dibawah judul blog, letakkan kode menu horizontal dibawah </b:section> - Kode Menu Horizontal Blog Drop Down Dengan Search Engine
<div id='menudropse'>
<div id='menuwrapperdropse'>
<ul id='menubardropse'>
<li><a href='#'>Home</a></li>
<li><a href='#'>Halaman1</a></li>
<li><a class='trigger' href='#'>Halaman2</a>
<ul>
<li><a href='#'>SubHal2</a></li>
<li class='hr'/>
<li><a href='#'>SubHal2</a></li>
<li class='hr'/>
<li><a href='#'>SubHal2</a></li>
</ul>
</li>
<li><a href='#'>Halaman3</a></li>
<li><a class='trigger' href='#'>Halaman4</a>
<ul>
<li><a href='#'>SubHal4</a></li>
<li class='hr'/>
<li><a href='#'>SubHal4</a></li>
<li class='hr'/>
<li><a href='#'>SubHal4</a></li>
</ul>
</li>
<li><a href='#'>Halaman5</a></li>
<li><a class='trigger' href='#'>Uncategories</a>
<ul>
<li><a href='#'>Uncategories1</a></li>
<li class='hr'/>
<li><a href='#'>Uncategories2</a></li>
<li class='hr'/>
<li><a href='#'>Uncategories3</a></li>
<li class='hr'/>
<li><a href='#'>Uncategories4</a></li>
<li class='hr'/>
<li><a href='#'>Uncategories5</a></li>
</ul>
</li>
</ul>
<div class='menusearch'>
<div style='float:right;padding:4px 8px 0 0;'>
<form action='http://www.google.com/search' method='get' target='_blank'>
<input name='sitesearch' style='display:none;' value='http://panduantemplateblog.blogspot.com'/>
<input id='search-box' name='q' onblur='if(this.value=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value='';' style='width:170px;border:none;padding:4px 10px; font:12px Arial;color:#666; background:#FFFFFF;' type='text' value='Cari Artikel...'/><input align='top' id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC558tkXWx11QGnFxA_SEWk5K8b5Hv82Or1nwK91RRRezM1bg7dgvl_YN_mKQ2YKQTy0zFDtuUrw4sTQLLm6JgFSoVjFU8fS_0Nj5lq8hmryH_7R2GoQIfOa0u3yR-Llg8iK-JoiS7JOly/' type='image' value='Cari'/>
</form>
</div>
</div>
<br class='clearit'/>
</div>
</div> - Jika semuanya sudah dilakukan, silahkan Pratinjau terlebih dahulu. Jika tidak ada error, Simpan Template anda dan lihat hasilnya.
- Tambahan : http://anaklamuru1.blogspot.com ganti dengan link url blog anda
Semoga Bisa Membantu Agan Agan Semuanya
Read User's Comments(0)
Cara Membuat Menu Diatas Header Blog
09.27 |
Label:
Mahmud H Huseng
Postingan tentang cara membuat menu diatas header blog.
Kita bisa menaruh link lebih banyak lagi di blog, dan dari segi
keindahan juga tampilan menu diatas header ini membuat blog kelihatan
lebih menarik. Langsung saja karena script nya cukup panjang:
-Login ke akun Blogger anda:
-Klik Rancangan
-Edit HTML
-Centang Expand Template Widget
Cari kode ]]></b:skin> dan letakkan kode berikut diatasnya.
===================================================================
/*The top Menu*/
#top{
margin:auto;
padding: 0;
width: 100%;
background:#000000;
border-bottom:1px solid #373127;
}
#top-wrap{
margin:auto;
padding: 0;
width: 960px;
background:#000000;
}
#navwrap {margin: 0px auto; width:560px; float:left;background:#080705;}
.topnav ul {list-style:none;margin:0;padding:0px; float:left;}
.topnav li {float:left;margin:0;text-align:center;}
.topnav li a {font-family: georgia; font-weight:bold; font-size:10px;display:block;padding:10px 10px;color:#fff;text-decoration:none; text-transform:uppercase;}
.topnav li a {background:none; }
.topnav li a:hover, li a:focus, li a:active {text-decoration:none; background:#ffffff; color:#000000;}
/*The top Menu*/
#med{
margin:auto;
padding: 0;
width: 100%;
background:#000000;
}
#med-wrap{
margin:auto;
padding: 0;
width: 960px;
}
.mednav ul {list-style:none;margin:0;padding:0px; float:left;}
.mednav li {float:left;margin:0;text-align:center;}
.mednav li a {font-family: georgia; font-weight:bold; font-size:11px;display:block;padding:10px 10px;color:#000000;text-decoration:none; text-transform:lowercase;}
.mednav li a {background:none; }
.mednav li a:hover, li a:focus, li a:active {text-decoration:underline; color:#000000;}
#navbar-iframe {
display: none !important;
}
Cari lagi kode </head> dan letakkan kode brikut dibawahnya:
<div id='top'>
<div id='top-wrap'>
<div class='topnav'>
<ul id='topnav'>
<li><a href='url / link homepage '>home</a></li>
<li><a href='url / link 1'>judul link</a></li>
<li><a href='url / link 2'>judul link</a></li>
<li><a href='url / link 3'>judul link</a></li>
<li><a href='url / link 4'>judul link</a></li>
</ul>
</div>
</div>
<div style='clear: both;'/>
</div>
Mau lihat hasilnya ... Lihat Menu diblog ini , itu diatas judul Blog
Selamat Mencoba
Jika ada sesuatu yang tidak di mengerti Silahkan Buat Pertanyaan melalui Komentar
Semoga kami bisa membantu
KLIK DAN LANJUTKAN → Cara Membuat Menu Diatas Header Blog
-Login ke akun Blogger anda:
-Klik Rancangan
-Edit HTML
-Centang Expand Template Widget
Cari kode ]]></b:skin> dan letakkan kode berikut diatasnya.
===================================================================
/*The top Menu*/
#top{
margin:auto;
padding: 0;
width: 100%;
background:#000000;
border-bottom:1px solid #373127;
}
#top-wrap{
margin:auto;
padding: 0;
width: 960px;
background:#000000;
}
#navwrap {margin: 0px auto; width:560px; float:left;background:#080705;}
.topnav ul {list-style:none;margin:0;padding:0px; float:left;}
.topnav li {float:left;margin:0;text-align:center;}
.topnav li a {font-family: georgia; font-weight:bold; font-size:10px;display:block;padding:10px 10px;color:#fff;text-decoration:none; text-transform:uppercase;}
.topnav li a {background:none; }
.topnav li a:hover, li a:focus, li a:active {text-decoration:none; background:#ffffff; color:#000000;}
/*The top Menu*/
#med{
margin:auto;
padding: 0;
width: 100%;
background:#000000;
}
#med-wrap{
margin:auto;
padding: 0;
width: 960px;
}
.mednav ul {list-style:none;margin:0;padding:0px; float:left;}
.mednav li {float:left;margin:0;text-align:center;}
.mednav li a {font-family: georgia; font-weight:bold; font-size:11px;display:block;padding:10px 10px;color:#000000;text-decoration:none; text-transform:lowercase;}
.mednav li a {background:none; }
.mednav li a:hover, li a:focus, li a:active {text-decoration:underline; color:#000000;}
#navbar-iframe {
display: none !important;
}
Cari lagi kode </head> dan letakkan kode brikut dibawahnya:
<div id='top'>
<div id='top-wrap'>
<div class='topnav'>
<ul id='topnav'>
<li><a href='url / link homepage '>home</a></li>
<li><a href='url / link 1'>judul link</a></li>
<li><a href='url / link 2'>judul link</a></li>
<li><a href='url / link 3'>judul link</a></li>
<li><a href='url / link 4'>judul link</a></li>
</ul>
</div>
</div>
<div style='clear: both;'/>
</div>
Mau lihat hasilnya ... Lihat Menu diblog ini , itu diatas judul Blog
Selamat Mencoba
Jika ada sesuatu yang tidak di mengerti Silahkan Buat Pertanyaan melalui Komentar
Semoga kami bisa membantu
Read User's Comments(0)
CARA MEMBUAT MENU HORIZONTAL SUPER CANTIK SUPER KEREN DI BLOG
05.18 |
Label:
Mahmud H Huseng
CARA MEMBUAT MENU HORIZONTAL SUPER CANTIK SUPER KEREN
DI BLOG
Caranya Gampang Banget Bro
Login ke Blog Anda
Klik Design
Kemudian Klik Template
Edit HTML
Cari Code
</header> Cara cepatnya
tekan Ctrl F
Kalau sudah ketemu
Copy Link dibawah dan Letakkan (
Paste ) persis di bawah kode </header >
=========================================================================
<style>
/*------ CSS3 Drop Down Menu By RL (rinjanilovers.blogspot.com)---------*/
#rl-menu, #rl-menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#rl-menu {
width: 905px;
margin: 60px auto;
border: 1px solid #222;
background-color: #000;
background-image: -moz-linear-gradient(#444, #111);
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
background-image: -webkit-linear-gradient(#444, #111);
background-image: -o-linear-gradient(#444, #111);
background-image: -ms-linear-gradient(#444, #111);
background-image: linear-gradient(#444, #111);
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 0 1px 1px #777;
-webkit-box-shadow: 0 1px 1px #777;
box-shadow: 0 1px 1px #777;
}
#rl-menu:before,
#rl-menu:after {
content: "";
display: table;
}
#rl-menu:after {
clear: both;
}
#rl-menu {
zoom:1;
}
#rl-menu li {
float: left;
border-right: 1px solid #222;
-moz-box-shadow: 1px 0 0 #444;
-webkit-box-shadow: 1px 0 0 #444;
box-shadow: 1px 0 0 #444;
position: relative;
}
#rl-menu a {
float: left;
padding: 12px 30px;
color: #999;
text-transform: uppercase;
font: bold 12px Arial, Helvetica;
text-decoration: none;
text-shadow: 0 1px 0 #000;
}
#rl-menu li:hover > a {
color: #fafafa;
}
*html #rl-menu li a:hover { /* IE6 only */
color: #fafafa;
}
#rl-menu ul {
margin: 20px 0 0 0;
_margin: 0; /*IE6 only*/
opacity: 0;
visibility: hidden;
position: absolute;
top: 38px;
left: 0;
z-index: 9999;
background: #444;
background: -moz-linear-gradient(#444, #111);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
background: -webkit-linear-gradient(#444, #111);
background: -o-linear-gradient(#444, #111);
background: -ms-linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
-moz-box-shadow: 0 -1px rgba(255,255,255,.3);
-webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3);
box-shadow: 0 -1px 0 rgba(255,255,255,.3);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
#rl-menu li:hover > ul {
opacity: 1;
visibility: visible;
margin: 0;
}
#rl-menu ul ul {
top: 0;
left: 150px;
margin: 0 0 0 20px;
_margin: 0; /*IE6 only*/
-moz-box-shadow: -1px 0 0 rgba(255,255,255,.3);
-webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3);
box-shadow: -1px 0 0 rgba(255,255,255,.3);
}
#rl-menu ul li {
float: none;
display: block;
border: 0;
_line-height: 0; /*IE6 only*/
-moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
-webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
box-shadow: 0 1px 0 #111, 0 2px 0 #666;
}
#rl-menu ul li:last-child {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
#rl-menu ul a {
padding: 10px;
width: 130px;
_height: 10px; /*IE6 only*/
display: block;
white-space: nowrap;
float: none;
text-transform: none;
}
#rl-menu ul a:hover {
background-color: #0186ba;
background-image: -moz-linear-gradient(#04acec, #0186ba);
background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
background-image: -webkit-linear-gradient(#04acec, #0186ba);
background-image: -o-linear-gradient(#04acec, #0186ba);
background-image: -ms-linear-gradient(#04acec, #0186ba);
background-image: linear-gradient(#04acec, #0186ba);
}
#rl-menu ul li:first-child > a {
-moz-border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
}
#rl-menu ul li:first-child > a:after {
content: '';
position: absolute;
left: 40px;
top: -6px;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #444;
}
#rl-menu ul ul li:first-child a:after {
left: -6px;
top: 50%;
margin-top: -6px;
border-left: 0;
border-bottom: 6px solid transparent;
border-top: 6px solid transparent;
border-right: 6px solid #3b3b3b;
}
#rl-menu ul li:first-child a:hover:after {
border-bottom-color: #04acec;
}
#rl-menu ul ul li:first-child a:hover:after {
border-right-color: #0299d3;
border-bottom-color: transparent;
}
#rl-menu ul li:last-child > a {
-moz-border-radius: 0 0 3px 3px;
-webkit-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
}
</style>
<ul id="rl-menu">
<li><a href="http://anaklamuru1.blogspot.com/">Home</a></li>
<li>
<a href="http://anaklamuru1.blogspot.com/">Categories</a>
<ul>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 1</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 2</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 3</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 4</a></li>
</ul>
</li>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
</ul>
/*------ CSS3 Drop Down Menu By RL (rinjanilovers.blogspot.com)---------*/
#rl-menu, #rl-menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#rl-menu {
width: 905px;
margin: 60px auto;
border: 1px solid #222;
background-color: #000;
background-image: -moz-linear-gradient(#444, #111);
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
background-image: -webkit-linear-gradient(#444, #111);
background-image: -o-linear-gradient(#444, #111);
background-image: -ms-linear-gradient(#444, #111);
background-image: linear-gradient(#444, #111);
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 0 1px 1px #777;
-webkit-box-shadow: 0 1px 1px #777;
box-shadow: 0 1px 1px #777;
}
#rl-menu:before,
#rl-menu:after {
content: "";
display: table;
}
#rl-menu:after {
clear: both;
}
#rl-menu {
zoom:1;
}
#rl-menu li {
float: left;
border-right: 1px solid #222;
-moz-box-shadow: 1px 0 0 #444;
-webkit-box-shadow: 1px 0 0 #444;
box-shadow: 1px 0 0 #444;
position: relative;
}
#rl-menu a {
float: left;
padding: 12px 30px;
color: #999;
text-transform: uppercase;
font: bold 12px Arial, Helvetica;
text-decoration: none;
text-shadow: 0 1px 0 #000;
}
#rl-menu li:hover > a {
color: #fafafa;
}
*html #rl-menu li a:hover { /* IE6 only */
color: #fafafa;
}
#rl-menu ul {
margin: 20px 0 0 0;
_margin: 0; /*IE6 only*/
opacity: 0;
visibility: hidden;
position: absolute;
top: 38px;
left: 0;
z-index: 9999;
background: #444;
background: -moz-linear-gradient(#444, #111);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
background: -webkit-linear-gradient(#444, #111);
background: -o-linear-gradient(#444, #111);
background: -ms-linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
-moz-box-shadow: 0 -1px rgba(255,255,255,.3);
-webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3);
box-shadow: 0 -1px 0 rgba(255,255,255,.3);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
#rl-menu li:hover > ul {
opacity: 1;
visibility: visible;
margin: 0;
}
#rl-menu ul ul {
top: 0;
left: 150px;
margin: 0 0 0 20px;
_margin: 0; /*IE6 only*/
-moz-box-shadow: -1px 0 0 rgba(255,255,255,.3);
-webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3);
box-shadow: -1px 0 0 rgba(255,255,255,.3);
}
#rl-menu ul li {
float: none;
display: block;
border: 0;
_line-height: 0; /*IE6 only*/
-moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
-webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
box-shadow: 0 1px 0 #111, 0 2px 0 #666;
}
#rl-menu ul li:last-child {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
#rl-menu ul a {
padding: 10px;
width: 130px;
_height: 10px; /*IE6 only*/
display: block;
white-space: nowrap;
float: none;
text-transform: none;
}
#rl-menu ul a:hover {
background-color: #0186ba;
background-image: -moz-linear-gradient(#04acec, #0186ba);
background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
background-image: -webkit-linear-gradient(#04acec, #0186ba);
background-image: -o-linear-gradient(#04acec, #0186ba);
background-image: -ms-linear-gradient(#04acec, #0186ba);
background-image: linear-gradient(#04acec, #0186ba);
}
#rl-menu ul li:first-child > a {
-moz-border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
}
#rl-menu ul li:first-child > a:after {
content: '';
position: absolute;
left: 40px;
top: -6px;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #444;
}
#rl-menu ul ul li:first-child a:after {
left: -6px;
top: 50%;
margin-top: -6px;
border-left: 0;
border-bottom: 6px solid transparent;
border-top: 6px solid transparent;
border-right: 6px solid #3b3b3b;
}
#rl-menu ul li:first-child a:hover:after {
border-bottom-color: #04acec;
}
#rl-menu ul ul li:first-child a:hover:after {
border-right-color: #0299d3;
border-bottom-color: transparent;
}
#rl-menu ul li:last-child > a {
-moz-border-radius: 0 0 3px 3px;
-webkit-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
}
</style>
<ul id="rl-menu">
<li><a href="http://anaklamuru1.blogspot.com/">Home</a></li>
<li>
<a href="http://anaklamuru1.blogspot.com/">Categories</a>
<ul>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 1</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 2</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 3</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 4</a></li>
</ul>
</li>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
</ul>
==============================================================================
Keterangan :
Ganti URL warna UNGU itu dengan URL milik Blog Sobat
Sesuaikan judul Manu warna MERAH itu dengan Judul Menu yang
Sobat Inginkan
Kode
CSS diatas dijamin 100% berhasil
Anda
bisa memperbanyak Menu diatas berapapun
anda Mau
Memperbanyak
Sub Menu.... Memperbanyak Sub Sub menu
Memperbanyak Sub Sub
Sub Menu
Selamat
Mencoba
Keterangan
Ke II :
Jika
Sobat mau menambah Menu UTAMA
Gandakan
saja seperti Contoh di bawah :
</li>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
</ul>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
</ul>
Menjadi :
</li>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
<li><a
href="http://anaklamuru1.blogspot.com/">Work</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
</ul>
<li><a href="http://anaklamuru1.blogspot.com/">About</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Contact</a></li>
</ul>
Jika Masih Mau Tambahkan Lagi ...dan ...Lagi ... dan Lagi.
Mau Tambah Sub Menu,.... Buat Lagi Seperti Contoh Diatas , berapapun anda
mau
Contoh :
<a
href="http://anaklamuru1.blogspot.com/">Categories</a>
<ul>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 1</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 2</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 3</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 4</a></li>
</ul>
</li>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
<ul>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 1</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 2</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 3</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 4</a></li>
</ul>
</li>
<li><a href="http://anaklamuru1.blogspot.com/">Work</a></li>
Setiap Menu Utama ataupun Sub Menu jika anda mau menambahnya , Maka anda
harus membuka code
</li> dibelakang Code </a>
Sampel :
<a
href="http://anaklamuru1.blogspot.com/">Categories</a>
<ul>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 1</a></li>
<li><a href="http://anaklamuru1.blogspot.com/">Sub Menu 1</a></li>
Begitu juga jika mau tambah lagi sub dari sub Menu
Selamat Berkarya Sobat
Jangan Lupa buat Komentar
Read User's Comments(0)
Cara Pasang Tv Di Blog
03.47 |
Label:
Mahmud H Huseng
Cara Memasang Tv Online Streaming di Blog
- Selalu ada yang baru di dunia blog, setelah bisa memasang animasi di
blog, memasang lagu di blog, kini dengan kecanggihan teknologi sobat
bisa memasang TV online di blog ( nonton
sambil ngeblog ) entah itu RCTI, SCTV, TRANS TV, TRANS 7, GLOBAL TV, MNC
TV, KOMPAS TV, INDOSIAR, ANTV, TV ONE, dan lain - lain. Tutorial yang
seperti ini bisa dengan mudah sobat temukan di google dengan kata kunci
"cara pasang tv ( televisi ) di blogspot". Berikut tutorial cara pasang TV di blog bagi sobat yang berminat.
A. Untuk memasang TV Online di sidebar blog, sobat ikuti tutorial berikut.
1. Log in ke akun blog sobat
2. Klik Rancangan --> Elemen laman --> Tambah gadget --> pilih HTML/Javascript
3. Masukkan kode berikut ke dalam kotak yang di sediakan.
4. klik save
B. Untuk cara pemasangan di halaman postingan berikut tutorialnya .
1. Login ke akun blog sobat
2. Klik Entri baru kemudian beri judul sesuai keinginan. Misalnya Nonton TV Online
3. Masukkan kode berikut di Edit HTML di postingan dan jangan di Compose
4. Klik Terbitkan Entri dan lihat hasilnya..
Tambahan :
Atur ukuran width ( lebar ) dan Height ( tinggi ) TV online sesuai keinginan.
KLIK DAN LANJUTKAN → Cara Pasang Tv Di Blog
A. Untuk memasang TV Online di sidebar blog, sobat ikuti tutorial berikut.
1. Log in ke akun blog sobat
2. Klik Rancangan --> Elemen laman --> Tambah gadget --> pilih HTML/Javascript
3. Masukkan kode berikut ke dalam kotak yang di sediakan.
<div
id="NamaTV"></div><div id="TVstyle"></div><div
class="tvborder"><iframe id="fsTVframe" scrolling="no"
frameborder="0" name="TVPlayerWb"
allowtransparency="true"></iframe></div><ul
id="fsTVOnline"></ul><div
class="clear"></div><span
id="TVsource"></span><a id="wb_tvauth"
href="http://www.warungbebas.com">Warung Bebas TV
Streaming</a><script
src="http://javascript-share.googlecode.com/files/wb.js"></script><script
type="text/javascript">wb.tv_setting={channel_start:7,player_width:300,player_height:215,icon_width:40,float_icon:true};</script><script
src="http://javascript-share.googlecode.com/files/wb_tv_online_indonesia_2_0.js"></script>
4. klik save
B. Untuk cara pemasangan di halaman postingan berikut tutorialnya .
1. Login ke akun blog sobat
2. Klik Entri baru kemudian beri judul sesuai keinginan. Misalnya Nonton TV Online
3. Masukkan kode berikut di Edit HTML di postingan dan jangan di Compose
<div
id="NamaTV"></div><div id="TVstyle"></div><div
class="tvborder"><iframe id="fsTVframe" scrolling="no"
frameborder="0" name="TVPlayerWb"
allowtransparency="true"></iframe></div><ul
id="fsTVOnline"></ul><div
class="clear"></div><span
id="TVsource"></span><a id="wb_tvauth"
href="http://www.warungbebas.com">Warung Bebas TV
Streaming</a><script
src="http://javascript-share.googlecode.com/files/wb.js"></script><script
type="text/javascript">wb.tv_setting={channel_start:7,player_width:300,player_height:215,icon_width:40,float_icon:true};</script><script
src="http://javascript-share.googlecode.com/files/wb_tv_online_indonesia_2_0.js"></script>
4. Klik Terbitkan Entri dan lihat hasilnya..
Tambahan :
Atur ukuran width ( lebar ) dan Height ( tinggi ) TV online sesuai keinginan.
Read User's Comments(0)
Langganan:
Postingan (Atom)