Finally after some days I'm really happy to release for my readers this new blogger template: Typoork. Typoork is a clean and professional Blogger template totally free and highly customizable. It supports inline comments form, delicious and retweet counters in each post.
How I said, this template is totally free! The only thing I ask you is please don't remove the link to Woork in the footer. Take a look at this preview:
Disclaimer
PLEASE, READ THIS! This is an highly customized Blogger template which I suggest to use only if you have familiarity with HTML, CSS and Blogger. Before to make changes on your actual Blogger template, save a copy of your template on your local hard disk, so, if something go wrong with the update, you can restore it. Take a mind, if you use custom Widgets on your actual Blogger template, they will be removed using this template. I'm not responsible for eventual problems. Ok? :)I provide HTML instead XML code because in this wat you can modify this template simpler if you use an wysiwyg like Dreamweaver.
Blog title
Find this code and change the content into the tag title with the title of your blog:<b:if cond='data:blog.pageType != "item"'>
<title>Typoork | A clean, professional and free Blogger Template</title>
<title>Typoork | A clean, professional and free Blogger Template</title>
Customize the header
Find this code and change the comment "Your logo here" with some line of HTML code for example adding a logo, adding some links a background image, etc:<div id="typoork-header">
<!-- Your logo here -->
</div>
<!-- Your logo here -->
</div>
About me
"About me" is the section where you can add a short description about you, your blog and add some links to your main social identities (in this case I addedd Facebook and Twitter by default).Find this code to customize your social identity links:
<a href='#'>Facebook</a> | <a href='#'>Twitter</a>
...and change '#' with your Facebook and Twitter profile link.
Then, find the following code and add a picture of you and a short description about your blog.
<!-- ABOUT ME -->
<div class="sidebar-section" style="background:#EFEFEF; padding:8px;">
<img src="#" class="profileImage"/>
Add a short description of you here
<div class="spacer"></div>
<div class="sidebar-section" style="background:#EFEFEF; padding:8px;">
<img src="#" class="profileImage"/>
Add a short description of you here
<div class="spacer"></div>
You can also add your picture in the section above comments:
Find this code and replace "#" with the link to your image:
<img src="#" style="padding:4px; background:#FFFFFF;"/>
Feed RSS links
Find this code and change '#' with the link to your Feed RSS file:<!-- FEED RSS -->
<h3>
<span class="feed-small-right">
<a href='#'>Subscribe now!</a>
</span>Feeds RSS</h3>
<div class="section-links">
<a href='#'>Subscribe to my RSS Feeds</a>
</div>
<h3>
<span class="feed-small-right">
<a href='#'>Subscribe now!</a>
</span>Feeds RSS</h3>
<div class="section-links">
<a href='#'>Subscribe to my RSS Feeds</a>
</div>
I suggest you to use Feedburner to manage your feeds RSS. It's perfectly integrated with Blogger and simple to use.
Latest posts
You may active a Feedburner account to display your latest post list. In your FeedBurner account login, click on "Publicize" tab and select "BuzzBoost" service. Follow instructions on the page and substitute BuzzBoost code into the section highlighted in bold:<!-- Latest Post -->
<h3>Latest posts</h3>
<div class="section-links">
<div class="spacer"></div>
<ul style="margin:0; padding:0; border:0;">
<li><a href="#">Your link 1 here</a></li>
<li><a href="#">Your link 2 here</a></li>
<li><a href="#">Your link 3 here</a></li>
<li><a href="#">Your link 4 here</a></li>
</ul>
</div>
<h3>Latest posts</h3>
<div class="section-links">
<div class="spacer"></div>
<ul style="margin:0; padding:0; border:0;">
<li><a href="#">Your link 1 here</a></li>
<li><a href="#">Your link 2 here</a></li>
<li><a href="#">Your link 3 here</a></li>
<li><a href="#">Your link 4 here</a></li>
</ul>
</div>
...Feedburner code it's something like this:
<script src="http://feeds2.feedburner.com/Woork?format=sigpro" type="text/javascript" ></script>
Add new section in the sidebar
In the sidebar you can add new sections like the following (Hot links) simply adding this code:<!--Hot links -->
<h3>Hot links</h3>
<div class="section-links">
<div class="spacer"></div>
<ul style="margin:0; padding:0; border:0;">
<li><a href="#">Your link 1 here</a></li>
<li><a href="#">Your link 2 here</a></li>
<li><a href="#">Your link 3 here</a></li>
<li><a href="#">Your link 4 here</a></li>
</ul>
</div>
<h3>Hot links</h3>
<div class="section-links">
<div class="spacer"></div>
<ul style="margin:0; padding:0; border:0;">
<li><a href="#">Your link 1 here</a></li>
<li><a href="#">Your link 2 here</a></li>
<li><a href="#">Your link 3 here</a></li>
<li><a href="#">Your link 4 here</a></li>
</ul>
</div>
You can customize sections how you prefer, adding link, images and external widget (MyBlogLog, Google FriendConnect, etc)
That's all! For your feedback about this template, please leave a comment! Thanks :)
No comments:
Post a Comment