Monday, November 4, 2013

// // Leave a Comment

Change Blogger Template hooked on a blank HTML Page

A simple HTML Page has a document type description shadowed by a HTML, HEAD and BODY tags respectively. The Metatags, JavaScript’s 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 mechanically through dynamic b: section tags then 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 can Convert Blogger Template into a blank HTML Page by following the steps below.

There Are 7 Simple Steps To Install The Theme:

  • Step 1: Go To Blogger Dashboard
  • Step 2: Create a New Test Blog
  • Step 3: Give it a title and address
  • Step 4: Choose the Simple Template and not Dynamic Views
  • Step 5: Next Navigate to Template > Edit HTML > Proceed
  • Step 6: Replace all the code inside the editor with the following code:
<?xml version="1.0" encoding="UTF-8" ?> 
<!DOCTYPE html> 
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'> 
  <head>
    <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/> 
    <b:if cond='data:blog.isMobile'> 
      <meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/> 
    <b:else/> 
      <meta content='width=1100' name='viewport'/> 
    </b:if> 
    <b:include data='blog' name='all-head-content'/> 
    <title><data:blog.pageTitle/></title>
   <b:skin><![CDATA[/* 
#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 style='margin-top:400px; '> 
<!--Please keep the Credits intact--> 
<center><p><a href='http://www.Tonyisright.blogspot.com'>Info Blog Maz </a>&#169; 2013.</p></center> 
</div> 
  </body> 
</html>

  • Step 7: Click saves and when prompted about the following error:
Warning: Your new template does not include the following

widgets:  BlogArchive1 Profile1 Attribution1 Header1 Blog1

Simply click on Delete widgets and you are all done!

If you have any problem about this please comment below or contact us on our page.

0 comments:

Post a Comment

Confused? Don't hesitate to ask We love to hear your feedbacks and suggestions. We will try our best to reply to your queries as soon as time allows.

Note: Please do not spam. Those type of comments will be deleted upon our review.