Индивидуальные шаблоны для отдельных страниц сайта на 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') . "

на простое

Сообщение

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

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

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

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