Как создать свою Wordpress тему: часть первая
После того, как я создал свой экспериментальный блог на базе Wordpress, и мне скинули ссылочку на создание, а точнее верстку шаблона под WP, я решил перевести данную статью для вас. Ну что ж, начнем.После того, как я опубликовал свою первую тему для WP, и создал ещё одну для моего сайта — CypherFS Royale, я задумался, а почему бы мне не написать заметку о том, как создать WP тему из готового шаблона. Я был уверен, что многие люди создают темы для своих сайтов, поэтому начал.Но перед тем как мы начнем, я хотел бы сказать, что эта заметка рассказывает как поставить свой готовый шаблон, метки и другие функции, которые нужны вам, чтобы ваша тема работала превосходно. Я не буду учить вас html, css и php, этим вы должны заняться сами, потому что статей на эту тему очень много. Я уверен, что вы быстро найдете и освоите их.Ну чтож, я разделил данную статью на семь частей.
Система Wordpress устроена так, что наш шаблон мы разобьем на секции: header.php, index.php и другие. Но до этого мы должны создать заготовку. Начинаем с создания пустого html файла. Мы будем рассматривать тему, которая построена именно так:
Сейчас откройти ваш любимый редактор текста, например Notepad ++. Я использую EditPlus. Он обладает подсветкой кода, коэтому его легко использовать. После того, как вы открыли свой редактор, мы начинаем создани шаблона.Вставьте это в свой файл и сохраните как index.html.
- Часть 1 – Шаблон
- Часть 2 – Шапка
- Часть 3 – Главная страница
- Часть 4 – Комментарии
- Часть 5 – Блоки
- Часть 6 – Футер
- Часть 7 – Заключение
Система Wordpress устроена так, что наш шаблон мы разобьем на секции: header.php, index.php и другие. Но до этого мы должны создать заготовку. Начинаем с создания пустого html файла. Мы будем рассматривать тему, которая построена именно так:
<html>
<head>
<title>Моя тема Wordpress</title>
</head>
<body>
</body>
</html>
Это будет заготовка. Сейчас мы должны разделить наш файл на секции: будем использовать тег <div>. Готовьтесь написать к вашей тему css файл. Вставляем теги <div>.<head>
<title>Моя тема Wordpress</title>
</head>
<body>
</body>
</html>
<html>
<head>
<title>Моя тема Wordpress</title>
</head>
<body>
<div id="wrapper">
<div id="header">
header
</div> <!– close header –>
<div id="content">
<div id="main">
main
</div> <!– close main –>
<div id="sidebar">
sidebar
</div> <!– close sidebar –>
</div> <!– close content –>
<div id="footer">
footer
</div> <!– close footer –>
</div> <!– close wrapper –>
</body>
</html>
В коде вы видите, что закрытие тега div я прокомментировал для того, чтобы было видно, где кончается один теги и начинается другой.Хорошо, мы разделил файл на нужные нам секции. Следующим шагом будет разделение нашего html на файлы PHP для того, чтобы мы могл иредактировать свою тему в будущем. PHP файлы, которые мы создали:<head>
<title>Моя тема Wordpress</title>
</head>
<body>
<div id="wrapper">
<div id="header">
header
</div> <!– close header –>
<div id="content">
<div id="main">
main
</div> <!– close main –>
<div id="sidebar">
sidebar
</div> <!– close sidebar –>
</div> <!– close content –>
<div id="footer">
footer
</div> <!– close footer –>
</div> <!– close wrapper –>
</body>
</html>
- header.php – содердиться шапка
- index.php – главная страничка
- sidebar.php – блоки
- footer.php – низ страницы
<html>
<head>
<title>Моя тема Wordpress</title>
</head>
<body>
<div id="wrapper">
<div id="header">
header
</div> <!– close header –>
<div id="content">
index.php<head>
<title>Моя тема Wordpress</title>
</head>
<body>
<div id="wrapper">
<div id="header">
header
</div> <!– close header –>
<div id="content">
<div id="main">
main
</div> <!– close main –>
sidebar.phpmain
</div> <!– close main –>
<div id="sidebar">
sidebar
</div> <!– close sidebar –>
footer.phpsidebar
</div> <!– close sidebar –>
</div> <!– close content –>
<div id="footer">
footer
</div> <!– close footer –>
</div> <!– close wrapper –>
</body>
</html>
На этом все. Следующая часть и оригинал статьи.<div id="footer">
footer
</div> <!– close footer –>
</div> <!– close wrapper –>
</body>
</html>
43 комментария. Просто неимоверное количество.
Пишите, не стесняйтесь!
Интересно, но все же хотелось бы побольше узнать об этом. Понравилась статья!:-)
Всё правильно. Так и нужно.
Ваш комментарий: