К основному контенту

Из каких основных частей состоит шаблон blogger

Существует 5 основных чатей шаблона на blogger. Примерное описание и то как они выглядят Вы можете посмотреть ниже, это пригодиться если Вы хотите реально преукрасить Ваш блон на Blogger, далее читая статьи данного блога Вы сможете сделать свой блог полноценным сайтом.

1. XML Расширенеи шаблонов
2. HEAD, Название и МЕТА ТЭГИ
3.Описание шаблона
4. CSS (Cascading Style Sheet)
5.Body – тело шаблона
Далее пошли описания и примеры данных частей:
XML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html 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>

HEAD, Название  и МЕТА ТЭГИ
<head>
<title>Latest Tips for Bloggers|Blogger Tips And Tricks</title>
<b:include data='blog' name='all-head-content'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='blogger' name='generator'/>
<meta content='Latest Tips for Bloggers for easy blogging and Making Money.blogger,blogspot tips and tricks.A dummies guide,templates,layouts,widgets, JavaScript,HTML codes,SEO,Google AdSense,gadgets,How to monetize Blogger or blogspot blogs.' name='description'/>
<meta content='blogger tricks,blogspot tweaks,how to blog,blogger tips,blogging tricks,widgets,links,google,adsense,latest,Page Rank,free blog,Yahoo,MSN,FeedBurner,Comments,new bloggers,sitemaps,make money,online,Blogging tips,Sitemaps,Meta Tag,YouTube Tweaks' name='keywords'/>
<meta content='Lasantha' name='author'/>
<meta content='all,follow' name='robots'/>
<meta content='General' name='Rating'/>
<meta content='never' name='Expires'/>
<meta content='english' name='Language'/>
<meta content='Global' name='Distribution'/>
<meta content='INDEX,FOLLOW' name='Robots'/>
<meta content='4 Days' name='Revisit-after'/>
<meta content='lasanthaset4@gmail.com' name='Email'/>
<meta content='Karunarathna' name='Publisher'/>
<meta content='Keerthi' name='Copyright'/>
<META content='04a82ed1e8901452' name='y_key'></META>
<meta content='9BC9210680' name='blogcatalog'/>
<meta content='uhl6s4fkZiCGiK8tOzdJdlKTP7V4anqblyHBjk8PA0g=' name='verify-v1'/>

Описание шаблона
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Minima Ochre
Designer: Douglas Bowman
URL: www.stopdesign.com
Date: 26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */
/* Variable definitions
  ====================
  <Variable name="bgcolor" description="Page Background Color"
  type="color" default="#dd9" value="#CAF99B">
  <Variable name="textcolor" description="Text Color"
  type="color" default="#333" value="#333333">
  <Variable name="linkcolor" description="Link Color"
  type="color" default="#684" value="#0066CC">
  <Variable name="pagetitlecolor" description="Blog Title Color"
  type="color" default="#874" value="#000000">
  .............................
CSS (Cascading Style Sheet)
/* Use this with templates/template-twocol.html */
body {
  background:$bgcolor;
  margin:0;
  color:$textcolor;
  font:x-small Georgia Serif;
  font-size/* */:/**/small;
  font-size: /**/small;
  text-align: center;
  }
a:link {
  color:$linkcolor;
  text-decoration:none;
  }
a:visited {
  color:$visitedlinkcolor;
  text-decoration:none;
  }
a:hover {
  color:$titlecolor;
  text-decoration:underline;
}
a img {
  border-width:0;
  }
/* Header
-----------------------------------------------
*/
...............
/* Footer
----------------------------------------------- */
#footer {
  width:950px;
  clear:both;
  margin:0 auto;
  padding-top:15px;
  line-height: 1.6em;
  text-transform:uppercase;
  letter-spacing:.1em;
  text-align: center;
}
/** Page structure tweaks for layout editor wireframe */
body#layout #header {
  margin-left: 0px;
  margin-right: 0px;
}
]]></b:skin>
  </head>
Body – тело шаблона
<body>
  <div id='outer-wrapper'><div id='wrap2'>
  <!-- skip links for text browsers -->
  <span id='skiplinks' style='display:none;'>
  <a href='#main'>skip to main </a> |
  <a href='#sidebar'>skip to sidebar</a>
  </span>
  <div id='header-wrapper'>
  <b:section class='header' id='header' maxwidgets='4' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='Blogger Tips And Tricks (Header)' type='Header'/>
<b:widget id='HTML17' locked='false' title='' type='HTML'/>
<b:widget id='HTML19' locked='false' title='' type='HTML'/>
</b:section>
  </div>
  <div id='content-wrapper'>
  <div class='sidebar-wrapper'>
  <b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML6' locked='false' title='Subscribe to Blogger Tips' type='HTML'/>
<b:widget id='LinkList2' locked='false' title='Blogger Tips - General' type='LinkList'/>
<b:widget id='HTML7' locked='false' title='' type='HTML'/>
<b:widget id='HTML1' locked='false' title='Blog Directries' type='HTML'/>
<b:widget id='HTML5' locked='false' title='Social Bookmarks' type='HTML'/>
<b:widget id='HTML11' locked='false' title='Useful Free Services' type='HTML'/>
<b:widget id='LinkList1' locked='false' title='Link' type='LinkList'/>
</b:section>
<p><a href='http://bloggertipandtrick.blogspot.com/'>Blogger Tips and Trick</a> for <a href='http://bloggertipandtrick.blogspot.com/'>Bloggers</a></p></div>
  <div id='main-wrapper'>
  <b:section class='main' id='main' showaddelement='yes'>
<b:widget id='HTML14' locked='false' title='' type='HTML'/>
<b:widget id='HTML20' locked='false' title='Search Blogger Tips And Tricks' type='HTML'/>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
<b:widget id='LinkList3' locked='false' title='Blogger Tips - Useful Articles' type='LinkList'/>
<b:widget id='LinkList4' locked='false' title='Blogger Tips - Change Appearance' type='LinkList'/>
<b:widget id='LinkList5' locked='false' title='Blogger Tips -Gadget,Widget,Elements,Tools' type='LinkList'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='HTML13' locked='false' title='Privacy Policy' type='HTML'/>
</b:section>
  </div>
  <div class='sidebar-wrapper'>
  <b:section class='sidebar' id='sidebar2' preferred='yes'>
<b:widget id='HTML2' locked='false' title='Get Email Updates' type='HTML'/>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
<b:widget id='HTML3' locked='false' title='Get Latest Updates' type='HTML'/>
<b:widget id='HTML10' locked='false' title='' type='HTML'/>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='HTML8' locked='false' title='Link to This Site' type='HTML'/>
<b:widget id='HTML9' locked='false' title='Support me !!!' type='HTML'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='HTML4' locked='false' title='Flag Counter' type='HTML'/>
<b:widget id='HTML15' locked='false' title='' type='HTML'/>
</b:section>
  </div>
  <!-- spacer for skins that want sidebar and main to be the same height-->
  <div class='clear'>&#160;</div>
  </div> <!-- end content-wrapper -->
  <div id='footer-wrapper'>
  <b:section class='footer' id='footer'>
<b:widget id='HTML21' locked='false' title='' type='HTML'/>
<b:widget id='HTML12' locked='false' title='Feed Directories' type='HTML'/>
</b:section>
  </div>
  </div></div> <!-- end outer-wrapper -->
<script type='text/javascript'>
var gaJsHost = ((&quot;https:&quot; == document.location.protocol) ? &quot;https://ssl.&quot; : &quot;http://www.&quot;);
document.write(unescape(&quot;%3Cscript src=&#39;&quot; + gaJsHost + &quot;google-analytics.com/ga.js&#39; type=&#39;text/javascript&#39;%3E%3C/script%3E&quot;));
</script>
<script type='text/javascript'>
try {
var pageTracker = _gat._getTracker(&quot;UA-8271964-1&quot;);
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html> 
Ярлыки:

Комментарии

  1. Анонимный3 июня 2011 г. в 04:13

    Здравствуйте Денис! Не могли бы вы подсказать пожалуйста как сделать такой
    блог как у Вас http://bloggfast.blogspot.com/
    Имеется ввиду оформление, т.е. статьи с маленькими аватарками в два
    сьолбика и главная статья по центру чуть больше остальных! Очень красиво и
    удобно! Буду очень признателен если подскажете как такое сделать! Заранее
    спасибо!

    ОтветитьУдалить

Отправить комментарий

Популярные сообщения из этого блога

Добавляем красивый гаджет Поделиться

Если Вы регулярно совершенствуете свой блог, то Вам пригодится данная не сложная публикация, о том как добавить красивую кнопку "Поделиться". Ее особенность в том, что при наведение курсора она раскрывается и предлагает несколько сервисов в которых можно разместить ссылку на Ваш блог. Демо можно посмотреть тут!
7 комментариев
Далее...

Как сделать ссылку на определенную часть той же страницы.

Все блоггеры пользуются ссылками практически в каждой статье, помимо удобства это еще и очень полезно для индексации блога. Сегодня хотел бы описать как сделать ссылку на туже страницу на которой находится Ваш читатель, только ниже, либо Выше, допустим Ваша статья состоит из нескольких частей и читатель, хочет пропустить первую и перейти сразу ко второй. Сделать это достаточно просто! 1.Для начала нам необходимо присвоить определенной части текста “Якорь”, допустим Вы хотите ссылать на каую-либо часть статьи, перед началом необходимого участка текста вставьте в HTML коде статьи следующий тег : <a id=" yakor "></a> Начало текста или заголовка В качестве слова якорь выделенного красным вы можете использовать любое другое, подходящее по смыслу. 2. Теперь необходимо сделать ссылку на данный якорь. А именно в HTML коде страницы перед словом которое должно быть ссылкой ставим тэг вида: <a href="# yakor ">Слово</a> Покажу как это долж
14 комментариев
Далее...

Открыть несколько ссылок одним кликом мыши

Многие из Вас наверняка встречали сайты, на которых нажав на одну ссылку открывается сразу несколько сайтов. Так делают те кто хочет прорекламировать независимый интернет ресурс, в таком случае открывается ссылка по которой вы должны перейти и еще одна, так-же это делают для увеличения просмотров определенных страниц на сайте, либо если действительно необходимо открыть сразу две ссылки. Для обычного блоггера это может быть полезным так как заинтересовав человека одной ссылкой Вы как бы повышаете популярность Вашего ресурса, так как он посетит вместо одной страницы в Вашем блоге сразу несколько. Чтобы вставить такую ссылку необходимо к тексту добавить следующий код: <a href="http://www.ссылка1.com/" target="_blank" onmouseover="window.open(&quot;&quot;http://www.ссылка2.com&quot;&quot;);window.open(&quot;&quot;http://www.ссылка3.com&quot;&quot;);">Click Here Link Bucket</a>   Вставьте свои ссылки, увеличьт
4 комментария
Далее...