Mẫu blogspot rút gọn dùng để thiết kế blog



Đây là một lẫu blogspot trắng đã được rút gọn dùng để thiết kế template blogspot bán hàng, template blog bất động sản, rip giao diện blgospot, convert mẫu giao diện blogspot, giúp bạn học thiết kế theme blogspot.

Template 1

Các bạn tạo mới một blog và xóa tất cả code bên trong đi, copy code này dán vô là lưu lại.
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html>
  <head>
    <meta content='width=device-width, initial-scale=1.0' name='viewport'/>
 <title>
    <data:blog.title/>
    </title>
    <b:skin><![CDATA[

       /* Chèn Css vào đây */

    ]]></b:skin>
  </head>
  <body>
    <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='yes'/>
  </body>
</html>

Template 2

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:version='2' class='v2'>
  <head>
    <meta content='width=device-width, initial-scale=1.0' name='viewport'/>
    <title>
      <data:blog.title/>
    </title>
    <b:template-skin>
      <![CDATA[
        body#layout ul{list-style-type:none;list-style:none}
        body#layout ul li{list-style-type:none;list-style:none}
      ]]>
    </b:template-skin>
    <b:skin>
      <![CDATA[
        /* Chèn Css vào đây */
      ]]>
    </b:skin>
  </head>
  <body>
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
      Nội dung ở trang chủ viết ở đây
    </b:if>
    <b:if cond='data:blog.searchLabel'>
      Nội dung cho trang search/label/
    </b:if>
    <b:if cond='data:blog.pageType == "error_page"'>
      Nội dung trang Lỗi 404
    </b:if>
    <b:if cond='data:blog.url != data:blog.homepageUrl'>
      <!-- Tiện ích Blog1 ở đây -->
      <b:section class='main' id='mainpost' showaddelement='yes'>
      </b:section>
    </b:if>
  </body>
</html>

Template 3

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:css='false' b:defaultwidgetversion='2' b:layoutsVersion='3' b:responsive='true' b:templateUrl='indie.xml' b:templateVersion='1.3.0' 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='width=device-width, initial-scale=1.0' name='viewport'/>
    <title><data:blog.title/></title>
    <b:if cond='data:view.isLayoutMode'>
      <b:template-skin>
        <![CDATA[
body#layout ul{list-style-type:none;list-style:none}
body#layout ul li{list-style-type:none;list-style:none}
/* Chỉ viết CSS cho Layout Blog */
]]>
      </b:template-skin>
    </b:if>
    <b:if cond='!data:view.isLayoutMode'>
      <b:skin version='1.3.0'>
        <![CDATA[
/*
<!-- Variable definitions -->
<Variable name="keycolor" description="Main Color" type="color" default="$(main.color)" value="#ec5f1a"/>
<Variable name="followByEmail" description="Follow By Email Text" type="string" default="Get all latest content delivered straight to your inbox." value="Get all latest content delivered straight to your inbox."/>
<Group description="Theme Colors" selector="body">
<Variable name="main.color" description="Theme Color" type="color" default="#ec5f1a" value="#ec5f1a"/>
<Variable name="main.dark.color" description="Dark Color" type="color" default="#202020" value="#202020"/>
<Variable name="menu.color" description="Menu Color" type="color" default="#ffffff" value="#ffffff"/>
<Variable name="title.color" description="Title Color" type="color" default="#333333" value="#333333"/>
<Variable name="title.hover" description="Title Color on Hover" type="color" default="$(main.color)" value="#ec5f1a"/>
<Variable name="footer.color" description="Footer Color" type="color" default="#f1ffff" value="#f1ffff"/>
</Group>
<Group description="Theme Body" selector="body">
<Variable name="body.background.color" description="Body Background Color" type="color" default="#f8f8f8"  value="#f8f8f8"/>
<Variable name="body.background" description="Background" type="background" color="$(body.background.color)" default="$(color) url() repeat fixed top left" value="$(color) url() repeat fixed top left"/>
<Variable name="body.text.color" description="Text Color" type="color" default="#656565"  value="#656565"/>
<Variable name="body.link.color" description="Link Color" type="color" default="$(main.color)"  value="#ec5f1a"/>
</Group>
<!-- Extra Variables -->
<Variable name="body.text.font" description="Font" hideEditor="true" type="font" default="13px Poppins,sans-serif"  value="13px Poppins,sans-serif"/>
<Variable name="posts.background.color" description="Post background color" hideEditor="true" type="color" default="#ffffff"  value="#ffffff"/>
<Variable name="tabs.font" description="Font 2" hideEditor="true" type="font" default="13px Poppins,sans-serif"  value="13px Poppins,sans-serif"/>
<Variable name="posts.title.color" description="Post title color" hideEditor="true" type="color" default="#333333"  value="#333333"/>
<Variable name="posts.text.color" description="Post text color" hideEditor="true" type="color" default="#656565"  value="#656565"/>
<Variable name="posts.icons.color" description="Post icons color" hideEditor="true" type="color" default="$(main.color)"  value="#ec5f1a"/>
<Variable name="labels.background.color" description="Label background color" hideEditor="true" type="color" default="$(main.color)"  value="#ec5f1a"/>
*/
]]>
      </b:skin>
    </b:if>
  </head>
  <body>
    <b:if cond='data:view.isHomepage'>
      Nội dung ở trang chủ viết ở đây
    </b:if>
    <b:if cond='data:view.isLabelSearch'>
      Nội dung cho trang search/label/
    </b:if>
    <b:if cond='data:view.isError'>
      Nội dung trang Lỗi 404
    </b:if>
    <b:if cond='!data:view.isHomepage'>
      <b:if cond='!data:view.isLabelSearch'>
        <b:if cond='!data:view.isError'>
          <b:section class='main' id='mainpost' showaddelement='yes'>
          </b:section>
        </b:if>
      </b:if>
    </b:if>
  </body>
</html>
Như vậy là bạn đã tạo được một mẫu blogspot trắng tinh rút gọn đơn giản nhất.

Mục đích của nó là để thiết kế website blogspot, rip giao diện blogspot. Mình hay dùng nó để xây dựng và thiết kế mẫu blogspot bán hàng và các mẫu giao diện khác như: bất động sản, landing page cho blogspot.