
Все прошлые занятия я мучил Вас минимальным кодом страниц, которые нужны для отображения блога. Сегодня поговорим о том, как сделать оформление не только информативным, но и привлекательным…
Прежде всего, сложите написанные по прошлым урокам страницы в одну папку и добавьте туда же файл style.css, который пока оставьте пустым.
Модульную сетку на странице можно задавать с помощью тегов <table> и <div>.
Слышал я про то, что для поисковиков предпочтительнее слоевая структура, а не табличная, но на поверку это оказалась SEO-шная байка двухлетней давности. С тех пор алгоритм ранжирования несколько раз менялся и теперь поисковикам безразлично какой структуры Ваша страница.
Технология – не очень сложна:
- Загружаем нашу тему на блог (Денвером для локального тестирования запаслись, я надеюсь?)
- Активизируем ее из админпанели и проверяем на синтаксис отображение в браузере. (Страшненькая, правда?)
- Сохраняем страницу из браузера на компьютер и открываем в HTML редакторе.
- Если Вы не убирали комментарии, то легко можете определить принадлежность кода к различным модулям нашего скина.
- Оформляем нашу страницу с помощью тегов табличной <table> или слоевой <div> версткии сохраняем ее. Шрифты и отступы пока не трогаем.
- Используя возможность редактирования файлов темы в админпанели или из PHP Expert Editor-а вносим добавочный код в ранее созданные файлы и смотрим на то, что у нас получилось.
- Нравится? (Да – шаг 8, нет – шаг 3).
- Все промежуточные “скриншоты” в HTML-е отправляем в корзину и на этом на сегодня успокаиваемся.
У меня получилось вот так: abc_theme.zip
Ничего сложного, как видите. Надеюсь, и у Вас получится.
Читайте в этой серии:
Скин для WP своими руками (Вводная часть)
Скин для WP своими руками (header.php)
Скин для WP своими руками (footer.php)
Скин для WP своими руками (sidebar.php)
Скин для WP своими руками (comments-popup.php)
Скин для WP своими руками (search.php)
Скин для WP своими руками (оставшиеся мелочи.php)
Скин для WP своими руками. (Вводная в дизайн)
Скин для WP своими руками. (css — финальный аккорд)
Тема для WordPress — иерархия
Тема для WordPress — CSS
Тема для WordPress — функции
Тема для WordPress – цикл