Instructions
Difficulty: Moderate
Things You’ll Need:

* A blog design you planned in advance with the CSS styles in the head of the document like a Blogger template

Decide which Blogger tags to keep
Step1
Log in to Blogger. Select the link for the template of your blog.
Step2
Start with one of Blogger's free templates. You'll see special Blogger tags scattered throughout. They look like this:


<$BlogDateHeaderDate$>



These are the parts of Blogger that make your blog work. They create things like the date, the post and the comment forms.
Step3
Copy and paste the Blogger tags you identified in Step 2 into a separate text file. This gives you a copy of all the material you need to use in your new page design.
Work the Blogger Tags into your design
Step1
Work the Blogger tags into your custom web page in the appropriate places. You have to replace parts of your page with the Blogger tags. For example, replace the HTML for your post titles with the Blogger blog title tags.
Step2
Make sure the CSS selector names you used for your custom design match the names of the parts of the page that will be replaced by the special Blogger tags.
Step3
Use the Preview button at the bottom of the template editing field to see how your page looks. Do this often to check your work step by step.
Step4
When the Preview of your blog is exactly what you want, click the Save Template Changes button.
Step5
Republish your blog and look at in a browser.