Что такое базовый шаблон WordPress


базовый шаблон wordpress

Подготовительная статья

В этой статье я рассмотрю что такое базовый шаблон WordPress. Практически это создание и подготовка базовых файлов перед «натяжкой» HTML шаблона на движок WP. Эта информация пригодится в будущем. Я не знаю уровень каждого заинтересованного посетителя, поэтому не могу пропустить такие прописные истины. А в следующей публикации мы займемся самым интересным.

В окончании статьи смотрите ссылки на предыдущие материалы. И на использованные в статье материалы. В основном это документация codex.wordpress.org. И ссылочки будут на разделы кодекса.

Ну давайте все-таки начнем по порядку.

Где размещается тема WordPress и базовая структура шаблона WordPress

Темы WordPress находятся в поддиректориях wp-content/themes/. Тут все предельно просто, тема под названием "test" будет расположена в директории wp-content/themes/test/.

А в свою очередь директория темы WordPress обязательно должна содержать всего два файла:
style.css — шаблон стилей темы;
index.php — довольно гибкий файл, и в него можно поместить все — шапку сайта, боковую колонку — сайдбар, подвал темы, зону контента, категории, архивы, страницу поиска и все другие модули сайта. Оба эти файла помещаются в папку с темой.

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

Помимо вышеупомянутых файлов, в теме может (у нас будет) присутствовать файл
functions.php
Этот файл работает как плагин, загружается вместе с инициализацией движка WordPress и служит для расширения функционала WordPress. Мы будем постепенно вносить нужные для работы темы функции.

Наш базовый шаблон WordPress для начала будет состоять сразу из

style.css — стили нашей темы;
index.php — главный шаблон;
functions.php — функционал темы;
header.php — шаблон заголовка темы;
sidebar.php — шаблон боковой колонки;
footer.php — шаблон части страницы — подвала.

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

Итак, давайте начнем создавать наш базовый шаблон WordPress

Пока просто создадим директорию шаблона, пустые файлы, и скриншот темы, а в последующих публикациях разберем подробнее как они подключаются и начнем их наполнение.

На рабочем столе создайте папку с названием startwp — это и будет директория, другими словами папка с темой. Пишите название в нижнем регистре, латинскими буквами. Название может быть любым, но пока лучше просто повторяйте за мной.

Далее в этой папке создайте несколько пустых файлов:

style.css — стили нашей темы;

index.php — главный шаблон;

functions.php — функционал темы;

header.php — шаблон заголовка темы;

sidebar.php — шаблон боковой колонки;

footer.php — шаблон подвала.

Обратите внимание на расширения файлов, прописывайте их правильно.

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

Пока созданные файлы оставьте как есть. В одной публикации очень сложно все вместить, поэтому следите за появлением свежих статей, в которых продолжим создание темы на WordPress.

Вот исходники к данной публикации

В статье использована документация codex.wordpress.org — создание тем WordPress.

— Я специально создал FeedBerner, чтобы вы не пропустили не одной публикации. Вот ссылка на FeedBurner, просто кликните по картинке :

Feed новостей моего сайта почтой

создание сайта на wordpress

Как скажется беременность на моей фигуре?. Шс 40 02 спу - шкаф сушильный 40 www.amedisin.ru. https://dingo-pamyatnik.ru памятники из гранита купить: купить мраморный памятник.


Похожие по Тегам статьи


17 thoughts on “Что такое базовый шаблон WordPress

  1. Андрей Зимин

    Я думаю, ваша статья для новичков будет полезной.

    1. Егор Автор записи

      Цикл статей по созданию сайта на WordPress c нуля.

  2. Вениамин

    Егор, может вы подскажете, а то на нескольких форумах задавал вопрос — так ничего вразумительного и не дождался.
    На сайте никак не получается сделать так, чтобы фото было такого размера, как на скриншоте выделено красным прямоугольником
    Инспектирую элемент, пытаюсь найти код CSS, отвечающий за увеличение лайтбокса, (чтобы потом вставить в поле темы вордпресс «кастом СSS»), но безуспешно.
    Подскажите пожалуйста, какой код надо вставить в «кастом СSS», чтобы лайтбокс портфолио был на весь экран? Или может быть есть какое-то другое решение, чтобы не рушить сделанное?

    P.S. По совету на форуме, поставил плагин лайтбокса, но он не в приоритете, а штатный лайтбокс вшит в тему, так что отключить не получается.

  3. Егор Автор записи

    Так сразу и не скажешь. Нужно в коде копаться и смотреть. Стили могут быть прописаны и в скрипте. Штатный плагин лайтбокса, который вшит в тему, отключается — так-же как и вшивался. Но еще раз скажу, все темы выполнены по-разному, поэтому никакой конкретики. А стандартный лайтбокс да, смотрится не очень.

    По мне так исходный вариант нормально. Не зра же его так верстали и оформляли стилями. Там много ньюансов, измените стили — может быть некорректное отображение на мобильных, или еще где-то криво вылезет.

    1. Вениамин

      Если на то пошло, то как его (вшитый лайтбокс) отключить?

      1. Егор Автор записи

        Я же написал, что подключают разрабы по разному. Где подключен в коде там и отключать 🙂

  4. Василь

    Вениамин, неужели не уразумели? В личку автору — и за денежку. )) Даже вон и пункт есть — «Мои услуги».
    Я не в обиду автору. Кто как может сейчас зарабатывает. Ну, а бесплатный сыр известно где…))

    1. Егор Автор записи

      Да нет, не так все.
      Если на то пошло, то как его (вшитый лайтбокс) отключить?
      Это корректный вопрос? Как вы думаете?
      На такой вопрос могу ответить так же корректно: Закомментируйте в коде участок, отвечающий за вывод лайтбокса…
      Пойдет?
      А теперь вам вопрос — а где отключить лайтбокс? Попробуйте ответить….

  5. Василь

    » Элементарно, Ватсон…» Отключить нужно там, где его и подключили.. /*… ))))))))
    А если серьезно, то вы правы, Егор.
    И громадное спасибо за ваш труд.
    И еще. Мне бы каркас вашего шаблона..ммммм, ну или тоже простого, без наворотов. Вот не поверите, неделю ищу уже… либо в кодах шифры типа VBCGHJFJDGJUKFH… либо навороты…. нет чистых шаблонов. Может поможете? )))

    1. Егор Автор записи

      У меня стоит шаблон Twenty Thirtee. Я его использовал в качестве Framework (основа, функционал), разметка вся моя и стили, плюс скрипты добавил для расширения функционала.
      А шрифты можно любые подключить элементарно. Смотрите на Google Fonts, или WebFont.

  6. Василь

    Егор, так и не убрал replytocom… плодятся они у вас…

    Скопируйте этот код и вставьте вместо того где у вас выводится кнопка «Ответить».

    ========================================

    <?php printf('Ответить’,$comment->comment_ID,$comment->comment_ID,$comment->comment_post_ID); ?>

    ========================================

    Этот код нужно вставить в function.php если вы решили дать дублям 404 ошибку.
    Решить что лучше редирект или 404 ошибка — вам выбирать… Изначально рекомендую поставить редирект.

    ========================================

    add_filter(‘template_redirect’,’Redirect404′);
    function Redirect404()
    {
    $p=strpos($_SERVER[‘REQUEST_URI’],’/’.’attachment’.’/’);
    if($p!==FALSE) {

    @header(«HTTP/1.0 404 Not Found»);
    die();
    }

    if ( isset( $_GET[‘replytocom’] ) ) {

    @header(«HTTP/1.0 404 Not Found»);
    die();
    }

    if ( isset( $_GET[‘attachment_id’] ) ) {

    @header(«HTTP/1.0 404 Not Found»);
    die();
    }
    }

    ========================================

    Закрыть только replytocom:

    ========================================

    add_filter(‘template_redirect’,’Redirect404′);
    function Redirect404()
    {
    if ( isset( $_GET[‘replytocom’] ) ) {

    @header(«HTTP/1.0 404 Not Found»);
    die();
    }
    }

    ========================================

    Чтобы дополнительно дать 404 ошибку какой-то странице, то добавьте в function.php код:

    if ( isset( $_GET[‘здесь текст url’] ) ) {

    @header(«HTTP/1.0 404 Not Found»);
    die();
    }

  7. Егор Автор записи

    Я не буду ничего ставить. У меня нет ни одного дубля. Надо хоть проверить было
    site:filwebs.ru replytocom
    Это все делается по другому.

  8. Василь

    Почему-то при наведении на «ответить» в нижнем левом углу браузера появляется надпись…. А впрочем, вам виднее.
    Извините за бесцеремонность.
    С уважением.

  9. Егор Автор записи

    Там стоит обычный редирект в файле .htaccess на эту же страницу. Все, ничего выдумывать не нужно.
    Насчет шаблона, я его делал под себя, поэтому там все настройки в коде. Вы не сможете, вероятно, настроить его. Прямо советую вам брать и устанавливать шаблон Twenty Twelve — офигенный шаблон, и настраивать его под свои нужды. Потихоньку, пошагово. Он действительно чистый. А все с наворотами шаблоны сделаны на framework, с массой тормозных функций.

    Что? Написать статью пр подключение шрифтов на WordPress? 🙂 Могу пока время есть прямо сейчас. Думаю и другим посетителям может быть полезна статья, да и мне пригодится.

  10. Василь

    Егор, поставил шаблон Twenty Twelve. У меня такое впечатление , что он вообще чистый и + отзывчивый уже..)) …Так это ж сколько работы предстоит! Надеюсь на Ваши статьи и помощь.
    Подскажите, мой куцый мозг никак, — подключена ли библиотека jquery?

  11. Егор Автор записи

    Здравствуй, давай уже на ты ! Библиотека jQuery уже подключена, она в самом движке присутствует.
    Хоть немного есть понимания HTML, CSS ?

  12. Егор Автор записи

    Первым делом определись, что тебе нужно. Какой дизайн и какой функционал. 1. Обязательно установи сразу плагин Rus-To-Lat и в настройках выбери отбражение ссылок по названию записи — Название записи, ну это так, лирическое отступление.
    А шаблон Twenty Twelve действительно классный. Просто внешний вид немного подводит, но это не беда.
    2. Погугли сервисы шрифтов для сайта (именно для сайта Web шрифты смотри) и смотри которые поддерживают русский язык. Выбери несколько вариантов и выбери декоративный шрифт для заголовка (можно и не декоративный) Потом поставим шрифты и посмотришь какой лучше смотрится уже на сайте.