Простые настройки стандартных возможностей WordPress

Лучшее, что есть в WordPress — его гибкость. Не нравится тема? Просто смените ее. Нужен дополнительный функционал? Скорее всего, есть плагин, который вы можете скачать или купить. Если нет, вы можете создать его сами! Вы можете многое изменить в WordPress. В этой статье мы пройдемся по нескольким простым способам настройки WordPress, о которых вы могли не знать раньше.

1. Смена источника jQuery по умолчанию

Еще одна хорошая штука в WordPress — то, что он поставляется с набором разнообразных JavaScript библиотек, включая jQuery. Также у вас есть возможность менять источник этих библиотек в соответствии с вашими потребностями.

Допустим, мы хотим избавить наш сервер от нагрузки, изменив версию jQuery WordPress на какое-то решение, размещаемое на стороннем хостинге (или CDN). Мы можем легко изменить источник jQuery с помощью этой функции:

function add_scripts() {
    wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery', 'http://code.jquery.com/jquery-1.7.1.min.js');
    wp_enqueue_script( 'jquery' );
}

add_action('wp_enqueue_scripts', 'add_scripts');

Здесь мы делаем три вещи.

1. Во-первых, мы используем wp_deregister_script() для того, чтобы сообщить WordPress, что нужно забыть о версии jQuery, которая в данный момент используется.
2. Затем мы используем wp_register_script() для перерегистрации jQuery (как имени скрипта, используя CDN версию jQuery).
3. Наконец, мы используем wp_enqueue_script() для добавления jQuery в нашу тему или плагин.

Нужно отметить, что мы используем add_action(), а не add_filter(), чтобы добавить наши скрипты. Поскольку мы не вносим никаких изменений в контент, а надеемся на то, что WordPress сделает что-то для того, чтобы загрузить наши скрипты, мы используем зацепку за action, а не за filter. Об этом можно прочесть в WordPress Codex.

2. Добавление размеров изображений

Мы знаем, что WordPress устанавливает несколько размеров изображений, которые мы загружаем. А вы знали, что вы также можете (относительно просто) устанавливать свои размеры изображений? И все с помощью двух простых функций. Если у нас есть свое изображение в шапке размером 760 × 300 px для наших записей, мы можем сделать возможность загрузки изображений такого размера с помощью этого кода:

add_theme_support( 'post-thumbnails' );
add_image_size( 'post-header', 760, 300, true );

Первая функция, add_theme_support(), сообщает WordPress, что нужно разрешить новые размеры не только для миниатюр, но и для миниатюр записей и для изображений. Во второй строке, add_image_size(), мы добавляем наш новый размер. Эта функция принимает 4 аргумента: имя, ширину, высоту и нужно ли обрезать изображение.

WordPress также очень не советует использование некоторых зарезервированных имен (то есть: не используйте их): thumb, thumbnail, medium, large и post-thumbnail.

Как только созданы новые изображения, мы можем добавить их в цикл записи для того, чтобы показать их пользователям, например, так:

if ( has_post_thumbnail() ){ 
	the_post_thumbnail( 'post-header' ); 
}

Этот код проверяет, загрузили ли вы изображение и сделали ли его миниатюрой записи. Если это так, WordPress отображает его. Вы также можете добавить изображение по умолчанию.

if ( has_post_thumbnail() ){ 
	the_post_thumbnail( 'post-header' ); 
}else{
	<img src="'. IMAGES .'/default.jpg" alt="Post Header Image" />
}

В таком случае, если у записи нет миниатюры, используется изображение по умолчанию. Ура, готово!

3. Изменение разметки сайдбара

Регистрация сайдбара не требует много усилий. Все, что вам нужно, это имя и ID, чтобы сделать все четким и понятным в административной части.

register_sidebar( array (
	'name' => __( 'Sidebar', 'main-sidebar' ),
	'id' => 'primary-widget-area'
));

WordPress применит для нас разметку по умолчанию, которую мы можем стилизовать, как нам угодно. Тем не менее, мы можем также добавить свою разметку и стилизовать ее как нам угодно. Я предпочитаю использовать блоки div для виджетов сайдбара, поскольку они более корректны, чем списки list. Я также предпочитаю h3 для заголовков виджетов, потому что обычно я резервирую h2 для заголовков постов блога. Так что, держа это в уме:

register_sidebar( array (
	'name' => __( 'Sidebar', 'main-sidebar' ),
	'id' => 'primary-widget-area',
	'description' => __( 'The primary widget area', 'wpbp' ),
	'before_widget' => '<div class="widget">',
	'after_widget' => "</div>",
	'before_title' => '<h3 class="widget-title">',
	'after_title' => '</h3>',
) );

Этот код создаст сайдбар, который выглядит примерно так:

4. Изменение частоты обновления RSS виджета

Встроенный в WordPress RSS виджет фантастический, но иногда он обновляется недостаточно часто. К счастью, есть достаточно простое решение для этого. Просто добавьте этот код в ваш файл functions.php:

add_filter( 'wp_feed_cache_transient_lifetime', 
   create_function('$a', 'return 600;') );

Как видите, мы используем функцию WordPress add_filter(), которая принимает зацепку filter, функцию обратного вызова и (опционально) приоритет. Зацепка wp_feed_cache_transient_lifetime обрабатывает частоту обновления ленты. Мы создаем функцию обратного вызова на лету, используя функцию PHP create_function(). Это одна строка, которая возвращает частоту обновления в секундах. У нас установлена частота обновления — раз в 10 минут.

5. Добавление контента в RSS ленту

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

function add_to_feed($content){
   $content .= "<p>Thanks for Subscribing! You're the best ever!</p>";
   return $content;
}

add_filter( "the_content_feed", "add_to_feed" );

Используя фильтр the_content_feed, который вызывается только тогда, когда лента создана, мы используем функцию обратного вызова для добавления новой информации к содержанию записи. Если мы посмотрим на ленту нашего сайта в Google Reader, мы увидим это:

6. Выделение комментариев автора

Один достаточно распространенный подход — выделение комментариев автора среди комментариев от читателей. Я делаю так у себя в блоге:

Так как нам это сделать? В WordPress до версии 2.7 нужен был дополнительный код для того, чтобы определить, совпадает ли ID автора и комментатора. В моем блоге, я просто проверял, был ли ID комментатора 1, то есть ID администратора. Не очень хорошо, я знаю, но я был молод и наивен (а у блога был лишь один автор).

У версии после 2.7 есть хорошая маленькая функция wp_list_comments, которая выводит комментарии к записи. Даже лучше, она применяет класс .bypostauthor к любому комментарию — да, вы угадали — автора поста. Теперь, чтобы сделать другой стиль комментариям автора, все что нам нужно, это сделать следующее:

.comment { /* Reader comments */
   background: #FFFFFF;
   color: #666666;
}

.bypostauthor { /* Author comments */
   background: #880000;
   color: #FFFFFF;
}

Готово! Легко, не правда ли?

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

<ul class="commentlist">
	<?php wp_list_comments('type=comment&callback=my_comment_display'); ?>
</ul>

Далее, вы создаете функцию my_comment_display(), которая выводит ваши комментарии. Больше информации об этом вы можете найти в Codex.

7. Редактирование опубликованного контента

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

function sig_to_content($content){
   $content .= '<p><img src="'. IMAGES .'/sig.png" alt="Joseph L. Casabona" /></p>';
   return $content;
}

add_filter( "the_content", "sig_to_content" );

Пока что вы использовали функцию add_filter() и обратного вызова. В данном случае, наш фильтр — the_content. Это добавит подпись в конце и постов, и записей. Чтобы отфильтровать страницы, нам нужно просто добавить это условие:

function sig_to_content($content){
   if(is_single()){
   		$content .= '<p><img src="'. IMAGES .'/sig.png" alt="Joseph L. Casabona" /></p>';
   		return $content;
   }
}

Эта функция, is_single(), проверяет, просматриваем ли мы отдельный пост.

8. Создание своего шаблона для таксономии

Я начал использовать WordPress еще в 2004 году. Это было перед тем, как были представлены страницы, плагины и расширенное редактирования. Принимая во внимание эту эволюцию в удивительно гибкую платформу, я помню, как я делал специфические вещи с некоторыми категориями и тегами, используя выражения if в файле шаблона single.php. Сейчас все гораздо проще.

У WordPress есть невероятно сложная иерархия шаблонов. Все сводится к index.php, тогда как шаблоны, такие как page.php и single.php, отображают разные типы контента по разному. Но вы можете сделать что-то конкретное с category.php и даже с home.php.

Как вы могли догадаться, home.php — это ваша главная страница, а category.php отобразит соответствующие записи, когда пользователь просматривает категорию. Чего вы могли не знать, так это то, что вы можете делать что-то для конкретной категории. Создав шаблон под названием category-[slug].php или category-[id].php (например, category-news.php или category-6.php), вы говорите WordPress, "Используй этот шаблон конкретно для этой категории". Я обычно копирую index.php или category.php и редактирую их.

9. Настройка блока поиска

Вы также можете настроить блок поиска, создав шаблонную страницу под названием searchform.php, которая будет включать только форму поиска. По умолчанию (то есть, когда нет searchform.php), вот что мы видим:

<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
    <div><label class="screen-reader-text" for="s">Search for:</label>
        <input type="text" value="" name="s" id="s" />
        <input type="submit" id="searchsubmit" value="Search" />
    </div>
</form>

Я хотел бы выделить кнопку и метку и инструктировать пользователя нажать "Enter" для поиска. Мы можем сделать это, просто создав шаблон searchform.php и добавив код. Вот файл в своем полном виде:

<!--BEGIN #searchform-->
<form class="searchform" method="get" action="<?php bloginfo( 'url' ); ?>">
	<input class="search" name="s" onclick="this.value=''" type="text" value="Enter your search" tabindex="1" />
<!--END #searchform-->
</form>

10. Настройка страницы авторизации в WordPress

Есть несколько способов для этого, в основном они подразумевают использование плагинов. Для начала, давайте найдем способ настройки логотипа (и URL логотипа) на странице авторизации через нашу собственную тему. Настройка URL логотипа проста. Просто добавьте этот код в ваш файл functions.php:

add_filter('login_headerurl', 
	create_function(false,"return 'http://casabona.org';"));

Так же, как с частотой обновления RSS виджета, мы комбинируем add_filter() и create_function() для возврата другого URL (в данном случае, мою домашнюю страницу) при вызове зацепки login_headerurl. Изменение логотипа — теоретически то же самое, но требует немного дополнительной работы:

add_action("login_head", "custom_login_logo");

function custom_login_logo() {
	echo "
	<style>
	body.login #login h1 a {
		background: url('".get_bloginfo('template_url')."/images/custom-logo.png') no-repeat scroll center top transparent;
		height: 313px;
		width: 313px;
	}
	</style%gt;
	";
}

Вы видите, что у нас есть зацепка login_head и функция обратного вызова custom_login_logo(), но вместо add_filter(), мы используем add_action().Разница между ними в том, что add_filter() заменяет некоторый текст или величину по умолчанию, тогда как add_action() предназначена для выполнения некоторого кода в какой-то конкретный момент загрузки WordPress.

В нашей функции обратного вызова мы перезаписываем CSS по умолчанию для логотипа (body.login #login h1 a) изображением, которое мы загрузили в папку нашей темы. Убедитесь, что вы подобрали нужную высоту и ширину. У нас получится что-то вроде этого:

Вы также можете пойти по другому пути и найти множество плагинов, которые помогут вам изменить страницу авторизации прямо из консоли администратора WordPress. Я знаком с Custom Login, но вы вполне можете попробовать еще несколько!

Бонус: Сделайте вводную страницу частью вашей темы

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

Следуйте этим шагам:

1. Создайте новый файл под названием page-splash.php (хотя имя не имеет значения) в папке вашей темы.
2. Добавьте вашу HTML и CSS разметку и все, что еще вам может быть нужно. Идея в том, что разметка и CSS для вводной страницы скорее всего будет отличаться от остального сайта.
3. Вверху page-splash.php, добавьте следующей код, который сообщит WordPress, что это шаблон страницы:
   <php /* Template Name: Splash */ ?>
4. Добавьте два тега, которые сделают вашу страницу страницей WordPress. Где-то в шапке (в идеале, рядом с </head>), добавьте <?php wp_head(); ?>. Прямо перед тегом </body> добавьте <?php wp_footer(); ?>. Сохраните!
5. Перейдите в консоль WordPress и создайте страницу, используя этот шаблон:
   
6. После того, как вы создали страницу, перейдите в Параметры → Чтение, и под "На главной странице отображать" выберите пункт "Статическую страницу". Сделайте первой страницей созданную вами вводную страницу!
   

Заключение

Ну вот! Больше 10 модификаций, которые вы можете сделать в WordPress, используя зацепки, функции и шаблонные страницы. Здесь перечислены те изменения, которые я использую часто, но есть еще множество зацепок для всего, начиная с добавления классов body и заканчивая изменением заголовков перед выводом. Гибкость и отсутствие необходимости изменять ядро — это то, что делает WordPress такой чудесной платформой! А какие ваши любимые трюки? Сообщите нам в комментариях.

Источник: SmashingMagazine.com

Алексей Шевченко

редактор wpcafe

Изучает сайтостроение с 2008 года. Практикующий вебмастер, специализирующий на создание сайтов на WordPress. Задать вопрос Алексею можно на https://profiles.wordpress.org/wpthemeus/