Orange templates - Good template for tutorial

Thursday, November 18, 2010

I made a template name SimplexOrange . It was inspired by website www.fuelyourblogging.com . I modified in CSS and made it available in Blogger . It's look simple and clean ,a lot of space for advertising or widget . I think it's good for tutorial /sharing resource sites .




Live Demo | Download

Do you like it?
Here is my instruction to install this template :

1,Download this template

2,Open it in any word editor you have .

3,To change logo ,find this code

http://img196.imageshack.us/img196/2866/simplexorange.jpg"/>

link to logo is marked in bold . Change it to your logo's

4,To change content of bio-box at the bottom of each post ,find this code :

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4hzqBYdYo70P73XE_K3q7pwfupdgNuheL07MvNI9cN7vcJJSZgOInOAUzZg8EhqpYwzeMtwglohVYe0Pue0B2E-zsBdA01Q6J7rhwmev6vBU3Ad98VV4hwz2thyeocxQl0unuMo5ovzY/s45/hoa+s%25C6%25B0a.jpg"/>

NhamNgaHanh is the founder and editor in chief of SimplexDesign blog ,a blog on Blogger tips ,tricks ,designer resources and many premium Blogger templates for free use.

I marked link to author avatar and author short bio in bold . You can change as you want .

5,To change link in icons to your social network accounts ,find this code :

• 
  /feeds/posts/default">
  Site RSS
  
  



• 
  http://simplexdesign.blogspot.com/feeds/posts/default">
  Network Feed
  
  



• 
  http://twitter.com/dinhquanghuy">
  Follow on Twitter
  
  



• 
  http://facebook.com/simplexdesignblog">
  Fan Us on
  Facebook
  
  



• 
  
  Submit
  News
  
  



• 
  
  Write for Us
  
  

and change link in bold to yours .

6,To change twitter update to your account ,find this code :
dinhquanghuy" class="button">Follow on Twitter

<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/dinhquanghuy.json?callback=twitterCallback2&count=5"></script>
and change the text in bold to your twitter account .

7,Save template and upload it to Blogger .

8,Go to Dashboard ,click on menu widget to add link to your categories .

9,You can add your ads in topads widget ,you can also add the widget you want .

10,Save changes and you are done .

11,If you want to show your post in feature post section ,please add a label 'feature' to the post .

That's all for SimplexOrange template . I hope you like it .Remember to leave me comments ^^Thanks in advance .

Source: simplexdesign.blogspot.com

Read more »

A New Template For Magazine

Wednesday, November 17, 2010

After Simplex News,this is my second template for magazine .I named it Simplex Worldnews . It's a clear and eye-catching template ,designed base on grid .And it's easier to install and use than Simplex News .
This template support page function ,a new function of blogger ,it also reduce loading time and add more space to create ads and widget . You can adjust ,modify or remove existing widgets ,and you can add your own .
Now ,let's take a look on it

Live demo | Download

Note : There's an error with this template .When change url link in template file ,the right sidebar is moved to the left .I tried to fix this template ,and edited download link to newer version in this post . With this version ,you don't need to change url in template file ,it can get blog url automatically ,so you can configure for sections in homepage at Page elements


Install instruction for this template :
1,Download this template and unzip it .You get a template file in xml format and a folder of images .You can upload images in folder to a hosting service and change link of images in template file accordingly .
2,Upload this template to Blogger .
3,Go to Page elements :


4,To add logo ,click on edit link at logo widget and add your logo links like this :

logo should be 300x90 for the best appearance in template .

5,To add banner ,click edit link at banner widget and paste your ads code .Ads code could be adsense code ,code for images ads...

6,To add menu ,click edit link at menu widget and add link to menu . You can link to category in your blog or any outside link .

7,To show recent posts in categories in homepage (in live demo ,I showed the categories :world ,us ,health...) ,click on edit button at HTML/Javascript widget and enter content in structure below :
Widget title : enter the text you want to show in homepage to describe the category
widget content : enter the category (label) you want to show recent posts in .
For example ,I want to show recent posts under World label (category) ,I click on edit link in HTML/Javascript widget ,and enter the text in widget title :World and enter the text in widget content : world
.And you can see the result in Live demo: Recent posts under World label are shown .


8, In the sidebar ,paste the ads content for ads widget . Paste the video embed code for video widget .
9,Do as step 7 for left widget in sidebar .
10,Pages widget and footerpages widget don't need to install because it can get name and link to pages in your blog automatically .You can create page in Blogger Draft mode .
11,There are many "add a widget" link ,so you can add as many widget as you want to enhance blog operation .
12,This template can get feed link automatically ,so you don't need to change link in template file .

I hope you like this product of mine . Feel free to make question or comments here .
Enjoy it ^^

Source: simplexdesign.blogspot.com

Read more »

Enews Templates - template for news blog

Thursday, November 4, 2010

Update : If your slider can't work ,you can download the fixed version with download link provided in this post . You can see herefor solution if you don't want to re-install this template

Update 1: find this code

.pagenavi {

background:none repeat scroll 0 0 #F7F7F7;

border-bottom:1px solid #ECEDE8;

border-top:1px solid #ECEDE8;

color:#777777;

height:30px;

margin:0;

text-align:center;

width:100%;

}

and change it to

.pagenavi {

background:none repeat scroll 0 0 #F7F7F7;

border-bottom:1px solid #ECEDE8;

border-top:1px solid #ECEDE8;

clear:both;

color:#777777;

height:30px;

margin:0;

text-align:center;

width:100%;

}

Update 2:I made a F.A.Q for this template .The F.A.Q covered some troubles we met in using this template .You could take a look on it .I hope it will help you in using this template . Click here

I was inspired by two Joomla template : Worldnews (from Gavick) and Teline (joomlart) ,so I design this template . It's named Simplex Enews . It's clean and simple , widget and ads slot ready for you .
You can take a look on screenshot bellow

Live Demo | Download


Do you like it ? if you answer 'yes' and wanna install this template ,here is my instruction :

1,Download template file .

2,Open template in any word editor you have

3, To change logo ,find this code :

#image-logo a { background:url(http://img828.imageshack.us/img828/6954/simplexenews.png) no-repeat left -5px; width:300px; height:100px; text-indent:-5555em; overflow:hidden; }

and change the url of background image to your logo url

4, To change social network link ,find this code :

• http://feeds.feedburner.com/simplex">RSS
• simplex&loc=en_US">Email
• http://twitter.com/dinhquanghuy">Twitter
• http://www.facebook.com/contact.dinhquanghuy">Facebook

Change the links in href attribute to your social network account .
5,To show categories in homepage ,find this code

label1 = "world";
Title1 = "WORLD";

label2 = "US";
Title2 = "US";

label3 = "entertainment";
Title3 = "Entertainment";

label4 = "business";
Title4 = "Business";

label5 = "Sports";
Title5 = "Sports";

label6 = "tech";
Title6 = "Technology";

label7 = "Feature";
Title7 = "Feature";

label8 = "Topnews";
Title8 = "Latest News";

label9 = "headline";
Title9 = "Headline";

label10 = "editor";
Title10 = "Editor's picks";

label11 = "story";
Title11 = "Top Stories";
position of each label showed in picture bellow

You can change the value of each label from label1 to label11 to the category you want to show in homepage .For example ,you want to show the category 'world' in possition of label1 ,change the value of label1 to 'world' .
Or if you want to show category ' xyz ' to slider in homepage ( position of label7) ,just change the value of label7 to 'xyz' .
Title is the text that showed as title of category in homepage .Change it to what you want .

6, To add photos from your Flickr to blog ,just find this code :


and change the value of id from '37304598@N02' to your flickr account id .

7,To change the bio of writer

8,Go to Blogger Dashboard,continue to Page element .

9,To show category in navigation bar ,click on edit button on menu widget and add link to your category . Link to a category in Blogger has structure : "http://your blog. blogspot.com/search/label/your_category"
Do the same for category bar in footer and sidebar .

10,To add video ,click on video wiget ,and paste the embed code of video ,the size for video is 280x250 ,so you need to adjust your embed code for showing video at this size .

11,There are many ads widgets ,you can click on edit link in each widget for adding your ads code .

12,Save template and you are done .

Ps: many of my templates using fluid width ,so elements will be mess up if they have no content . I can use fixed size for making an element stick in a specific position ,but they won't show yours content enough if it longger than element size or size of browser windows are different .
So if you see your blog messed up after install ,pls make some content ,and it will show up .For example ,if your blog has only 6 post ,to see template in well condition ,pls add the same label to 6 posts ,and change value of all label variables (from label1 to label11) in step 5 to this label ,you will see elements in its position .
This way applied to all of my template if you see it messed up .

Note : if you don't see page navigation bar in bottom of category page (Newer posts,older posts,home) ... You can :
-Open template in word editor ,find '.pagenavi' and it will lead you to CSS code of page navigation bar ,add these attribute : text-align:center;clear:both;
-Find

and delete id='blog-pager' to

I also change download link to fixed version .

Read more »