Wednesday, March 28, 2012

dNoteBook Blogger template



  // Buzz it


Free Blogger template with right sidebar: 2 columns, brown, gray, blue and white colors, widgets ready, Search box, Pages, RSS and Twitter buttons in header, places for banners, Adsense ready, etc.

1. How to install?

Extract Blogger Template - springloaded.zip
After login, goto Layout > Edit HTML > Browse > choose Blogger Template - dNoteBook-blogger-template.xml > Upload > Save Template


2. Date

After login, goto Layout > Page Elements > edit Blog Posts > change time format to long date (e.g Tuesday, May 12, 2009). Remember, change time format NOT date format.


3. Blog description

After login, goto Layout > Edit HTML > fin these codes


<title><data:blog.pageTitle/> | Here goes my blog description</title>

To change the description, replace "here goes my blog description" by your blog description.


4. Logo

Fin this code

<div class='logo'><a expr:href='data:blog.homepageUrl'><img alt='' border='0' height='50' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWEedT-wQYKxo_B7XGGoH9cuierJr9n3iaf3gv7U1nPPlXf7CV88aDfE4-2Uhr11cSDtcfw8mtWSxEPYkYZFCQcFlzfbpDsMF4Y899iP4HsJz-SwEA-U4SdYEKm58JZefI4In66Rj-XPl-/s1600/logo2.png' title='Home' width='300'/>
</a>

Change the image url of this code by the url of your logo. You have psd and jpg logo in the zip file that you can edit to suit to your blog.


5. Twitter and Feed

Find these codes


<span style='margin-left:110px;'><a href='http://www.twitter.com/rodval4ever' target='_blank'><img alt='Follow me on Twitter' border='0' height='80' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifP0tIK4fiawe4szAAJ-JjUchoS1o7QAI5tnwbasSxagcGubByebOrMoe7c7LdMbwEbT-NKZReZ7ahZalBf3-N6L-n-MlEIBnGR2fhK3aH-XLYrSgL10PacajXcfThRVZtomcwCIeIf4Az/s1600/twitter.png' title='Follow me on Twitter' width='80'/>
</a> <a href='http://feeds.feedburner.com/BloggerMastering'><img alt=' FEED' border='0' height='80' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpQ0bs2llkC57L8lih881Gn87PUd6Qy-8LSLIxguQM2tsVECDoUupQtdPakaTIdyr8e2E-M0H8dlqSIcwlaAbG1J3EUnW7Zw0dUTztgo8Pjkra-Zog8AyWSL0BNScoFcQdqPwJ5jNAmUil/s1600/rss.png' title=' FEED' width='80'/>
</a></span>

Replace twitter and Feedburner url by your twitter and feed url.

If you want to have the search logo wich is bugging on Chrome, just add this code before </div><!-- End logo -->

<span style='margin-left: 120px;'><img alt='search' border='0' height='80' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv0RQ1m2A7BSwA5-x0QQoO6SSqzyHLMABdXfVWMymqDV-svhJWCMwzRpyNMgL1wD5nA_yV0YNhsFQA-tVDRLCted9mdgcFDtuQIC3h66kuq_Un-d9pdKB5B6l_Bt4NFvuKuf8-4D4pSbck/s1600/sicon.png' title='search' width='80'/></span>


6.Navigation 

Find these lignes and put your info on 

<ul id='dropmenu'>
<li><a href='' title='Home'>Home</a></li>
<li><a href='' title='About'>About</a></li>
<li><a href='' title='Original'>Original</a></li>
<li><a href='' title='Contact'>Contact</a></li>
            <li> </li></ul>

7. Footer 

The 3 columns footer can be found with this code. Change the titles colums, add links and change links texts. 

<div id='footer-box1'>
<h2>Column 1</h2><hr/>
<ul>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li> 

</ul>
</div>


<div id='footer-box2'>
<h2>Column2</h2><hr/>
<ul>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>   
</ul>
</div>


<div id='footer-box3'>
<h2>Column 3</h2><hr/>
<ul>

<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>
<li><a href=''>Link text</a></li>                
</ul>
</div>



Enjoy !

No comments:

Post a Comment