Blogger Blank Template

BlogSpot templates are codded using the XHTML 1.0 Strict Document Type. It was developed by world wide web consortium on 26 January 2000. Unlike PHP or ASP.net the rules of XML are strict and unforgiving. A slight mistake in code results in terrifying error messages that you often see while editing your blog template. In order to understand how these templates are designed and programmed. You need to start from scratch. I was planning to release some grid and List view templates but the tough work schedule made it difficult to do so. However I am releasing today a simple code that will turn your test Blog's XML structure into a plain, empty template with no widgets. The entire blogger template consists of widgets that are operated and managed using classes and IDs. The blog posts section itself is a giant widget that can be styled in different ways. To make things simple I will share today how to create a blank HTML Page out of a Blogger Template and then start adding widgets to it to experiment exciting new ways of customizing the blog view.

How this is done?

A simple HTML Page has a document type description followed by a HTML, HEAD and BODY tags respectively. The meta tags, JavaScripts and style sheets are always added inside the head section and the DIV sections or content is enclosed inside the body section. In Blogger since the template is programmed automatically through dynamic b:section tags therefore we first need to remove all such sections and leave just one because the XML markup tag requires presence of at least on such section. To simplify the process I have created a "Static HTML Theme" that will work just fine for you. You can use this theme to play with exciting new tools, Fancy CSS3 tweaks, and practice your design skills. You will love working on it because it provides you with a much pleasant experience as compared to MBT HTML Editor

Steps To Install the Theme:

Go To Blogger Dashboard

Create a New Test Blog

Give it a title and address

Choose the Simple Template and not Dynamic Views

Next Navigate to Template > Edit HTML > Proceed

Replace all the code inside the editor with the following code:

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE html>

<head>

<b:if cond='data:blog.isMobile'>

<b:else/>

</b:if>

<b:include data='blog' name='all-head-content'/>

<b:skin><![CDATA[/*

-----------------------------------------------

////////////////////////STATIC HTML THEME////////////////////////////////////////////////////////////////////////////////////////

////////////////////////CODED BY : Mohammad Mustafa Ahmedzai////////////////////////////////////////////////////////////

/////////////////////// DOWNLOAD FROM: www.MyBloggerTricks.com //////////////////////////////////////////////////

----------------------------------------------- */

#navbar-iframe { height:0px; visibility:hidden; display:none }

body {

font: $(body.font);

color: $(body.text.color);

background: $(body.background);

padding: 0 $(content.shadow.spread) $(content.shadow.spread) $(content.shadow.spread);

$(body.background.override) margin: 0;

padding: 0;

}

]]></b:skin>

</head>

<body>

<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>

<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'/>

</b:section>

</div>

</body>

</html>