Jadi Apa bedanya Diatas Sama yang Di Bawah
Untuk melengkapi tampilannya, diperlukan Widget - widget yang mirip seperti situs Yahoo!. Berikut ini kode - kodenya :
1. Search Engine
<div style='font:normal 12px arial;padding-left:5px;height:23px;'>
<strong><i>Hi, guest<strong></strong></i> ! </strong> welcome to <strong>Yahoo!</strong>. | <a href='#'>About Us</a> | <a href='#'>Contact</a> | <a href='http://www.blogger.com' title='registered now for free account'>Register</a> | <a href='http://www.blogger.com' title='sign in to blogger to share'>Sign In</a></div>
<form action=' /search' class='searchform' method='get'>
<input class='searchfield' id='q' name='q' onblur='if (this.value == "") {this.value = "";}' onfocus='if (this.value == "") {this.value = ""}' type='text' value=''/>
<input class='searchbutton' type='submit' value=''/>
</form>
2. Slideshow
<div id="gal1" class="img400">
<div class="h250"><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEsfnsCb_to8Z0HiV_CcETvFXFWjEV-xWdhAUwApQZl0S55dfflS-u7s7QFCETVMb6j8Pc2NGK1YGjKzk7F24n8g1dKSHPStStuciLPnNkOzgld8hZCb68ofIPpUbVX7QYoqVLf4q3H3ug/s1600/lorem+ipsum2.jpg&cat=1&pid=210 7&cache=false" /></div>
<div class="min250">
<div style="margin-top:168px;" class="des_4"><strong>Yahoo! Indonesia</strong></div>
<div class="des_1 font16 c_white"><a href="http://tutorial-blogz.blogspot.com"><strong>Read the Yahoo! Indonesia</strong></a>
</div>
</div>
</div>
<div id="gal2" style="display:none;" class="img400">
<div class="h250"><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT1bY2y78do8N3fRFcKk-sfXYOC826j7QHj75f6viBsKli_Xs8GAopB_lZnjOks53vGuPLKKXKEMiV5F7M1cRwlujutcLeBZOi9GFPArUQbzkYuSndrNut0zQJxK9oNF2ARE6cWtXQzA-H/s1600/What+is+a+Blog.jpg&cat=1&pid=2107&cache=false" /></div>
<div class="min250">
<div style="margin-top:168px;" class="des_4"><strong>BASIC KNOWLEDGE</strong></div>
<div class="des_1 font16 c_white"><a href="http://tutorial-blogz.blogspot.com"><strong>Basic knowledge, what is a Blog ?</strong></a>
</div>
</div>
</div>
<div id="gal3" style="display:none;" class="img400">
<div class="h250"><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7JyRm_YjV2-QbmbRaq2CYHxAdFiBQHkrF8ABVR2jHZlZawXfzn7WYYuos8qlw3zR4TXGT7y9Ryw9MhxhFBONhkpZ32wkv6INhcizwGWyYBfN2gdoKm_3lcnsxwtxTfdrunZUGZ9Qx_pNI/s1600/Lionel+Messi.jpg&cat=1&pid=2107&cache=false" /></div>
<div class="min250">
<div style="margin-top:168px;" class="des_4"><strong>SPORT NEWS</strong></div>
<div class="des_1 font16 c_white"><a href="http://tutorial-blogz.blogspot.com"><strong>Lionel Messi, the legend of the future football</strong></a>
</div>
</div>
</div>
<div id="gal4" style="display:none;" class="img400">
<div class="h250"><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG_pgAoB376NBzoZtfBvcjueq8Y0nwUJdPrp1Cc0vX0hLMNtC85TPlY4YGrzU1Zr_e2qqYq_N71z2TQihhh_YUJmVtP3SsMlRYKaL_Do8zPbUop8z1ABvkZv36TZNhjUYv8HYo__S2hxQm/s1600/Font+Style.jpg&cat=1&pid=2107&cache=false" /></div>
<div class="min250">
<div style="margin-top:168px;" class="des_4"><strong>FONT STYLE</strong></div>
<div class="des_1 font16 c_white"><a href="http://tutorial-blogz.blogspot.com"><strong>The Quick Brown Fox</strong></a>
</div>
</div>
</div>
<div id="gal5" style="display:none;" class="img400">
<div class="h250"><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizdsfcOwhDmpBZNBjRIAkMYSGqJqROGs4_LLo3Jb-Jtd9MnOFrqmTugMZl6TeXBW8dzclH9RWpbGGZiP-GN2S35SalRnRfnEqcbPCdQZRycFwwzQixGxNN18lGRvS6mmq6jEE3GTdu7Vhv/s1600/Google+Office.jpg&cat=1&pid=2107&cache=false" /></div>
<div class="min250">
<div style="margin-top:168px;" class="des_4"><strong>MAKE MONEY</strong></div>
<div class="des_1 font16 c_white"><a href="http://tutorial-blogz.blogspot.com"><strong>Monetize your site with Google Affiliate Network</strong></a>
</div>
</div>
</div>
<div style="height:250px; margin-top:-250px;"><div id="galtabs" class="page_hl pd_5"><a href="#" rel="gal1">1</a> <a href="#" rel="gal2">2</a> <a href="#" rel="gal3">3</a> <a href="#" rel="gal4">4</a> <a href="#" rel="gal5">5</a> </div></div><div class="clearit"></div>
<div class="clearit pb_10"></div>
<script type="text/javascript">
var myheads=new ddtabcontent("galtabs");myheads.setpersist(false); myheads.setselectedClassTarget("link");myheads.ini t(5000)
</script>
3. Menu Blog
<div id='sidebarnavigation'>
<ul>
<li class='about'><a href="#"/>About Us</a></li>
<li class='contact'><a href="#"/>Contact Us</a></li>
<li class='facebook'><a href="#" target="_blank"/> Facebook</a></li>
<li class='twitter'><a href="#" target="_blank"/> Twitter</a></li>
<li class='email'><a href="#" target="_blank"/> Email</a></li>
<li class='video'><a href="#" target="_blank"/> Video</a></li>
<li class='music'><a href="#" target="_blank"/> Music</a></li>
<li class='download'><a href="#" target="_blank"/> Download</a></li>
<li class='data'><a href="#" target="_blank"/> Data</a></li>
<li class='rss'><a href="#" target="_blank"/> RSS Feed</a></li>
<li><a href='#'>Archieves</a></li>
</ul>
</div>
<div style='font:bold 11px arial;float:right;line-height:1.4em;padding:5px 10px;color:#333;'>
<a href='http://tutorial-blogz.blogspot.com'>More CATEGORIES »</a>
</div>
4. Favorit Saya
<div id='sidebarnavigation'>
<ul>
<li class='msn'><a href="#"/>Msn</a></li>
<li class='yahoo'><a href="#"/>Yahoo</a></li>
<li class='blogger'><a href="#" target="_blank"/> Blogger</a></li>
<li class='gmail'><a href="#" target="_blank"/> Gmail</a></li>
<li class='bing'><a href="#" target="_blank"/> Bing</a></li>
</ul>
</div>
<div style='font:bold 11px arial;float:right;line-height:1.4em;padding:5px 10px;color:#333;'>
<a href='http://tutorial-blogz.blogspot.com'>More FAVORIT »</a>
</div>
- Login ke Blogger
- Pilih Layout
- Klik Add a Gadget
- Pilih HTML/JavaScript
- Masukkan kode widgetnya
- Save.
Written by Link-Crash
We are Creative Blogger Theme Wavers which provides user friendly, effective and easy to use themes. Each support has free and providing HD support screen casting.
0 komentar:
Posting Komentar