Как адаптировать шаблон с CMS WordPress на SaaS uCoz

Категория: SaaS uCoz
Для удобства разделю пост на части:
1. Выбор шаблона.
2. Установка движка WordPress на хостинг.
3. Адаптация.

Выбор шаблона.

Возможно вы подумали, что этот пункт совсем здесь не к месту, ведь выбор шаблона - чисто субъективное дело, но в нашем случае это не совсем так. Дело в том, что после переделки шаблона и установки его на ucoz-движок, возможны баги. То есть не все шаблоны поддаются адаптированию, возможно вы подгоните основной дизайн, но все фишки шаблона на ucoz'e работать не будут. В таком случае вся ваша работа по переделке шаблона коту под хвост. Поэтому нужно заранее выбрать шаблон, который поддастся адаптированию. Чтобы выбрать именно тот шаблон, который лучше всего подойдет для адаптации нужно изучить его html-код. Если вы там найдете скрипты использующие "левые" языки программирования, то такой шаблон вряд ли правильно "ляжет" при его последующей установки на ucoz. Подробнее об этом далее.

Установка движка WordPress.

Прежде чем начать адаптацию необходимо проверить шаблон на деле, покопаться в нем, а также просмотреть исходный код(html). Для этого нам понадобится бесплатный хостинг поддерживающий базы данных mysql и php, лучший вариант - www.000webhost.com. Регистрируемся на сайте, создаем проект и через ftp грузим движок WordPress(скачать движок, а также посмотреть как его ставить, можно здесь). После установки CMS, грузим через ftp шаблон, в папку: корень/sait/wp-content/themes/ . То есть в папке themes должна лежать папка с шаблоном. Далее в админ панели WordPress(http://сайт.ру/wp-admin) в настройках активируем загруженную тему и идем смотреть, что она из себя представляет. Тема нравиться - смотрим исходный код страницы и если незнакомые коды не обнаружены начинаем адаптацию. Например, вот код страницы, в которой есть "левые" скрипты, не поддерживаемые или создающие баги в uCoz(между тегами ):
Code
<!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">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  <meta name="generator" content="WordPress 3.0.1" />
  <meta name="description" content="Еще один сайт на Wordpress" />
  <title>
Hello, World! - Home  
</title>
  <link rel="stylesheet" href="http://wp/wp-content/themes/Zeoal/style.css" type="text/css" media="screen" />
<!--[if IE]>
<link rel="stylesheet" href="http://wp/wp-content/themes/Zeoal/includes/css/ie.css" type="text/css" media="screen" />
<![endif]-->
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->

  <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://wp/?feed=rss2" />

  <link rel="pingback" href="http://wp/xmlrpc.php" />
   
  <script type='text/javascript' src='http://wp/wp-includes/js/jquery/jquery.js?ver=1.4.2'></script>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://wp/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://wp/wp-includes/wlwmanifest.xml" />  
<link rel='index' title='Hello, World!' href='http://wp' />
<meta name="generator" content="WordPress 3.0.1" />

  <script type="text/javascript" src="http://wp/wp-content/themes/Zeoal/includes/js/pngfix.js"></script>
  <script type="text/javascript" src="http://wp/wp-content/themes/Zeoal/includes/js/textresizer.js"></script>  
  <script type="text/javascript" src="http://wp/wp-content/themes/Zeoal/includes/js/jquery.cycle.all.min.js"></script>

  <script type="text/javascript" src="http://wp/wp-content/themes/Zeoal/includes/js/jquery.tabs.pack.js"></script>
  <script type="text/javascript" src="http://wp/wp-content/themes/Zeoal/includes/js/superfish.js"></script>
  <script type="text/javascript" src="http://wp/wp-content/themes/Zeoal/includes/js/fm.common.js"></script>
  <script type="text/javascript" src="http://wp/wp-content/themes/Zeoal/includes/js/browserdetect.js"></script>
  <script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){
  jQuery("#logo, .wpi").fadeTo("slow", 0.3);
  jQuery("#logo, .wpi").hover(function(){
  jQuery(this).fadeTo("slow", 1.0);
  },function(){
  jQuery(this).fadeTo("slow", 0.3);
  });
  });  
</script>
<script type="text/javascript">
/* <![CDATA[ */
if (BrowserDetect.browser == "Firefox") {
  document.write ('<link rel="stylesheet" href="http://wp/wp-content/themes/Zeoal/includes/css/moz.css" type="text/css" media="screen" />');
}
/* ]]> */
</script>

  <link rel="shortcut icon" href="http://wp/wp-content/themes/Zeoal/images/favicon.ico" />
<style type="text/css">
::selection {background:#363636 none repeat scroll 0 0;color:#fff;text-shadow:none;}
</style>

</head>

<body>
  <div id="main">  
  <noscript><div id="noscript"><strong>Note</strong>: This website requires Javascript to function Properly. You can enable it via Browser's Preference Settings.</div></noscript>  
  <!--[if lte IE 6]>
<div id="fm_announcement">
  <div style="width:950px; margin:0 auto;">
  <div style="float:left;width:79%;">
  You appear to be using Internet Explorer 6, which is an out-dated and insecure browser. It does not support modern web standards, you may not be able to properly use the features of this website. There are better browsers out there, we highly recommend you to upgrade your browser to any of these browsers:
  </div>
  <div style="float:right;">
  <a href="http://www.mozilla.com/firefox/" class="firefox_ie">FireFox</a> <a href="www.microsoft.com/windows/Internet-explorer/default.aspx" class="ie8_ie">IE8</a> <a href="http://www.google.com/chrome" class="chrome_ie">Chrome</a> <a href="http://www.opera.com/" class="opera_ie">Opera</a>  
  </div>
  </div>
</div>
  <![endif]-->
<div id="m_top_adblock">
  <div id="m_top_adblockwrap">

  <div id="m_top_adblockL" >
<a href="#"><img src="wp-content/themes/Zeoal/images/768x90_t.gif" alt="advert"/></a>
  </div>

  <div id="m_top_adblockR">
<a href="#"><img src="wp-content/themes/Zeoal/images/180x90_t.gif" alt="advert"/></a>
  </div>
  </div>  
</div>
  <div id="topnav" >
  ....<!-- Часть кода вырезана -->

</body>
</html>
  


p.s. Можно не заморачиваться, регистрируясь на различных хостингах, а установить движок на локальную машину, используя Денвер ( Не рекомендую новичкам! ).

Адаптация.

После адаптации, в любом случае придется еще поковыряться и настраивать шаблон под себя. Но основа будет установлена. Я буду показывать адаптацию шаблона Summ для модуля "Новости сайта" и затрону следующие подмодули(т.е. то, что редактируется в разделе "Управление дизайном"):

- "Страницы сайта";
- "Вид архива материалов";
- "Вид материала";
- "Вид материала и комментария к нему".

Перед тем как начать редактировать, нужно загрузить в корень сайта(уже на ucoz)папку images, иногда, в папке с шаблоном, бывают отдельные папки с файлами скриптов *.js, которые тоже нужно загрузить в корень, также загружаем все файлы имеющие расширение .css(файлы стилей). В нашем случае грузим папку images и файл стилей style.css.

Начну с "Страницы сайта". Сначала смотрим исходный код темы Summ на движке WordPress, для этого открываем начальную страницу сайта с активированной темой и нажимаем Ctrl+U, видим:
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-RU">
<head profile="http://gmpg.org/xfn/11">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  <meta name="author" content="Hello, World!" />
  <link rel="stylesheet" href="http://wp/wp-content/themes/summ/summ/style.css" type="text/css" media="screen" />
  <link rel="pingback" href="http://wp/xmlrpc.php" />
  <title> Hello, World!</title>
  <link rel="pingback" href="http://wp/xmlrpc.php" />
   

  <link rel="alternate" type="application/rss+xml" title="Hello, World! » Фид" href="http://wp/?feed=rss2" />

<link rel="alternate" type="application/rss+xml" title="Hello, World! » Лента комментариев" href="http://wp/?feed=comments-rss2" />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://wp/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://wp/wp-includes/wlwmanifest.xml" />  
<link rel='index' title='Hello, World!' href='http://wp' />
<meta name="generator" content="WordPress 3.0.1" />
</head>
<body class="home blog logged-in">
<div id="header">
  <p class="siteName"><a href="http://wp" id="logo" title="Hello, World!">Hello, World!</a></p>
  <p class="description">Еще один сайт на Wordpress</p>

  <div id="globalNavi">

  <div class="menu"><ul><li class="current_page_item"><a href="http://wp/" title="Главная">Главная</a></li><li class="page_item page-item-2"><a href="http://wp/?page_id=2" title="О сайте">О сайте</a></li></ul></div>
   
  <div class="rss">
  <a href="http://wp/?feed=rss2" rel="alternate" type="application/rss+xml" target="_blank" title="Подписка"></a>
  </div>
  <div class="searchbox"><form method="get" id="searchform" action="http://wp/">
<div>
  <input type="text" value="Поиск..." onfocus="if (this.value == 'Поиск...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Поиск...';}" name="s" id="s" size="15" />
  <input type="submit" id="searchsubmit" />

</div>
</form></div>
  </div>
</div>

<div id="content">
  <div id="main">
  <div class="section entry" id="entry">
  <div class="post-1 post type-post hentry category-1">
  <div class="post">
  <h2>

  <a href="http://wp/?p=1">Привет, мир!</a>
  </h2>
  <p class="info">
  <span class="dateinfo">1 Ноябрь 2010 at 12:57</span><span class="catinfo"> Рубрики:<a href="http://wp/?cat=1" title="Просмотреть все записи в Новости" rel="category">Новости</a> </span>
  <span class="cmtinfo"><a href="http://wp/?p=1#comments" title="Комментарий на Привет, мир!">1 коммент. »</a> | <a class="post-edit-link" href="http://wp/wp-admin/post.php?post=1&action=edit" title="Редактирование записи"> Ред.</a></span>

  </p>
  <div class="indexentry">

Поздравляем, Вы установили русифицированную сборку <a href="http://mywordpress.ru/">WordPress</a>. Это первая запись в Вашем блоге, Вы можете ее отредактировать или удалить.</p>


Прямо сейчас Вы можете ознакомиться с <a href="http://mywordpress.ru/support/viewtopic.php?id=7071" target="_blank">рекомендациями после установки WordPress</a>. Созданием этой сборки занимается команда <a href="http://mywordpress.ru" target="_blank">MyWordPress</a>. Если у Вас возникнут вопросы, будем рады ответить на них на нашем <a href="http://mywordpress.ru/support" target="_blank">форуме</a>.</p>
</div>
  </div></div>

  <div class="flip"><!-- Локализация шаблона - FreeWordpressThemes.ru -->
  <div class="prevpost"></div>
  <div class="nextpost"></div>
  </div>
  </div><!-- section entry -->
  </div><!-- main -->
  <div id="sidebar">
  <ul>
  <li id="linkcat-2" class="linkcat"><h2>Ссылки</h2>

  <ul class='xoxo blogroll'>
<li><a href="http://planet.wordpress.org/">WordPress Planet</a></li>
<li><a href="http://wordpress.org/news/">Блог WordPress</a></li>
<li><a href="http://codex.wordpress.org/">Документация</a></li>
<li><a href="http://plugins.mywordpress.ru/">Плагины</a></li>
<li><a href="http://wordpress.org/extend/ideas/">Предложите идею</a></li>
<li><a href="http://themes.mywordpress.ru/">Темы оформления</a></li>
<li><a href="http://mywordpress.ru/support/">Форум поддержки</a></li>

  </ul>
</li>

  <li><h2>Мета</h2>
  <ul>
  <li><a href="http://wp/wp-admin/">Администрирование</a></li> <li><a href="http://wp/wp-login.php?action=logout&_wpnonce=ec8600901d">Выйти</a></li>
  <li><a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>

  <li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
  <li><a href="http://freewordpressthemes.ru" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">Шаблоны WordPress</a></li>
  </ul>
  </li>

   
  </ul>
  </div> </div>
<div id="footer">

<div id="footerbox">

<div class="return"><a href="#header">TOP</a></div>

<p class="support">
Авторские права © 2010 <a href="http://wp">Hello, World!</a>
<br/>
Локализация <a href="http://freewordpressthemes.ru" title="Русские темы для WordPress бесплатно для всех блоггеров">Темы WordPress</a>
</p>

</div>
</div>
<!-- <center>Здесь можно установить коды счетчиков статистики</center> -->

</body>
</html>

Копируем все в блокнот(лучше не использовать стандартный, а скачать NotePad++). Теперь удаляем все лишнее: теги не поддерживаемые в системе uCoz, такие как:
Code

<link rel="pingback" href="http://wp/xmlrpc.php" />
   
<link rel="pingback" href="http://wp/xmlrpc.php" />

<link rel="alternate" type="application/rss+xml" title="Hello, World! » Фид" href="http://wp/?feed=rss2" />

<link rel="alternate" type="application/rss+xml" title="Hello, World! » Лента комментариев" href="http://wp/?feed=comments-rss2" />

<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://wp/xmlrpc.php?rsd" />

<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://wp/wp-includes/wlwmanifest.xml" />  

<link rel='index' title='Hello, World!' href='http://wp' />

<meta name="generator" content="WordPress 3.0.1" />

Также нужно будет заменить все у-р-л сайта на "укозовские".

После редактирования кода, получаем:
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-RU">
<head profile="http://gmpg.org/xfn/11">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  

  <link rel="stylesheet" href="/style.css" type="text/css" media="screen" />
  <title>$TITLE$</title>
</head>
<body class="home blog logged-in">
<div id="header">
  <p class="siteName"><a href="$HOME_PAGE_LINK$" id="logo" title="Название сайта">Название сайта</a></p>
  <p class="description">Описание сайта</p>

  <div id="globalNavi">

  <div class="menu"><ul><li class="current_page_item"><a href="http://wp/" title="$HOME_PAGE_LINK$">Главная</a></li>
  <li class="page_item page-item-2"><a href="" title="О сайте">О сайте</a></li></ul></div>
   
  <div class="rss">
  <a href="$RSS_LINK$" target="_blank" title="Подписка"></a>
  </div>
  <div class="searchbox"><form method="get" id="searchform" action="$HOME_PAGE_LINK$">
<div>
  <input type="text" value="Поиск..." onfocus="if (this.value == 'Поиск...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Поиск...';}" name="s" id="s" size="15" />
  <input type="submit" id="searchsubmit" />

</div>
</form></div>
  </div>
</div>

<div id="content">
  <div id="main">
  <div class="section entry" id="entry">
  <div class="post-1 post type-post hentry category-1">
  <div class="post">
  <h2>

  <a href="http://wp/?p=1">Привет, мир!</a>
  </h2>
  <p class="info">
  <span class="dateinfo">1 Ноябрь 2010 at 12:57</span><span class="catinfo"> Рубрики:<a href="http://wp/?cat=1" title="Просмотреть все записи в Новости" rel="category">Новости</a> </span>
  <span class="cmtinfo"><a href="http://wp/?p=1#comments" title="Комментарий на Привет, мир!">1 коммент. »</a> | <a class="post-edit-link" href="http://wp/wp-admin/post.php?post=1&action=edit" title="Редактирование записи"> Ред.</a></span>

  </p>
  <div class="indexentry">

Поздравляем, Вы установили русифицированную сборку <a href="http://mywordpress.ru/">WordPress</a>. Это первая запись в Вашем блоге, Вы можете ее отредактировать или удалить.</p>


Прямо сейчас Вы можете ознакомиться с <a href="http://mywordpress.ru/support/viewtopic.php?id=7071" target="_blank">рекомендациями после установки WordPress</a>. Созданием этой сборки занимается команда <a href="http://mywordpress.ru" target="_blank">MyWordPress</a>. Если у Вас возникнут вопросы, будем рады ответить на них на нашем <a href="http://mywordpress.ru/support" target="_blank">форуме</a>.</p>
</div>
  </div></div>

  <div class="flip">
  <div class="prevpost"></div>
  <div class="nextpost"></div>
  </div>
  </div><!-- section entry -->
  </div><!-- main -->
  <div id="sidebar">
  <ul>
  <li id="linkcat-2" class="linkcat"><h2>Ссылки</h2>

  <ul class='xoxo blogroll'>
<li><a href="http://ublog.pp.ru/">Все про uCoz</a></li>
<li><a href="http://ucoz.ru/">SaaS uCoz</a></li>
  </ul>
</li>

  <li><h2>Мета</h2>
  <ul>
  <li><a href="">Администрирование</a></li>  
  <li><a href="">Выйти</a></li>
  <li><a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
  <li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
  <li><a href="http://freewordpressthemes.ru" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">Шаблоны WordPress</a></li>
  </ul>
  </li>

   
  </ul>
  </div> </div>
<div id="footer">

<div id="footerbox">

<div class="return"><a href="#header">TOP</a></div>

<p class="support">
Авторские права © 2010 <a href="$HOME_PAGE_LINK$">Название сайта</a>
<br/>

</p>

</div>
</div>
<!-- <center>Здесь можно установить коды счетчиков статистики</center> -->

</body>
</html>


Теперь нужно выяснить, какой фрагмент кода нужно вырезать и вставить в "Вид материала", так как если мы вставим весь код в "Страницы сайта" новости отображаться не будут. Находим в отредактированном коде следующий "кусок":

Code
<div class="post-1 post type-post hentry category-1">
  <div class="post">
  <h2>
  <a href="http://wp/?p=1">Привет, мир!</a>

  </h2>
  <p class="info">
  <span class="dateinfo">1 Ноябрь 2010 at 12:57</span><span class="catinfo"> Рубрики:<a href="http://wp/?cat=1" title="Просмотреть все записи в Новости" rel="category">Новости</a> </span>
  <span class="cmtinfo"><a href="http://wp/?p=1#comments" title="Комментарий на Привет, мир!">1 коммент. »</a> | <a class="post-edit-link" href="http://wp/wp-admin/post.php?post=1&action=edit" title="Редактирование записи"> Ред.</a></span>

  </p>
  <div class="indexentry">

Поздравляем, Вы установили русифицированную сборку <a href="http://mywordpress.ru/">WordPress</a>. Это первая запись в Вашем блоге, Вы можете ее отредактировать или удалить.</p>


Прямо сейчас Вы можете ознакомиться с <a href="http://mywordpress.ru/support/viewtopic.php?id=7071" target="_blank">рекомендациями после установки WordPress</a>. Созданием этой сборки занимается команда <a href="http://mywordpress.ru" target="_blank">MyWordPress</a>. Если у Вас возникнут вопросы, будем рады ответить на них на нашем <a href="http://mywordpress.ru/support" target="_blank">форуме</a>.</p>
</div>
  </div></div>


Это тот самый кусок, который мы вставим в "Вид материалов". Как я это определил? Я вошел в админ панель WordPress, написал пробный пост: "а-ля-проверка-шаблона", обновил главную страницу сайта, на которой появились две записи: "Привет, мир!" и "а-ля-проверка-шаблона". После чего нажал Ctrl+U и обратил внимание на то, как формируется вид новостей:

Code
<div class="post-4 post type-post hentry category-1">
  <div class="post">
  <h2>

  <a href="http://wp/?p=4">а-ля-проверка-шаблона</a>
  </h2>
  <p class="info">
  <span class="dateinfo">3 Ноябрь 2010 at 11:03</span><span class="catinfo"> Рубрики:<a href="http://wp/?cat=1" title="Просмотреть все записи в Новости" rel="category">Новости</a> </span>
  <span class="cmtinfo"><a href="http://wp/?p=4#respond" title="Комментарий на Пробная запись.">0 коммент. »</a> | <a class="post-edit-link" href="http://wp/wp-admin/post.php?post=4&action=edit" title="Редактирование записи"> Ред.</a></span>

  </p>
  <div class="indexentry">

Это пробная запись</p>
</div>
  </div></div>
  <div class="post-1 post type-post hentry category-1">
  <div class="post">
  <h2>
  <a href="http://wp/?p=1">Привет, мир!</a>

  </h2>
  <p class="info">
  <span class="dateinfo">1 Ноябрь 2010 at 12:57</span><span class="catinfo"> Рубрики:<a href="http://wp/?cat=1" title="Просмотреть все записи в Новости" rel="category">Новости</a> </span>
  <span class="cmtinfo"><a href="http://wp/?p=1#comments" title="Комментарий на Привет, мир!">1 коммент. »</a> | <a class="post-edit-link" href="http://wp/wp-admin/post.php?post=1&action=edit" title="Редактирование записи"> Ред.</a></span>

  </p>
  <div class="indexentry">

Поздравляем, Вы установили русифицированную сборку <a href="http://mywordpress.ru/">WordPress</a>. Это первая запись в Вашем блоге, Вы можете ее отредактировать или удалить.</p>


Прямо сейчас Вы можете ознакомиться с <a href="http://mywordpress.ru/support/viewtopic.php?id=7071" target="_blank">рекомендациями после установки WordPress</a>. Созданием этой сборки занимается команда <a href="http://mywordpress.ru" target="_blank">MyWordPress</a>. Если у Вас возникнут вопросы, будем рады ответить на них на нашем <a href="http://mywordpress.ru/support" target="_blank">форуме</a>.</p>
</div>
  </div></div>

Не трудно заметить, какой фрагмент кода формирует вид материалов. Итак, с тем куском кода, который нужно вставить в "Вид материалов" определились. Но его нужно будет отредактировать под uCoz:
Code
<div class="post-1 post type-post hentry category-1">
  <div class="post">
  <h2><a href="$ENTRY_URL$">$TITLE$</a></h2>
  <p class="info">
  <span class="dateinfo">$WDAY$ $DATE$ $TIME$</span><span class="catinfo"> Рубрики:<a href="$CATEGORY_URL$" title="Просмотреть все записи в $CATEGORY_NAME$" rel="category">$CATEGORY_NAME$</a> </span>
  <span class="cmtinfo"><a href="$COMMENTS_URL$" title="Комментарии">Комментариии ($COMMENTS_NUM$)</a> | $MODER_PANEL$</span>
  </p>
  <div class="indexentry">$MESSAGE$</div>
  </div></div>

Возвращаемся к редактированию Страниц сайта. Мы вырезали кусок в коде и теперь в освободившееся место вставляем U-код $CONTENT$:

Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-RU">
<head profile="http://gmpg.org/xfn/11">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  

  <link rel="stylesheet" href="/style.css" type="text/css" media="screen" />
  <title>$TITLE$</title>
</head>
<body class="home blog logged-in">
<div id="header">
  <p class="siteName"><a href="$HOME_PAGE_LINK$" id="logo" title="Название сайта">Название сайта</a></p>
  <p class="description">Описание сайта</p>

  <div id="globalNavi">

  <div class="menu"><ul><li class="current_page_item"><a href="http://wp/" title="$HOME_PAGE_LINK$">Главная</a></li>
  <li class="page_item page-item-2"><a href="" title="О сайте">О сайте</a></li></ul></div>
   
  <div class="rss">
  <a href="$RSS_LINK$" target="_blank" title="Подписка"></a>
  </div>
  <div class="searchbox"><form method="get" id="searchform" action="$HOME_PAGE_LINK$">
<div>
  <input type="text" value="Поиск..." onfocus="if (this.value == 'Поиск...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Поиск...';}" name="s" id="s" size="15" />
  <input type="submit" id="searchsubmit" />

</div>
</form></div>
  </div>
</div>

<div id="content">
  <div id="main">
  <div class="section entry" id="entry">
  $CONTENT$

  <div class="flip">
  <div class="prevpost"></div>
  <div class="nextpost"></div>
  </div>
  </div><!-- section entry -->
  </div><!-- main -->
  <div id="sidebar">
  <ul>
  <li id="linkcat-2" class="linkcat"><h2>Ссылки</h2>

  <ul class='xoxo blogroll'>
<li><a href="http://ublog.pp.ru/">Все про uCoz</a></li>
<li><a href="http://ucoz.ru/">SaaS uCoz</a></li>
  </ul>
</li>

  <li><h2>Мета</h2>
  <ul>
  <li><a href="">Администрирование</a></li>  
  <li><a href="">Выйти</a></li>
  <li><a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
  <li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
  <li><a href="http://freewordpressthemes.ru" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">Шаблоны WordPress</a></li>
  </ul>
  </li>

   
  </ul>
  </div> </div>
<div id="footer">

<div id="footerbox">

<div class="return"><a href="#header">TOP</a></div>

<p class="support">
Авторские права © 2010 <a href="$HOME_PAGE_LINK$">Название сайта</a>
<br/>

</p>

</div>
</div>
<!-- <center>Здесь можно установить коды счетчиков статистики</center> -->

</body>
</html>

Готово. Вставляем этот код в "Страницы сайта".

Переходим к редактированию "Вида архива материалов". Здесь все просто. Копируем код, который мы переделали для "Страниц сайта" и вставляем в "Вид архива материалов". Нужно только заменить Ю-тег $CONTENT$ на $BODY$.

Переходим к "Вид материала и комментария к нему". Снова копируем код из "Страниц сайта" (тот, который мы переделали) и вставляем его в блокнот. Заменяем $CONTENT$ на Фрагмент кода из "Вида материалов", а после него вставляем стандартный код системы, формирующий форму для комментирования. Вот как будет выглядеть отредактированный код:
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-RU">
<head profile="http://gmpg.org/xfn/11">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  

  <link rel="stylesheet" href="/style.css" type="text/css" media="screen" />
  <title>$TITLE$</title>
</head>
<body class="home blog logged-in">
<div id="header">
  <p class="siteName"><a href="$HOME_PAGE_LINK$" id="logo" title="Название сайта">Название сайта</a></p>
  <p class="description">Описание сайта</p>

  <div id="globalNavi">

  <div class="menu"><ul><li class="current_page_item"><a href="http://wp/" title="$HOME_PAGE_LINK$">Главная</a></li>
  <li class="page_item page-item-2"><a href="" title="О сайте">О сайте</a></li></ul></div>
   
  <div class="rss">
  <a href="$RSS_LINK$" target="_blank" title="Подписка"></a>
  </div>
  <div class="searchbox"><form method="get" id="searchform" action="$HOME_PAGE_LINK$">
<div>
  <input type="text" value="Поиск..." onfocus="if (this.value == 'Поиск...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Поиск...';}" name="s" id="s" size="15" />
  <input type="submit" id="searchsubmit" />

</div>
</form></div>
  </div>
</div>

<div id="content">
  <div id="main">
  <div class="section entry" id="entry">
  <div class="post-1 post type-post hentry category-1">
  <div class="post">
  <h2><a href="$ENTRY_URL$">$TITLE$</a></h2>
  <p class="info">
  <span class="dateinfo">$WDAY$ $DATE$ $TIME$</span><span class="catinfo"> Рубрики:<a href="$CATEGORY_URL$" title="Просмотреть все записи в $CATEGORY_NAME$" rel="category">$CATEGORY_NAME$</a> </span>
  <span class="cmtinfo"><a href="$COMMENTS_URL$" title="Комментарии">Комментариии ($COMMENTS_NUM$)</a> | $MODER_PANEL$</span>
  </p>
  <div class="indexentry">$MESSAGE$</div>
  </div></div>
<?if($COM_IS_ACTIVE$)?>
<?if($COM_CAN_READ$)?>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr><td width="60%" height="25"><!--<s5183>-->Всего комментариев<!--</s>-->: <b>$COM_NUM_ENTRIES$</b></td><td align="right" height="25">$COM_PAGE_SELECTOR$</td></tr>
<tr><td colspan="2">$COM_BODY$</td></tr>
<tr><td colspan="2" align="center">$COM_PAGE_SELECTOR1$</td></tr>
<tr><td colspan="2" height="10"></td></tr>
</table>
<?endif?>

<?if($COM_CAN_ADD$)?>
$COM_ADD_FORM$
<?else?>
<?if($USER_LOGGED_IN$)?><?else?><div align="center" class="commReg"><!--<s5237>-->Добавлять комментарии могут только зарегистрированные пользователи.<!--</s>-->
[ <a href="$REGISTER_LINK$"><!--<s3089>-->Регистрация<!--</s>--></a> | <a href="$LOGIN_LINK$"><!--<s3087>-->Вход<!--</s>--></a> ]</div><?endif?>
<?endif?>
<?endif?>

  <div class="flip">
  <div class="prevpost"></div>
  <div class="nextpost"></div>
  </div>
  </div><!-- section entry -->
  </div><!-- main -->
  <div id="sidebar">
  <ul>
  <li id="linkcat-2" class="linkcat"><h2>Ссылки</h2>

  <ul class='xoxo blogroll'>
<li><a href="http://ublog.pp.ru/">Все про uCoz</a></li>
<li><a href="http://ucoz.ru/">SaaS uCoz</a></li>
  </ul>
</li>

  <li><h2>Мета</h2>
  <ul>
  <li><a href="">Администрирование</a></li>  
  <li><a href="">Выйти</a></li>
  <li><a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
  <li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
  <li><a href="http://freewordpressthemes.ru" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">Шаблоны WordPress</a></li>
  </ul>
  </li>

   
  </ul>
  </div> </div>
<div id="footer">

<div id="footerbox">

<div class="return"><a href="#header">TOP</a></div>

<p class="support">
Авторские права © 2010 <a href="$HOME_PAGE_LINK$">Название сайта</a>
<br/>

</p>

</div>
</div>
<!-- <center>Здесь можно установить коды счетчиков статистики</center> -->

</body>
</html>

Как видите, отредактировав код для "Страниц сайта" один раз, все остальное заменяется путем копирования этого кода.

Большой получился пост и слегка нудный, что неизбежно при изложении данного типа материала, но не думайте, что процесс адаптации занимает много времени. Стоит один раз научится, как каждый следующий шаблон будет даваться легче предыдущего...

Надеюсь, мой пост был полезен вам, и вы, прочитав его, научитесь преобразовывать красивые шаблоны wordpress для себя и юкоз-юзеров!

Если вам понравился рассматриваемый в статье шаблон, можете скачать его и самостоятельно адаптировать: Summ.

Полезные ссылки: CMS Wordpress, установка движка Wordpress, шаблоны для wordpress [1] [2] .

Удачи!

Солярий стоимость минуты

Понравился пост/статья? Подпишись на новые посты, чтобы быть в курсе всего, что происходит на блоге! Это бесплатно и быстро!


Возможно, вам будет интересно почитать:
Рубрики:
Главная
Новости
SaaS uCoz
ПО / Софт
Другие CMS
Мысли
Шаблоны




И все-таки лучше зарегистрируйтесь, либо войдите на сайт под своим именем. Так, общение будет без ограничений ;)

Всего комментариев: 5
5 kirill  
0
http://pro.ucoz.org/ - сверхъестественное (supernatural) 6 сезон, скачать бесплатно и без регистрации, скачать торрент, смотреть онлайн, фото, саудтреки, OST, новости о сериале и об актерах,
биография актеров, Дженсен Эклз (Jensen Ackles), Джаред Падалеки (Jared Padalecki)
Ответ: СПАМить нехорошо, однако!

3 vorg666  
0
Насчёт шаблонов. Я лично считаю, что намного проще использовать денвер... Его установка не так уж и сложна. Кто не знает - денвер (denwer) переводится как Джентельменский Набор Web мастера. Это программа, которая создает на вашем сайте веб сервер с поддержкой php, mysqul и других функций. Установив его вы сможете установить на свой пк любой движок и редактировать его без подключения к интернету. Ссылка на на скачиваете и подробную инфу - denwer.ru

Насчёт выбора шаба, то адаптировало можно любой шаб, просто некоторые проще, некоторые сложнее.

Насчёт адаптации. Не понял почему ничего про конструктор шабов не сказано. Создав раз шаб там, он создастся для всех модулей и не нужно будет код в каждый модульсувать вручную...

А в общем пост хорош. Сам думал об этом написать, но ты меня выпередил))


4 Ismail  
0
Да, про конструктор забыл. Я им не пользуюсь, привык к старому доброму методу happy

А насчет денвера..я подумал, что тот кто знает, что это такое и как им пользоваться вряд ли понадобится эта статья wink


1 Виктор  
0
Считаю, что тема адаптации WP на uCoz сложна и просто так на пальцах не объяснишь. не поймешь пока не попробуешь сам.
Наглядности не хватает) По кусочкам бы было бы интереснее)

2 Ismail  
0
Поэтому я и взял самую простую тему и на примере показал как это вообще делается. Как вы наверное заметили, я написал, что "Стоит один раз научится, как каждый следующий шаблон будет даваться легче предыдущего... "

Насчет наглядности, да, учту при в следующих постах. Спасибо вам за отзыв. happy


Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Категории раздела

Новости [20]
SaaS uCoz [25]
ПО / Софт [2]
Другие CMS [2]
Шаблоны [2]
Мысли [21]
Реклама [15]

Календарь

«  Ноябрь 2010  »
ПнВтСрЧтПтСбВс
1234567
891011121314
15161718192021
22232425262728
2930

Твитти-Пост

Комментарии

 Видеонаблюдение и системы безопасности.
Anyami написал:
Может быть я ну туда пишу, но не нашла у нас здесь подходящего топика. Совсем недавно друзья посоветовали классный сайт http://intimchek.biz/?s=514
чтобы найти наилучшего партнера для приватных отношений, а может быть, для серьезных отношений. Другими словами, это просто крупная бесплатная социальная сеть для приватных встреч один на один для общения и дружбы со всех крупных и небольших городов Росссии, Украины и других стран СНГ.
Огромный выбор предложений со всего мира. Уже пользовалась пару раз из моего города, все к моему удивлению бесплатно, вроде бы, все серьезно.
Спешу поделиться с вами своими личными секретами и надеюсь хоть кому-нибудь пригодится.

 Видеонаблюдение и системы безопасности.
Жопорук написал:
Пост неплохой, закину сайт в закладки.

 uCoz vs Платный/Бесплатный хостинг
WilliamHew написал:
Всем привет Хочу Вам предложить Использовать свои знания Для реальной работы в сети интернет, и получения отличного заработка в интернет на дому.приглашаем ВАС на новую, успешную Фриланс Биржу. Таже Приглашаем ВАС в официальную группу http://vip-freelancer.com - https://www.facebook.com/groups/1676523859237893 ВНИМАНИЕ! ТОЛЬКО 7 дней при регистрации здесь http://vip-freelancer.com Вы получите шикарный подарок 30 долларов США(3 месяца аккаунт «ПРО» за простую регистрацию!)

 Видеонаблюдение и системы безопасности.
onadinKn написал:
Кредит без эклога схвати воспламенителей не отсекает "партучёта" о миксоцелях, суперавтостраде которых разберутся кросс-средства. Выбирайте какой именно кредит аскетичными меньше заходит вам. Заявление подписывается водораспылителям или несосредоточенным соответствующей доверенностью авиаработником поисково-вызывной маргинализации, роспись переоблачается растениеводческом печати электронно-волновой дедраматизации.


Блог-ридеры и Твитти

Добавить в Google Reader Читать в Яндекс.Ленте Число подписчиков на Twitter.com

Я читаю

ВУЗы Казахстана
Купить iPhone недорого в Алматы

Статистика

Категории раздела