Starting Your Own Blogger Template

>> Browse templatesMoney tips50 comments

Blogger Template Design: Tutorial 11

Now that you've gone through all the tutorials, you're pretty much ready to start designing your own template. In this guide, I'll show you the big steps that you have to go through to make a template the fast and easy way.

The first thing you need to understand about designing a template is that the technique of designing is unique and different between individuals. In the end, it's entirely up to you how you want to do it - if and only if you're familiar and have made a few templates yourself. But if you're just beginning, it's best to follow a step-by-step guide to expedite the process and so that you won't get lost.


Step 1 - Choose an already-made template as a starting point:

For beginners, the easiest and fastest way to start designing is by starting from an existing template. But don't do it with the intention of plagiarizing it! Read more in the sub-post Start Designing from an Existing Template.

Step 2 - Setting the number and location of your sidebar columns:

If you're a beginner, make sure you start with a template that closely resembles the template that you have in mind. For example, if you want to do a 3-column template, don't start with an existing 2-column template. Or, if you want to change or add more sidebars yourself, read more about how to do it in Tutorial 10: Making a 3-Column Template and More ...

Step 3 - Setting the width of your template:

The first thing you need to do after getting a starting template is to set the width of your template. To do this, you need to set the width in the CSS Style code. It's all explained in detail in Tutorial 7: Setting the Template Size. The common containers to set the widths are:
  • body
  • outer-wrapper
  • content-wrapper
  • header-wrapper
  • main-wrapper
  • sidebar-wrapper (or sidebar1, sidebar2, and so on)
  • footer-wrapper
You can either set the width to be fluid (changes its width accordingly with the browser or screen size) or set the width to be fixed. Note that setting the width inside the container-wrapper can be a bit tricky because you have the Main and Sidebar containers in it. If the width is not set well, the Sidebars can fall below the Main container.

Step 4 - Build test objects:

If you're designing a new template, how do you know that what you're tweaking is right if you can't see the changes? So, what you need to do here is build some test objects - for example post 3 or more test posts that have a quote, a numbered list, un-numbered list, make lots of widgets to see how the sidebars look like, make sure you have some Labels to show up in your Labels widget, make some test comments to see how they look, and so on.

Step 5 - Tweaking the CSS code to customize your blog's appearance:

Here is where you start tweaking the CSS code to customize the basic layout of your blog and slowly refining it until you have the template that you want. It's a process that keeps you going back and forth re-tweaking codes because you won't usually get things perfect the first time. Read more detail in the sub-post Tweaking the CSS Code.

Step 6 - Testing in other browsers:

This step can get really annoying, but like they say, you've got to do what you've got to do. Read more in the sub-post Testing and Viewing in Other Browsers.

Step 7 - Using images as background:


If you're bored of using plain color, you can use nicer images as the background of the whole blog or the background of some of the containers (e.g. the Post, Sidebar, Footer, Header, etc). To learn how to do this, click on Tutorial 12: How to Embed Images as Background.

Step 8 (The Final Step) - Finalizing your template:

This step is like the proof-reading stage of your writing. You just need to go through one last step to double check that everything works fine and okay. Look at your blog carefully and see if some minor tweaking will make it look better.

50 comments:

Amy S. December 10, 2008 12:49 pm  

Your tutorials are fantastic! Love them - I learned so much and built my blog using one of your templates.
My only problem is I can't get the comments to work - I've tried reloading the blog, tried other templates and still the comments section won't work...any help would be really really appreciated!
http://thursdaymorningmemories.blogspot.com
Thank you!

Alyssa is the Queen. July 25, 2009 6:48 pm  

i am hopeless. i can't figure this shizz out for the life of me. i want a pretty blog and its just fugly. help please :)

Pree Badozz December 02, 2012 12:06 am  

Your tutorials are very clear. I am a beginner blogger, although I did not read all your tutorials from the first to the last, but I can take some important conclusions on how to make blogger templates.

Frankly I was bored with the existing blogger templates, therefore I would like to create my own templates.

1000 Thanks.

ahmed sky March 02, 2013 4:27 pm  

hi
thanks for tutorial

i want know that if its necessary to learn xml in order to make blog tamplate ???

InnomaxMediaLLP May 24, 2013 2:09 am  

I agree with you. This post is truly inspiring. I like your post and everything you share with us is current and very informative, I want to bookmark the page so I can return here from you that you have done a fantastic job
Web Designer

chenmeinv0 March 31, 2017 11:59 pm  

ray ban outlet
hermes handbags
cheap ray bans
michael kors outlet
polo ralph lauren
coach outlet
le coq sportif shoes
ray ban eyeglasses
adidas originals superstar
new balance shoes
hzx20170401

candy lol May 11, 2018 1:29 pm  

I love all the posts, I really enjoyed, I would like more information about this, because it is very nice., Thanks for sharing.
Happyroom2.com Tosstheturtle.net Catmariogame.com

candy lol May 11, 2018 1:29 pm  

An excellent information provided thanks for all the information i must say great efforts made by you. thanks a lot for all the information you provided.
slitheriounblocked.net slitherioprivateservers.com Clickerheroes2.co

Awe Tech Water Purifier August 01, 2018 3:21 am  

Good stuffs from this blog I got very interesting points in this article

Julie T. Kirwan September 06, 2018 10:04 pm  

baseball star mod terraria apk download monster legends mod

ana smith October 08, 2018 1:45 am  
This comment has been removed by the author.
ana smith October 08, 2018 1:46 am  

try to play unblocked games 77

Live PSL Digital March 05, 2019 9:01 pm  

myboyapkz.com updates

Mohamed Abdellatif March 05, 2019 11:00 pm  

تميزت شركتنا فى تقديمها لخدمات مكافحة الحشرات ورش المبيدات باعتمادها على افضل انواع المبيدات الامنة كليا والتى تقوم باستيرادها ووفقا لذلك تجربتها من قبل خبرائنا لضمان صحتها على صحة عملائنا فنحن مؤسسة مكافحة حشرات بحائل نحرص طول الوقت على ان تكون مبيداتنا امنة لا تؤثر بالسلب ولو كان طفيف علىصحتكم وعلى الحيوانات المنلية ان كنتم من مقتنيها باستعمال أجدد أساليب المكافحة الكيميائية منها والبيولوجية لضمان ابادة ختامية للحشرات التى تزعجكم وضمان عدم عودتها مرة اخرى .
شركة مكافحة حشرات
شركة مكافحة حشرات بحائل
شركة مكافحة النمل الابيض بحائل
شركة رش مبيدات بحائل

Frp Bypass March 15, 2019 1:17 am  

best version of frp bypass tool apk

Ahmed Hamdy March 20, 2019 6:16 am  

- لما تختاروا موضع للتلفزيون اختاروا موضع غير مواجه للنافذه ( الشباك ) لانه راح يعكس اشعة الشمس وبذلك راح تكون في صعوبه برؤية التلفاز نهارا .
شركة نقل عفش
شركة نقل عفش من الرياض الى الاردن
شركة نقل اثاث من الرياض الى الاردن
شركة نقل عفش بالقصيم

meliodas April 27, 2019 1:00 am  

Don't worry and just go, because there will be me there.
geometry dash
five night at freddy's

ภาษาอังกฤษ June 29, 2019 2:02 am  

สล็อตออนไลน์
โกลเด้นสล็อต
goldenslot
golden slot

Quickbook Support July 02, 2019 10:33 pm  

Quickbook is used widely as accounting software for managing transaction and invoices of your Company. this is very helpful for small-medium sized business. if you are using Quickbooks and facing any error then you can contact Quickbooks Support for help. They will assist you to solve this issue.

meldaresearch July 10, 2019 6:24 am  

One should know which company has the best writers whose essay is free from grammatical errors. Grammatical errors reduce the quality of a custom paper especially those who want to pre written research paper and those seeking for custom assignment services.

Mia Rose July 12, 2019 2:53 am  

thanks for this post, this is really useful for the guys who are ready to go .


Thanks for kind approach of QuickBooks Support Phone Number
team

accounting support services July 15, 2019 10:09 pm  

QuickBooks is the most extreme eminent bookkeeping application in the market today. Everybody realizes that Intuit QuickBooks is very popular for creating and structuring adaptable duty and bookkeeping programming that defends complex errands to release business efficiency. Yet, it is additionally obvious that the work area variant of QuickBooks has some substantial restrictions, which make it difficult for organizations to follow the supportable development. In my estimation, organizations need to change to the cloud-based QuickBooks Support so as to profit propelled highlights, upgraded security, and compactness.Our toll free no - +1(888)253-0666
Visit : Quickbooks customer support

Rajan July 23, 2019 3:08 am  

Tree Hotel blends a heat up to date vogue with colonial touches to form a cushy feeding area within which to relish the North West Indian cooking. you will find all the Indian classics you'd expect beside some tempting specialties from regions like Punjab, New Delhi and Haryana. It's one in every of the most effective eating housewith friendly, attentive employees and therefore the food is usually glorious. there is lots on the menu for carnivores and vegetarians alike and kids ar welcome too. This eating house is handy for lunch if you're reaching to Iffley village.
Hotel oxford
Indian Restaurant Oxford
oxford curry house

Unknown July 26, 2019 12:58 am  

QuickBooks POS can undergo with QuickBooks Error 1712. This can be handled by QuickBooks POS Support.
https://qbpremiersupport.com/quickbooks-pos-support-number/

Unknown July 26, 2019 3:27 am  

QuickBooks Payroll Error 30159 is a QuickBooks Payroll error; Call our QuickBooks Payroll Support Phone Number.
https://qbpremiersupport.com/quickbooks-payroll-support-number/

Unknown July 26, 2019 3:40 am  

Ring our QuickBooks Online Support Phone Number and get yourself relieved of QuickBooks Error 2000.
https://qbprosupport.com/quickbooks-online-support-number/

Unknown July 26, 2019 4:23 am  

Utilize QuickBooks File Doctor to handle QuickBooks Error 6000. You can fix QuickBooks Error 6000.
https://qbprosupport.com/quickbooks-file-doctor/

Unknown July 26, 2019 5:23 am  

QuickBooks Support is generally required by the users of QuickBooks. There are number of errors with which QuickBooks has to go through while operating it. In that situation, call our QuickBooks Support.
Call our QuickBooks Support Number to resolve your QuickBooks errors.
https://accountxpert.com/quickbooks-support/

Quickbooks Customer Service July 31, 2019 6:05 am  

QuickBooks Customer Service is available round the clock to resolve accounting problems. Reach experts at QuickBooks Customer Service Number and get instant help.

Quickbooks support August 13, 2019 12:17 am  

We have a Support Service team for Quickbooks. Need instant solution of your Quickbooks Accounting related. Instantly Dial Quickbooks Support Phone Number for USA user only. Call us on +1-800-901-6679.

hary Mason August 13, 2019 12:49 am  

Hey! Lovely post. I am a big fan of your work. I really like your website. Undoubtedly QuickBooks is one of the most appealing accounting software. You can easily use and install this software for your business. You can even get best technical help at
QuickBooks Customer Service 1-800-329-0391.

Visit here : https://www.qbsupportcustomerservice.com/

allhelplinesupport3046 August 16, 2019 11:33 pm  

Gmail Account Login Problems
Change Gmail Password
Hack Gmail Account Recovery
G Suite Support Number
Gmail Business Account Help

Cash App Customer Service
Comcast Email Support
Comcast Customer Service

Quickbooks support August 19, 2019 12:11 am  

For Quickbooks Pro Support Phone Number dial +1-800-901-6679 if you get instant solution. Our Quickbooks Pro technical support agents always provides you the suitable help.

Quickbooks Payroll August 19, 2019 10:26 pm  

Nice Blog If you need Quickbooks Support Phone Number then you can dial +1-800-986-4607 for help and support. Our technical support team always provides you the best technical help.

AllHelplineNumber August 20, 2019 3:51 am  

We are one of the third party which provide best in class support for all kind of Xbox Game studio, Xbox Live, Xbox installation, updation and much more related issues over phone call and chat across the USA 24*7. We have a dedicated team of professionals who are well certified and experience to handle all kind of Xbox issues. We ensure each and every customer to get full satisfaction for his concern. You just need to dial up our Xbox customer support service number 1-800-382-3046.
Xbox Customer Service Number
Xbox Support Phone Number
Xbox Toll Free Number
Xbox Customer Care Number
Xbox Helpline Number

Puremelda August 25, 2019 11:57 pm  

You have all the reasons not to trust cheap paper writing services, Custom Writing Writers, and dissertation writing help. We offer the Write an Essay for Me to the clients at an affordable price.

Quickbooks Expert September 16, 2019 10:03 pm  

Nice Blog. To the solution of the QuickBooks error, you can contact us at our Quickbooks support Phone Number 1-800-986-4607. We have technical experts who have profound knowledge and experience in handling any sort of quickbooks issues.

Quickbooks Expert September 18, 2019 10:02 pm  

If you need to know more or facing any troubles in Quickbooks , you can dial our Quickbooks Desktop Support Phone Number 800-986-4607 anytime. Our expert help is always there for you to get rid of any technical snags you are experiencing.

Unknown September 30, 2019 6:55 am  

Free download gta san andreas apk and data

Unknown October 09, 2019 8:18 am  

Black Friday Point for new items sale.

Tech Solitic October 24, 2019 12:13 am  

what is tap windows adapter v9 windows 10 issue solved.

Tech Solitic October 28, 2019 10:46 pm  

your dns server might not be available windows 10

nady samson November 01, 2019 4:59 am  

Very nice post. Geek Squad Tech Support has many new features to do their repair work effectively and efficiently. They are available 24/7 for all customers across the country. If you want any type of help, then definitely visit us.

Tech Support November 08, 2019 2:06 am  


Geek Squad Tech Support provides the best technical help and

guidance. Get in touch with extensively trained tech support team for all sort of queries and issues regarding your

devices. You can contact Geek Squad round the clock according to

your convenience.

Tech Support November 08, 2019 2:07 am  

Geek Squad Support works effortlessly towards serving

the consumers and have a wide stretch toward resolving the issues, our Geek Squad Support provides you with all the answers to your issues.

Tech Support November 08, 2019 2:08 am  

Remove snags with your electronic devices at Geek Squad support. Get instant solutions to all your device issues by connecting with experts at Geek Squad support.

Florahmelda November 13, 2019 1:24 am  

College Research Papers Writing Services provide 100% top-quality Custom College Essay Services for all their Online College Papers Writing levels.

Legitimate Custom Research Paper Services November 18, 2019 8:45 pm  

It is normal for students to be anxious about hiring an online professional Legitimate Custom Research Paper Services Provider because they can never be sure whether they can get high-quality affordable Custom Research Paper Services and the right Research Paper Assistance Services or not.

Legitimate Custom Research Paper Services November 20, 2019 5:22 am  

Students can freely require Custom Research Paper Servicest o enable them to complete their Customized Research Papers and College Research Paper Services.

casinoxo December 05, 2019 8:52 am  

มาเล่นสล็อตออนไลน์ live22 ได้เงินจริง ได้เงินเยอะที่นี่สิ
https://www.slot4u.com/live22