индивидуальный шаблон страницы

Индивидуальные шаблоны для отдельных страниц сайта на WordPress

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

Возможность установки индивидуальных шаблонов для отдельных страниц появилась в 3-й версии WordPress. Раньше были варианты настройки шаблона для отдельной страницы в ручном режиме, нужно было вписывать специальный код с привязкой к id страницы в общий шаблон. Но начиная с WordPress 3.х.х индивидуальный шаблон страницы можно задать прямо из панели администрирования.

Выбор шаблона страницыКоличество пунктов для выбора шаблона и их названия зависят от состава вашей темы. Вопрос отличия темы от шаблона рассматривался в одной из предыдущих статей. У меня имеются базовый шаблон и ещё три варианта.

Как создать свой собственный индивидуальный шаблон для отдельной страницы?

Очень просто. В шаблоны страницы попадают файлы-шаблоны темы, название которых отличается от зарезервированных в WordPress имён. Например index.php — это общий базовый файл темы (шаблон). header.php — шаблон шапки сайта, category.php служит для вывода рубрик и т.п. Нас интересует файл с именем page.php — это специальный файл темы, который отвечает за внешний вид статических страниц. В вашей конкретной теме его может не быть, тогда страницы будут выводиться в соответствии с настройками в файле single.php или index.php, если первого в вашей теме вдруг не будет. Такая в WordPress заложена логика работы.

Для индивидуального шаблона страницы я взял за основу стандартный файл своей темы page.php, скопировал его и переименовал полученный файл в contacts-page.php. Обычный php файл станет файлом шаблона, если добавить в его начало специальный комментарий с названием шаблона.

<?php
/*
 * Template Name: Contacts Page
 * Description: The template for displaying page with contacts and feedback.
 *
 * @package WordPress
 * @subpackage Seorubl-Blog
 * @since Seorubl-Blog 1.3
 */
?>

«Contacts Page» — это имя шаблона, которое отображается в меню настройки свойств страницы.

Как установить на блоге форму обратной связи без плагинов?

В созданный ранее файл contacts-page.php я добавил код для вывода и обработки формы обратной связи.

<?php

if (isset($_POST['submitted'])) {
    if (trim($_POST['contactName']) === '') {
        $nameError = __('Please enter your name', 'twentyeleven');
        $hasError = true;
    } else {
        $name = trim($_POST['contactName']);
    }

    if (trim($_POST['email']) === '') {
        $emailError = __('Please enter your email address', 'twentyeleven');
        $hasError = true;
    } else if (!preg_match("/^[[:alnum:]][a-z0-9_.-]*@[a-z0-9.-]+\.[a-z]{2,4}$/i", trim($_POST['email']))) {
        $emailError = __('You entered an invalid email address', 'twentyeleven');
        $hasError = true;
    } else {
        $email = trim($_POST['email']);
    }

    if (trim($_POST['messege']) === '') {
        $commentError = __('Please enter a message', 'twentyeleven');
        $hasError = true;
    } else {
        $messege = stripslashes(trim($_POST['messege']));
    }

    if (trim($_POST['control']) != true) {
        $controlError = __('Enter the checkbox I\'m human', 'twentyeleven');
        $hasError = true;
    } else {
        $control = trim($_POST['control']);
    }

    if (!isset($hasError)) {
        $emailTo = get_option('admin_email');

        if (trim($_POST['subject']) != '') {
            $subject = trim($_POST['subject']);
        } else {
            $subject = '';
        }

        $body = __('From', 'twentyeleven') . ": $name <$email>\n\n" . __('Messege', 'twentyeleven') . ":\n$messege\n\n--\n" . __('This mail is sent via contact form on ', 'twentyeleven') . get_bloginfo('name') . "\n" . get_bloginfo('url');
        $headers[] = "From: $name";
        $headers[] = "Reply-To: $email";
        /* $headers[] = "To: $emailTo"; */
        wp_mail($emailTo, $subject, $body, $headers);
        $emailSent = true;
        unset($_POST['contactName'], $_POST['email'], $_POST['subject'], $_POST['messege'], $_POST['control']);
    }
}
?>

<div id="feedback">
<h3 class="title-feedback">Форма обратной связи</h3>
<?php if (isset($emailSent) && $emailSent == true) { ?>
    <div class="good">
        <p><?php _e('Thanks, your email was sent successfully', 'twentyeleven'); ?></p>
    </div>
<?php } else { ?>
    <?php if (isset($hasError)) { ?>
        <p class="error"><?php _e('Sorry, an error occured', 'twentyeleven'); ?><p>
        <?php }
    }
    ?>
<form action="<?php the_permalink(); ?>" id="contactForm" class="contactForm" method="post">
<p class="contactName">
    <label for="contactName"><?php _e('Name', 'twentyeleven'); ?></label><span class="required">*</span>
        <input type="text" size="40" name="contactName" id="contactName" value="<?php if (isset($_POST['contactName'])) echo $_POST['contactName']; ?>"/>
        <?php if ($nameError != '') { ?>
            <span class="error"><?php echo $nameError; ?></span>
        <?php } ?>
</p>
<p class="email">
    <label for="email"><?php _e('E-mail', 'twentyeleven'); ?></label><span class="required">*</span>
        <input type="text" size="40" name="email" id="email" value="<?php if (isset($_POST['email'])) echo $_POST['email']; ?>"/>
        <?php if ($emailError != '') { ?> 
            <span class="error"><?php echo $emailError; ?></span>
        <?php } ?>
</p>
<p class="subject">
    <label for="subject"><?php _e('Subject', 'twentyeleven'); ?></label>
        <input type="text" size="40" name="subject" id="subject" value="<?php if (isset($_POST['subject'])) echo $_POST['subject']; ?>"/>
</p>
<p class="messege">   
 <label for="messege"><?php _e('Message', 'twentyeleven'); ?></label><span class="required">*</span>
        <textarea name="messege" rows="10" cols="70" id="messegeText" rows="20" cols="30"><?php if (isset($_POST['messege'])) {
            if (function_exists('stripslashes')) {
                echo stripslashes($_POST['messege']);
            } else {
                echo $_POST['messege'];
            }
        } ?></textarea>
<?php if ($commentError != '') { ?>
            <span class="error"><?php echo $commentError; ?></span>
        <?php } ?>
</p>
<p class="question">
        <input type="checkbox" name="control" id="control" value=<?php if (isset($_POST['control'])) echo "\"".$_POST['control']."\" checked=\"checked\""; ?>/>
		<label for="control"><?php _e('I\'m Human', 'twentyeleven'); ?></label>
<?php if ($controlError != '') { ?>
            <span class="error"><?php echo $controlError; ?></span>
<?php } ?>
</p>
<p class="form-submit">
    <input type="submit" id="submit" value="<?php _e('Send', 'twentyeleven'); ?>"></input>
    <input type="hidden" name="submitted" id="submitted" value="true" />
</p>
</form>			
</div>

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

Мне было лень переписывать код, поэтому я решил организовать работу формы через индивидуальный шаблон страницы контактов. Тем более я не планирую выводить форму для обратной связи где-либо кроме страницы «О блоге». А шорткоды всё-таки чаще используются для вывода кода внутри постов в произвольном месте.

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

<?php _e('Message', 'twentyeleven'); ?>

где «twentyeleven» имя моей базовой темы. Варианты перевода добавляются в языковые файлы темы ru_RU.mo и ru_RU.po с помощью специального редактора. Если у вас нет этих файлов или вы не хотите разбираться с механизмом перевода тем WordPress, то можно перевести сообщения прямо в коде.

Например, код по типу

<?php _e('Message', 'twentyeleven'); ?>

следует заменить на

<?php echo "Сообщение"; ?>

а

" . __('Messege', 'twentyeleven') . "

на простое

Сообщение

У меня получилась вот такая форма обратной связи:

моя форма обратной связиЯ специально стилизовал её под форму комментариев на этом блоге. Также для защиты от спаммеров добавил чекбокс «Я Человек».

В общем, если у вас есть вопросы, предложения или конструктивная критика, пишите мне через форму обратной связи — внимательно прочитаю :-).

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

Индивидуальные шаблоны для отдельных страниц сайта на WordPress
Рейтинг записи

Индивидуальные шаблоны для отдельных страниц сайта на WordPress: 14 комментариев
  1. Ну, ваша тематика, уважаемый П.Ч., потихоньку преходит на более узкий круг подписчиков, которые уже должны владеть хотя бы основами программирования. Да, друзья, это вам не 15 км пройти или отжаться в упоре лежа:-) как в предыдущем марафоне уважаемого Админа. Эй, подписчики, разве я не прав????????????????????????????

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

  2. Вы уже не одни. Заглянула на огонёк. И хотя я пока не владею кодом HTML, но статью просмотрела с интересом. Надо уже осваивать коды, а то иной раз хочется чуть-чуть шаблон подправить, а я смотрю в редактор, как баран на новые ворота. Такие статьи очень даже полезны. Конечно, для не совсем новичков. Мотивируют на изучение кодов.

    1. Очень рад. Хотел сказать, что у вас на блоге и так всё круто, но сейчас посмотрел внимательнее и вижу, что например, кнопка G+ немного выезжает за границы страницы. Есть над чем поработать :-). Могу вам посоветовать хороший сайт для того, чтобы вникнуть в основы HTML и CSS htmlbook.ru — я учился по справочнику автора этого сайта. Информация структурирована, огромное количество наглядных примеров. Есть статьи как для новичков, так и для продвинутых пользователей.

  3. Не знаю, откуда ты взял, что custom templates в WP появились с 3ей версии 🙂 . Они были еще в 2.6 ТОЧНО ПОМНЮ! А скорее всего и того раньше. В 3ей ветке добавились пользовательские типы записей, кажись, и таксономия. Произвольные шаблоны страниц были задолго до неё.

    ну, и твоя, судя по всему, боязнь плагинов, которую я встречаю уже не знаю в который раз у людей, слабо знакомых с php в принципе, ничем не обоснована 🙂 . Поставь себе contact form 7, сделай deregister подключаемых этим плагином файлов .css и .js, а сами коды этих файлов скопируй в свои основные .css/.js- файлики уже подключенные к шаблону. Ну, и на выходе получишь 1 в 1 ту же «нагрузку» на шаблон, если можно так выразиться, только + с настройками всего этого дела из админки и миллионом удобнейших фишек, которые дают плагины 🙂 . Например, те же поступающие с сайта письма/заявки сохранять в БД и удобно затем из админки просматривать при помощи дополнения к contact form 7…

    Я тебе как разраб с 4х летним стажем скажу, что все идеи типа «ла-ла-ла без плагинов» — это такая дурная экономия на спичках и производительности в 0.0000000000000000000000001%, что мне порой смешно становится 🙂 . Pagenavi без плагинов, breadcrumbs без плагинов… Бредятина чистейшей воды :))))) . Нагрузка там добавляется разве что за счет подключения доп. .css/.js файлов, которые также легко отключаются через functions.php и вручную мержатся с нативными файлами темы. И все. Никакой нагрузки и лишних запросов, и нормальная работа в стиле «белого человека» — из админки!

    В общем, не бойся ты так плагинов 🙂 . Contact form 7 ставится и настраивается в 2 минуты. Доп. файлы отключаются и мержатся еще за минуту.

  4. Не могу себя назвать знатоком отличий между версиями WordPress :-). С этой CMS плотно познакомился начиная где-то с версии 2.9. Кстати, в статье я не написал, что custom templates появились в 3-й версии. Я написал, что индивидуальные шаблоны для страниц стало можно назначать из админки. Но в этом утверждении я тоже сейчас уже не уверен, так как откуда я это взял, я сейчас сам найти не могу :-). Раньше точно можно было индивидуальные шаблоны назначать через создание файлов типа page-{id}.php или page-{slug}.php. В общем признаю, что мог допустить ошибку, но не думаю, что она критична в данной ситуации.

  5. Боязни к плагинам как таковой нет. Здесь больше страсть к ковырянию в коде. А мифический выигрыш в производительности — это больше бонус.
    Также плагины — это чей-то чужой код, который мне не подконтролен. Будет автор поддерживать и развивать свой плагин или нет, я не знаю. Встроил он туда вредоносный код или нет, я не знаю. Будет этот плагин работать с новой версией WordPress и как скоро, я не знаю. Про компетентность и профессионализм автора, я тоже ничего не знаю.

    Шутки шутками, а большое количество плагинов нагружает хостинг, хотя бы за счёт лишней функциональности, которая мне может быть сто лет не сдалась. Плюс все эти манипуляции с объединением кода мне лень делать. А посмотришь, как у людей по десятку разных css, js файлов подключено, пяток разных версий jquery, так диву даёшься, как это вообще всё работает. А потом ещё жалуются, почему сайт плохо грузится, непонятные ошибки вылазят периодически.
    Повторюсь, плагинов не боюсь, они у меня даже стоят. Но по минимумому, только то, что мне действительно нужно. И как php программист я, конечно, понимаю, что нет разницы, что ты просто файл подключаешь к теме, что ты подключаешь его через механизм плагинов, в любом случае за всеми специальными wp_функциями скрываются в итоге стандартные функции PHP. А так как wp_функции возможно писали программисты с большим опытом работы, то есть основания полагать, что организованы они грамотно и оптимально, что нельзя гарантировать про самопальные коды, скаченные непонятно откуда из Интернета.

  6. « … без плагинов» — это скорее больше дань SEO, чем экономии :-). У меня, например, давно вкралась мысль, что раздувать своими кодами файл functions.php даже вредно, к сожалению, нет времени изучить этот вопрос более детально. Плагины особенно удобны, когда тебе надо делать несколько сайтов. Плагин быстро поставил и дело в шляпе. А с переносом своих пользовательских кодов ещё повозиться придётся :-).
    А к экономии на плагинах призывают, я так заметил, люди которые далеки от программирования, они услышали звон и повторяют его. Экономить надо, но с умом. Нужно обязательно определиться что в данном случае важнее нагрузка или масштабируемость и удобство.
    Мне, например, ещё не нравятся различные хуки с применением фильтров обработки строк. Внешне выглядит всё удобно, красиво и эффектно. Но я то как программист знаю, что регулярные выражения работают медленно, сильно нагружают сервер и по возможности от них лучше избавляться. Кстати, поэтому мне не нравятся плагины, я не знаю, какие конкретно функции и приёмы в нём применил автор, насколько его код оптимален.
    Ладно, заканчиваю свою писанину, просто давно уже размышлял над этими вопросами, а повода высказаться не было :-).

    1. да, все верно! Я вижу, ты и сам в этом хорошо разбираешься. Тогда оставлю попытки наставить на путь правильный заблудшую душу :)))) . Рад, что ты в теме!

  7. Спасибо за заботу :-). Это очень хорошо, что в мире есть неравнодушные люди, которые не проходят мимо, и пытаются помочь другим людям выйти на правильный путь.

  8. Здравствуйте. Что-то не получилось как у Вас — у меня пустая страница. Использую так же twenty eleven. Скажите пожалуйста, между какими строчками в page.php Вы вставили код. А можете поделиться готовым файлом?
    Спасибо

  9. Слава Богу, нормальное объяснение, про шаблоны для страниц. На других сайтах только однотипный текст. Я так понимаю, что если мне нужно заменить отображение содержимого page, то мне только этого файла копию нужно создать, а header и footer не трогать?

    1. В принципе да, если, вы, конечно, не захотите сделать что-то совсем отличное от базового шаблона.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *