ru:themes:tutorial
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
ru:themes:tutorial [2013/09/18 10:17] Arkady [Подготовительные работы] |
ru:themes:tutorial [2015/05/01 19:47] (current) Byteler Added <?php get_theme_url(); ?>/ for validator logo img src |
||
|---|---|---|---|
| Line 10: | Line 10: | ||
| Теперь вы можете активировать тему beadysite в панели управления на вашем новом GS-сайте и видеть все происходящие изменения по мере продвижения вперед. Сейчас все ссылки на графику и стили битые, но вскоре вы это исправите. Откройте файл template.php вашей новой темы в своем любимом текстовом редакторе, в другом окне откройте файл template.php из темы Cardinal, чтобы вам было удобно копировать и вставлять тэги из одного шаблона в другой. | Теперь вы можете активировать тему beadysite в панели управления на вашем новом GS-сайте и видеть все происходящие изменения по мере продвижения вперед. Сейчас все ссылки на графику и стили битые, но вскоре вы это исправите. Откройте файл template.php вашей новой темы в своем любимом текстовом редакторе, в другом окне откройте файл template.php из темы Cardinal, чтобы вам было удобно копировать и вставлять тэги из одного шаблона в другой. | ||
| - | Вот так выглядит наш статический файл index.htm | + | Вот так выглядит наш статический файл index.html |
| <file> | <file> | ||
| Line 47: | Line 47: | ||
| <div id="left"> | <div id="left"> | ||
| <h2>Welcome to Beady Site</h2> | <h2>Welcome to Beady Site</h2> | ||
| - | <p>Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.</p> | + | <p>Bla bla bla a load of old nonsense |
| + | goes here in this area, move on nothing of interests to read here just | ||
| + | a load of old nonsense.Bla bla bla a load of old nonsense goes here in this area, | ||
| + | move on nothing of interests to read here just a load of old nonsense.</p> | ||
| <img src="images/cock.jpg" title="cock" alt="cock" /> | <img src="images/cock.jpg" title="cock" alt="cock" /> | ||
| <br /> | <br /> | ||
| - | <p>Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.</p> | + | <p>Bla bla bla a load of old nonsense |
| + | goes here in this area, move on nothing of interests to read here just | ||
| + | a load of old nonsense.Bla bla bla a load of old nonsense goes here in this area, | ||
| + | move on nothing of interests to read here just a load of old nonsense.</p> | ||
| </div> | </div> | ||
| <div id="right"> | <div id="right"> | ||
| <h2>Latest news</h2> | <h2>Latest news</h2> | ||
| - | <p>This is a free html5 web template, It`s very easy to edit and redesign in anyway you want. The PSD for the logo image is in the "images/psd" directory of this template.</p> | + | <p>This is a free html5 web template, |
| - | <p>If you're having problems editing the template you can find help on my website via the <a href="http://www.html5-templates.co.uk/forum/index.php">forums</a>.</p> | + | It`s very easy to edit and redesign in anyway you want. The PSD for the logo image |
| + | is in the "images/psd" directory of this template.</p> | ||
| + | <p>If you're having problems editing the template | ||
| + | you can find help on my website via the <a href="http://www.html5-templates.co.uk/forum/index.php">forums</a>.</p> | ||
| </div> | </div> | ||
| </div> | </div> | ||
| Line 81: | Line 90: | ||
| <br /> | <br /> | ||
| <p> | <p> | ||
| - | <a href="http://jigsaw.w3.org/css-validator/check/referer"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss-blue" alt="Valid CSS!"/></a> | + | <a href="http://jigsaw.w3.org/css-validator/check/referer"> |
| + | <img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss-blue" alt="Valid CSS!"/></a> | ||
| </p> | </p> | ||
| <br /> | <br /> | ||
| <p> | <p> | ||
| - | <a href="http://creativecommons.org/licenses/by/3.0/"><img style="border:0;width:88px;height:31px" src="http://i.creativecommons.org/l/by/3.0/88x31.png" alt="Creative Commons Attribution 3.0 Unported License!" /></a> | + | <a href="http://creativecommons.org/licenses/by/3.0/"> |
| + | <img style="border:0;width:88px;height:31px" src="http://i.creativecommons.org/l/by/3.0/88x31.png" | ||
| + | alt="Creative Commons Attribution 3.0 Unported License!" /></a> | ||
| </p> | </p> | ||
| </div> | </div> | ||
| Line 130: | Line 142: | ||
| **8** Первый блок контента, озаглавленный 'About Beady Site' не является главной содержательной частью нашего сайта, поэтому сейчас пропустите его, мы вернемся к нему позже. | **8** Первый блок контента, озаглавленный 'About Beady Site' не является главной содержательной частью нашего сайта, поэтому сейчас пропустите его, мы вернемся к нему позже. | ||
| - | **9** Второй блок контента страницы (<div id=“left”>) будет нашим главным блоком, поэтому замените заголовок (Welcome to Beady Site) тэгом шаблона ''<?php get_page_title(); ?> | + | **9** Второй блок контента страницы (<div id=“left”>) будет нашим главным блоком, поэтому замените заголовок (Welcome to Beady Site) тэгом шаблона ''<?php get_page_title(); ?>'' |
| - | '' | + | |
| **10** Все содержимое <div id=“left”> замените тэгом шаблона ''<?php get_page_content(); ?>'' | **10** Все содержимое <div id=“left”> замените тэгом шаблона ''<?php get_page_content(); ?>'' | ||
| - | **11** При желании после тэга можно добавить дату публикации. | + | **11** При желании после тэга можно добавить дату публикации, так выглядит код для публикации даты на русском языке ''<?php setlocale(LC_TIME, 'ru_RU.UTF8', 'ru.UTF8', 'ru_RU.UTF-8', 'ru.UTF-8', 'ru_RU', 'ru'); echo strftime('%d %B, %Y'); ?>''. |
| **12** Следующий div (id=“right”) будет у нас правым сайдбаром, поэтому все его содержимое замените на следующий тэг: ''<?php get_component('sidebar');?>'' | **12** Следующий div (id=“right”) будет у нас правым сайдбаром, поэтому все его содержимое замените на следующий тэг: ''<?php get_component('sidebar');?>'' | ||
| Line 151: | Line 163: | ||
| Итак – формирование файла шаблона окончено. Вот и содержимое файла template.php, которое должно было у вас получиться: | Итак – формирование файла шаблона окончено. Вот и содержимое файла template.php, которое должно было у вас получиться: | ||
| - | <code> | + | <code php> |
| <?php if(!defined('IN_GS')){ die('you cannot load this page directly.'); } | <?php if(!defined('IN_GS')){ die('you cannot load this page directly.'); } | ||
| /**************************************************** | /**************************************************** | ||
| Line 160: | Line 172: | ||
| * | * | ||
| *****************************************************/ | *****************************************************/ | ||
| - | ?> | + | ?></code> |
| - | <!DOCTYPE html> | + | <code php><!DOCTYPE html> |
| <html lang=en> | <html lang=en> | ||
| + | </code> | ||
| - | <head> | + | <code php><head> |
| - | <meta charset=UTF-8> | + | <meta charset=UTF-8> |
| - | <title><?php get_page_clean_title(); ?> — <?php get_site_name(); ?></title> | + | <title><?php get_page_clean_title(); ?> — <?php get_site_name(); ?></title> |
| - | <?php get_header(); ?> | + | <?php get_header(); ?> |
| - | <link href="<?php get_theme_url(); ?>/style.css" rel="stylesheet" type="text/css" media="screen" /> | + | <link href="<?php get_theme_url(); ?>/style.css" rel="stylesheet" type="text/css" media="screen" /> |
| - | </head> | + | </head></code> |
| - | <body id="<?php get_page_slug(); ?>" > | + | <code php><body id="<?php get_page_slug(); ?>" ></code> |
| - | <div id="page"> | + | <code><div id="page"></code> |
| - | <header> | + | <code php><header> |
| - | <a href="<?php get_site_url(); ?>"><img src="<?php get_theme_url(); ?>/images/logo.png" width="303" height="82" alt="<?php get_site_name(); ?>" /></a> | + | <a href="<?php get_site_url(); ?>"><img src="<?php get_theme_url(); ?>/images/logo.png" width="303" height="82" alt="<?php get_site_name(); ?>" /></a> |
| <br /> | <br /> | ||
| - | <img src="<?php get_theme_url(); ?>/images/bg_banner_grey.gif" width="980" height="5" alt="logo_banner" /> | + | <img src="<?php get_theme_url(); ?>/images/bg_banner_grey.gif" width="980" height="5" alt="logo_banner" /> |
| - | </header> | + | </header></code> |
| - | <div id="content"> | + | <code php><div id="content"></code> |
| - | <div class="post"> | + | <code php><div class="post"> |
| - | <h2>About Beady Site</h2> | + | <h2>About Beady Site</h2> |
| - | <p>Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense. </p> | + | <p>Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.</p> |
| - | <p>Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.</p> | + | <p>Bla bla bla a load of old nonsense goes here in this area, move on nothing of interests to read here just a load of old nonsense.</p> |
| <hr /> | <hr /> | ||
| - | </div> | + | </div></code> |
| - | <div id="left"> | + | <code php><div id="left"> |
| <h2><?php get_page_title(); ?></h2> | <h2><?php get_page_title(); ?></h2> | ||
| <?php get_page_content(); ?> | <?php get_page_content(); ?> | ||
| - | </div> | + | </div></code> |
| - | <div id="right"> | + | <code php><div id="right"> |
| <?php get_component('sidebar');?> | <?php get_component('sidebar');?> | ||
| - | </div> | + | </div></code> |
| - | </div> | + | <code php></div> <!-- end-of-"content" --></code> |
| - | <div id="sidebar"> | + | <code php><div id="sidebar"> |
| - | <ul> | + | <ul> |
| - | <li> | + | <li> |
| - | <h2>Menu </h2> | + | <h2>Menu </h2> |
| - | <ul><?php get_navigation(return_page_slug()); ?></ul> | + | <ul><?php get_navigation(return_page_slug()); ?></ul> |
| - | </li> | + | </li> |
| - | </ul> | + | </ul> |
| - | <br /> | + | <br /> |
| - | <p> | + | <p> |
| - | <a href="http://validator.w3.org/check?uri=referer"><img src="images/HTML5_Logo.png" alt="Valid HTML5" /> </a> | + | <a href="http://validator.w3.org/check?uri=referer"><img src="<?php get_theme_url(); ?>/images/HTML5_Logo.png" alt="Valid HTML5" /> </a> |
| - | </p> | + | </p> |
| - | <br /> | + | <br /> |
| - | <p> | + | <p> |
| - | <a href="http://jigsaw.w3.org/css-validator/check/referer"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss-blue" alt="Valid CSS!" /> </a> | + | <a href="http://jigsaw.w3.org/css-validator/check/referer"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss-blue" alt="Valid CSS!" /> </a> |
| - | </p> | + | </p> |
| - | <br /> | + | <br /> |
| - | <p> | + | <p> |
| - | <a href="http://creativecommons.org/licenses/by/3.0/"> <img style="border:0;width:88px;height:31px"src="http://i.creativecommons.org/l/by/3.0/88x31.png" alt="Creative Commons Attribution 3.0 Unported License!" /> </a> | + | <a href="http://creativecommons.org/licenses/by/3.0/"> <img style="border:0;width:88px;height:31px"src="http://i.creativecommons.org/l/by/3.0/88x31.png" alt="Creative Commons Attribution 3.0 Unported License!" /> </a> |
| - | </p> | + | </p> |
| - | </div> | + | </div></code> |
| - | <div style="clear: both;"> </div> | + | <code php><div style="clear: both;"> </div> |
| - | <img src="<?php get_theme_url(); ?>/images/bg_banner_grey.gif" width="980" height="5" alt="logo_banner" /> | + | <img src="<?php get_theme_url(); ?>/images/bg_banner_grey.gif" width="980" height="5" alt="logo_banner" /></code> |
| - | <footer> | + | <code php><footer> |
| - | <?php get_site_name(); ?> | + | <?php get_site_name(); ?> |
| - | © <?php echo date('Y'); ?> | Design by <a href="http://www.html5-templates.co.uk" target="_blank">HTML5 Templates</a> | <?php get_site_credits(); ?> | + | © <?php echo date('Y'); ?> | Design by <a href="http://www.html5-templates.co.uk" target="_blank">HTML5 Templates</a> <?php get_site_credits(); ?> |
| - | <?php get_footer(); ?> | + | <?php get_footer(); ?> |
| - | </footer> | + | </footer></code> |
| - | </div> | + | <code></div> <!-- end-of-"page" --></code> |
| - | </body> | + | <code></body> |
| </html> | </html> | ||
| </code> | </code> | ||
| - | |||
| ====Контент==== | ====Контент==== | ||
| Line 252: | Line 264: | ||
| WYSIWYG- редактор будет намного точнее отображать содержимое страницы, если в папке темы разместить файл ''editor.css'', в который включить основные стилевые правила темы. | WYSIWYG- редактор будет намного точнее отображать содержимое страницы, если в папке темы разместить файл ''editor.css'', в который включить основные стилевые правила темы. | ||
| + | ====== Ссылки ====== | ||
| + | |||
| + | На главную [[ru:|Содержание]] | ||
| + | |||
| + | ===== Страницы этой секции ===== | ||
| + | |||
| + | === Руководства, Советы === | ||
| + | *[[ru:security|Дополнительные меры безопасности]] | ||
| + | *[[ru:how_to:accessibility|Горячие клавиши]] | ||
| + | *[[ru:components-depending-on-the_page|Вывод компонентов в зависимости от страницы]] | ||
| + | *[[ru:SEO for GetSimple|Оптимизация сайта на GetSimple для поисковых систем (SEO)]] | ||
| + | *[[ru:themes:shorttutorial|Лаконичное пошаговое описание создания темы]] | ||
ru/themes/tutorial.1379499473.txt.gz · Last modified: 2013/09/18 10:17 by Arkady
Page Tools
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
