Saturday, February 9, 2019

√ Cara Menciptakan Sajian Dan Sub Sajian Di Blog

Assalamualaikum.
ini yaitu cara menciptakan sajian dan sub menu, bagi kau yang template blognya tidak ada kemudahan sajian dan sub menu, kau dapat membuatnya sendiri.

1. masuk ke blog

2. design > tata letak

3. add gadget > HTML j4vascript

4. dan pastekan isyarat berikut ;

<style type='text/css'>

ul#topnav {margin: 0; padding: 0;float: left;width: 900px;list-style: none;position: relative;font-size: 1.2em;background: #383838;}ul#topnav li {float: left;margin: 0; padding: 0;border-right: 1px solid #fff;}ul#topnav li a {padding: 10px 15px;display: block;color: #f0f0f0;text-decoration: none;}ul#topnav li:hover { background: #1376c9 url() repeat-x; }ul#topnav li span {float: left;padding: 15px 0;position: absolute;left: 0; top:35px;display: none;width: 100%;background: #1376c9;color: #fff;-moz-border-radius-bottomright: 5px;-khtml-border-radius-bottomright: 5px;-webkit-border-bottom-right-radius: 5px;-moz-border-radius-bottomleft: 5px;-khtml-border-radius-bottomleft: 5px;-webkit-border-bottom-left-radius: 5px;}ul#topnav li:hover span { display: block; }ul#topnav li span a { display: inline; }ul#topnav li span a:hover {text-decoration: underline;}</style><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js' type='text/j4vascript'/><script type='text/j4vascript'>$(document).ready(function() {

$(&quot;ul#topnav li&quot;).hover(function() { //Hover over event on list item$(this).css({ &#39;background&#39; : &#39;#1376c9 url() repeat-x&#39;}); //Add background color + image on hovered list item$(this).find(&quot;span&quot;).show(); //Show the subnav} , function() { //on hover out...$(this).css({ &#39;background&#39; : &#39;none&#39;}); //Ditch the background$(this).find(&quot;span&quot;).hide(); //Hide the subnav});

});</script>
<ul id="topnav">

<li><a href="https://plus.google.com/110444695860771660646/posts">Profile</a></li><li><a href="#">Tips</a><span><a href="http://justhendrious.blogspot.com/search/label/Tips%20Komputer">Tips Komputer</a> |<a href="http://justhendrious.blogspot.com/search/label/Tips%20Blog">Tips Blog</a> |<a href="http://justhendrious.blogspot.com/search/label/Tips%20twitter">Tips Twitter</a> |
<a href="http://justhendrious.blogspot.com/search/label/Tips%20tips%20Menarik">Tips Menarik</a>

</span></li><li><a href="#">My Site</a><span><a href="http://www.facebook.com/hendrisetiawan17">My Facebook</a> |<a href="http://www.twitter.com/3hendrisetiawan">My Twitter</a> |<a href="https://plus.google.com/110444695860771660646/posts">My Google+</a><a href="http://allfreetips4u.blogspot.com/search/label/Link Exchange">My Youtube</a><a href="#">MooTools</a></span></li><li><a href="#">Favorite Site</a><span><a href="http://www.topskor.com">Topskor</a> |<a href="http://www.goal.com">Goal Com</a> |<a href="http://www.bola.net">Bola net</a> |<a href="http://www.fcbarcelona.com">Fc Barcelona</a> |<a href="http://www.ipa5cablak.blogspot.com">IPA 5</a>
</span></li><li><a href="#">Makalah</a><span><a href="http://justhendrious.blogspot.com/search/label/Makalah%20sekolah">Makalah Sekolah</a> |<a href="http://justhendrious.blogspot.com/search/label/Makalah%20Kuliah">Makalah Kuliah</a> |<a href="http://justhendrious.blogspot.com/search/label/Contoh%20Laporan%20Pramuka">Laporan Pramuka</a>
</span></li><li><a href="#">Foto</a><span><a href="http://justhendrious.blogspot.com/search/label/Galeri%20Foto%20Liburanku">Galeri Foto Liburan</a> |<a href="http://justhendrious.blogspot.com/search/label/Galeri%20foto%20pramuka">Galeri Foto Pramuka</a> |<a href="http://justhendrious.blogspot.com/search/label/masa%20masa%20sma">Galeri Foto SMA</a> |<a href="http://www.fcbarcelona.com">Fc Barcelona</a> |<a href="http://s1262.photobucket.com/albums/ii615/HendriSetiawan17">PhotoBucket</a>
</span></li><li><a href="#">Download</a><span><a href="http://www.stafaband.info/d0wnl0ad-lagu-mp3-gratis.html">MP3</a> |<a href="http://sinema31.com">Film</a> |<a href="btemplates.com">Template Blog</a> |<a href="http://www.dytoshare.us">Sofware</a> |<a href="http://www.gametop.com/">GAME</a>

</span></li></ul>


5. dan simpan, lihat hasilnya.

catatan : kau harus mengubah ;
              - isyarat warna kuning adalah sajian anchor text yang harus kau ubah
              - isyarat warna hijau adalah Link sajian anchor text
              - isyarat warna merah adalah sub sajian anchor text
              - isyarat warna biru yaitu Link sub sajian anchor text
Sumber http://www.hendrisetiawan.com