Template Blog Mirip Yahoo Keren merupakan template mirip-mirip yang kedua setelah Template Mirip Terselubung Paling Keren yang pernah saya bahas terdahulu. Template yang mirip yahoo ini merupakan template hasil karya dari Borneo Template yang merupakan blog yang sudah terkenal menyediakan template-template keren serta SEO (search engine optimazation).
Template Blog Mirip Yahoo ini Cocok sekali digunakan untuk blog yang berbasis Berita , Cerita , Pokoknya banyak deh , template ini juga mempunyai banyak fitur diantaranya fitur-fitur :
- Loading Ringan
- 3 Kolom sidebar di beranda
- 2 Kolom sidebar di postingan
- Design Elegan
- Kotak Search Besar
- SEO , anda juga bisa membuat templatenya seo di Cara Membuat Blog SEO Di Chkme.com
- Jika template ini ingin Valid HTML 5 silahkan simak di Cara Membuat Blog Valid HTML5 Lengkap
- Dan masih banyak lagi
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/AVvXsEhqw-txil6BXpwi4fI0_e20beDvNVbZPPSuglBcpcVH-5DMWEPmh4B3cEujluRJ20VN1VS1sb8SNvbtvF784of_4o7u3Z3qsBBeJnnUzg6pExlev64vX9_yJK03O_IYTWI2aZwC3CHBx9Wv/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/AVvXsEjHdD5ymCeNVVHssg8YDW5q-Sv7P3Y5bBenyW58jXQeG7_Udmc7EO4zY-9WdqcKuby_s5JKxhYhU4vAmMyn8Q3p67KAIZ6ag8Ldi-ZjDSzfrwnL-agjC5ND6plQxYkTyQnaR6ql6MvfMyGD/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/AVvXsEis8dYsWQoCMyhMjpHubtzFHR2oYHTz3QWR7qafFd5kQ7NEeCAn77COLiiPBjV4gEppZw1qIyylJHU2YaMeH6UwkycmEKc4EmuyNjCIGStZ6nbXKW_w0ErAMmR61UFg2jIuODSJlJYjXl2M/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/AVvXsEgSCgOcSr1rpT5y08Y0oESoMILUI_5p7-3RPeQP6Ge_8_qdUElAN4Z9kzDJarqRL4u8sZZ9YHV2hJ01x-82pAX_nDK9BJoavhbalQQqMgrZVfGbGf2Hpp1j7Pd6VOV4DnD3TG4vJpWCqXkR/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/AVvXsEiiAYoj0OtHOxGQ4T_0uCDc7fUfb48xjsI9hB3xf_gDi0Rv-f656m83Q3VXDxg3nNQA8hDKB4Eckqx0i3W_M8q9kYjz_H1XW7iI_thRMGAF5iquLexuC2TP68142RcXKgwRWKn6cMRgQ5AB/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
Keterangan : Berikut cara untuk menambahkan widgetnya :<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.
Password : | i-hat.blogspot.com |
0 Response to "Download Template Blog Keren Mirip Yahoo!"