always admire unique design. I've converted it to blogger template. Here's the screenshoot
Setting and installation
Go to Setting>Formatting>Timestamp Format
Choose this format, example : Sunday, 28 February 2009.
Go to Layout>Edit HTML. Check on Expand Widget Template checkbox
Header Setting
Preparing your own image header size 496x109 pixel, upload to your own imagehosting such as photobucket.com
a. Edit this Code
#headerimg {
padding-left:40px;
margin: 0;
width: 45%;
height:111px;
float:left;
background:transparent url(http://YOUR-LINK-HEADER-IMAGE-HERE) no-repeat left;
}
and then
<div id='header'>
<div id='headerimg'>
<h1><a expr:href='data:blog.homepageUrl'/></h1>
<div class='description'>YOUR-BLOG-DESCRIPTION-HERE</div>
</div>
Toplinks Setting
Toplinks contain home, RSS, contact link element.
Edit this code
<div class='toplinks'>
<a expr:href='data:blog.homepageUrl'>Home</a>
<a class='topnav_rss' href='http://YOUR-FEED-HERE'>RSS</a>
<a class='topnav_contact' href='YOUR-CONTACT-HERE'>Contact</a>
</div>
Navigation Bar Menu
Edit this code
<div id='NavbarMenu'>
<div id='NavbarMenuleft'>
<ul id='nav'>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li>
<a href='http://YOUR-LINK-HEADER-IMAGE-HERE ttp://'>Sample Page</a>
</li>
<li><a href=' http://YOUR-LINK-HEADER-IMAGE-HERE '>Sample Post</a></li>
<li><a href=' http://YOUR-LINK-HEADER-IMAGE-HERE '>Blog Page</a></li>
</ul>
</div>
Bottom Menu Setting
Edit this code
<div id='creditright'>
<ul id='cred'>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li>
<a href='http://YOUR-LINK-HEADER-IMAGE-HERE ttp://'>Sample Page</a>
</li>
<li><a href=' http://YOUR-LINK-HEADER-IMAGE-HERE '>Sample Post</a></li>
<li><a href=' http://YOUR-LINK-HEADER-IMAGE-HERE '>Blog Page</a></li>
</ul>
</div>
Kamis, 23 Desember 2010
Cara Membuat Horizontal Menu Dropdown
Membuat Horizontal Menu Dropdown, pada posting sebelumnya saya telah membahas Tentang Artikel ini yaitu Cara Membuat Horizontal Menu Dropdown . penjelasan berikut:
1. Silahkan Login Blogger
2. Langsung menuju Edit HTML
3. Jangan lupa Backup Template anda terlebih dahulu
4. Contreng Expand Widget Template
5. Cari kode ]]></b:skin> dan letakkan kode berikut sebelum kode ]]></b:skin>
1. Silahkan Login Blogger
2. Langsung menuju Edit HTML
3. Jangan lupa Backup Template anda terlebih dahulu
4. Contreng Expand Widget Template
5. Cari kode ]]></b:skin> dan letakkan kode berikut sebelum kode ]]></b:skin>
Langganan:
Postingan (Atom)