Сен

17 полезных приемов и хаков для WordPress

Всем привет, я — Найко Михаил — дизайнер, иллюстратор и блоггер. Живу и работаю в Москве. Кроме страсти к дизайну и веб-технологиям, люблю кино, спорт и свою девушку) Также смотрите мой блог в веб-дизайне

Фанатов WordPress становится больше с каждым днём, и многие используют этот движок уже просто как CMS. Он настолько прост, что понятен даже новичку-не-программисту. Ниже я покажу несколько приёмов, которые используются многими продвинутым блоггерами, в основном приёмы эти направлены на юзабилити;

1) Динамичная подсветка меню

Как сделать динамичную подсветку меню ,как, пример, тут. Пишем условие: если это первая страница Home / Category / Archive / Search / Single, добавим class=current к тегу li (он будет подсвечиватся как Gallery). Если второй элемент будет «About», добавьте класс «current». и т.д.

 <ul id="nav">
  <li<?php if ( is_home() || is_category() || is_archive() || is_search() || is_single() || is_date() ) { echo ' class="current"'; } ?>><a href="#">Gallery</a></li>
  <li<?php if ( is_page('about') ) { echo ' class="current"'; } ?>><a href="#">About</a></li>
  <li<?php if ( is_page('submit') ) { echo ' class="current"'; } ?>><a href="#">Submit</a></li>
</ul>

2) Динамичные теги в заголовке

Для того, чтобы использовать динамичные заголовки для страниц, пишем в header.php.

<title>
<?php
if (is_home()) {
	echo bloginfo('name');
} elseif (is_404()) {
	echo '404 Not Found';
} elseif (is_category()) {
	echo 'Category:'; wp_title('');
} elseif (is_search()) {
	echo 'Search Results';
} elseif ( is_day() || is_month() || is_year() ) {
	echo 'Archives:'; wp_title('');
} else {
	echo wp_title('');
}
?>
</title>

3) Динамичный контент:

Если хотите, чтобы какой-то контент находился только на первой странице , пишем:

<?php if ( is_home() ) { include ('file.php'); } ?>

Чуть более детально данный вопрос с некоторыми нюансами рассмотрен в статье вывод текста на главную в wordpress + информация про условные операторы.

4) Выделяем посты отдельной категории

Давайте назовём категорию с categoryID 2 — «Feature». Что сделать, чтобы все посты из этой категории выделялись как-то? Нужно добавить в цикл этот код:

 <?php if ( in_category('2') ) { echo ('class="feature"'); } ?>

5) Как сменить тему отдельной категории

Допустим, вы хотите сменить тему для постов какого-то отдельной категории. Для этого можно воспользоваться функцией in_category.
Если по-умолчанию стоит single.php, используйте этот код. Если пост в категории 1 используем single1.php, для категории 2, — single2.php, ну и для других single_other.php.

<?php
  $post = $wp_query- >post;
 
  if ( in_category('1') ) {
  include(TEMPLATEPATH . '/single1.php');
 
  } elseif ( in_category('2') ) {
  include(TEMPLATEPATH . '/single2.php');
 
  } else {
  include(TEMPLATEPATH . '/single_other.php');
 
  }
? >

Буквально недавно в одном из блогов также поднималась похожая тема, пришлось с ее помощью избавиться от внешних ссылок блога.

6) Уникальная тема категории

Что если вы хотите особенную тему для определённой категории? Просто сохраним тему этой категории под именем category-2.php (именно по таком шаблону!). Так, category-2.php будет использоваться категорией categoryID 2, category-3.php — категорией categoryID 3 и т.д.

7) Реклама Google после первого поста.

Довольно просто решаема задача. Для этого нам нужно задать переменную ($loopcounter) в цикл. Если $loopcounter меньше или равно 1, подключается код google-ad.php.

<?php if (have_posts()) : ?>
 
<?php while (have_posts()) : the_post(); $loopcounter++; ?>
 
  // the loop stuffs
 
  <?php if ($loopcounter <= 1) { include (TEMPLATEPATH . '/ad.php'); } ?>
 
<?php endwhile; ?>
 
<?php else : ?>
 
<?php endif; ?>

Query Posts

Query Posts используется для контроля над выводом постов внутри цикла. С его помощью можно управлять тем, что выводить, когда выводить и как выводить.

8) Выводим последние посты

последние 5 постов:

<?php query_posts('showposts=5'); ?>
 
<ul>
  <?php while (have_posts()) : the_post(); ?>
  <li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
  <?php endwhile;?>
</ul>

9) Посты определённой категории

Выводим 5 постов категории с categoryID 2

<?php query_posts('cat=2&showposts=5'); ?>
 
<ul>
  <?php while (have_posts()) : the_post(); ?>
  <li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
  <?php endwhile;?>
</ul>

10) Исключить категорию

Допустим, нам нужно исключить отображение какой- либо категории (categoryID 2):

<?php query_posts('cat=-2'); ?>
 
<?php while (have_posts()) : the_post(); ?>
  //the loop here
<?php endwhile;?>

Произвольные поля (Custom Field )

Custom Field — очень полезная вещь, довольно часто используется для вывода информации после поста. Используется, например, для вывода информации об авторе поста.

11) Как добавить картинку с ссылкой на сам пост

Для начала добавим Произвольное поле в пост.

Чтобы отобразить изображение и прикрепить к нему ссылку на пост, помещаем следующий код в цикл (перед самим текстом поста):

<?php //получаем картинку (custom field) ?>
<?php $image = get_post_meta($post->ID, 'article_image', true); ?>
 
<a href="<?php the_permalink() ?>"><img src="<?php echo $image; ?>" alt="<?php the_title(); ?>" /></a>

Не забывайте, что произвольных полей после поста может быть несколько. Похожий эффект можно увидеть на Best Web Gallery, где подобным образом отображены миниатюры, ссылки URL и подсветка информации. Также о произвольных полях можно почитать в данной статье — использование custom fields в WordPress.

WP List Pages

Тег wp_list_pages используется для отображения списка страниц в хедере и сайдбаре

12)Site map

Для того, чтобы отобразить Site map, достаточно добавить этот код в страницу sitemap.php

<ul>
  <?php wp_list_pages('exclude=12&title_li=' ); ?>
</ul>

Замечу, что pageID 12 исключена, т.к. это страница — сама sitemap.php, и её не нужно отображать…
Метод работает, хотя, наверное, лучше воспользоваться более стандартным методом и построить карту сайта с помощью плагина dagon design sitemap generator.

13) Динамичное субстраничное меню

Добавьте этот код в sidebar.php и он отобразит субстраничное меню, если субстраницы есть на этой странице:

<?php
$children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0');
if ($children) { ?>
 
<ul>
  <?php echo $children; ?>
</ul>
<?php } ?>

14) Тема страницы

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

<?php
/*
Template Name: Portfolio
*/
?>
 
<?php get_header(); ?>
  //the loop here
<?php get_footer(); ?>

При написании или редактировании страницы, справа можно будет увидеть “Page Template”, и там указать нужную тему.

Опции WordPress

Последнее, что мы рассмотрим, будут опиции самого WordPress и блога в целом.

15) Стартовая страница

По умолчанию, WordPress располагает блог на стартовой странице сайта. Но если вы хотите какую-то другую страницу, например, приветствие, то зайдите Admin > Options > Reading.

16) Адреса страниц

По умолчанию , WordPress использует ссылки вида Permalinks www.yoursite.com/?p=123, которе не красивы и не понятны поисковикам. Но можно поменять это в Admin > Options > Permalinks (Параметры > Постоянные ссылки). Неплохой вариант записи адресов вот этот: /%category%/%postname%/

17) Префикс категории

По умолчанию , WordPress использует префикс категорий «category» (напр., yoursite.com/category/cat-name/). Но чтобы заменить его на «article» , зайдите в Options > Permalinks (Параметры > Постоянные ссылки), и ссылки будут выглядеть так: yoursite.com/article/cat-name/

Если хотите, то префикс category можно удалить вообще с помощью специальных плагинов.

Вот такие получились эти 17 приемчиков для WordPress, спасибо Михаилу за них. Напоминаю, что много чего полезного вы также сможете найти в его блоге про веб-дизайн, где собрана масса интересной информации. В принципе, некоторые хаки уже рассматривались, но такого своего рода повторение, не помешает. Где это было возможным я добавил ссылки на полноценные (более подробные) с детальным рассмотрением вопроса. Хотя это больше для новичков, опытным разработчикам хватит приведенного в статье кода, вы, думаю, сможете сами добавить туда, что нужно:)

P.S. Постовой. Для тих, хто планує серйозно зайнятися дизайном будуть корисні Відеоуроки з веб-дизайну – українською! — приєднуйтесь до читачів сайту.
Интернет магазин ЛинзМастер предлагает контактные линзы, цветные контактные линзы, а также растворы и аксессуары.

Оцените статью:

(голосов - 14, средний балл: 5,57 из 7)

Загрузка...

Категории: Возможности; Хаки и секреты;

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

комментариев 39 к статье “17 полезных приемов и хаков для WordPress”

1 2 Далее →

НЕАДЫКВАТ 29.09.2010
Одна из лучших по моему мнению подброк хаков для вп ;)
lilumi 29.09.2010
А критика принимается?

пункт 1 не актуальный, так как вордпресс сам добавляет класс current_page_item для меню страниц и current_menu_item для меню, созданого в wp3.0+

пункт 2 делает плагин All in SEO Pack, который почти всегда и все ставят.

остальные пункты в принципе ок, хотя в них нет ничего из того, чего бы не было в официальном wordpress codex
Евгений 29.09.2010
Седьмым пунктом воспользуюсь. Спасибо за инфо.
Tod 30.09.2010
lilumi, спорить не буду:) все правильно сказано.
lilumi 30.09.2010
кстати в седьмом коде ошибка. в тексте предлагают код гугла вставить в файл google-ad.php а в самом коде вызывается файл ad.php
Блогомут 30.09.2010
Вот спасибо! как раз искал про картинки к постам :)
Бродяга 30.09.2010
С четвертого по шестой пункты, как нельзя кстати, только вчера подумал о том как можно этакое сделать , спасибо
Nomad 30.09.2010
Вот читая такие заметки и понимаешь, что сам ещё лузер)
naikom 03.10.2010
lilumi
там указано не название ad.php , а символическое название файла с рекламой.

а вообще спасибо за дополнения)
Tod 04.10.2010
Nomad, все приходит с опытом)
Владимир 06.10.2010
спасибо за информацию, давно думал попробывать это :)
3netI 23.10.2010
*lilumi 29.09.2010
А критика принимается?…пункт 2 делает плагин All in SEO Pack, который почти всегда и все ставят…*

Не соглашусь: Я, например, на начальном этапе лучше ручками сделаю, что бы потом отсутсвие плагинов не вводило меня в ступор
Piter 29.10.2010
Некоторые, вещи знал, но также нашел много нового, сайту респект
UberGeek 09.11.2010
Прочитав все эти рецепты понял для себя что в WordPress, ели не полный ноль то близкий к нему и расти есть еще куда.
Из всего что здесь написано знал только несколько пунктов, с остальными придется поэкспериментировать чтоб понять как все работает.
Тима 19.11.2010
Статья отличная. Не получилось только 5й пункт осуществить. Скажите пожалуйста куда вставлять этот код?
Роман 20.11.2010
Здравствуйте, скажите пожалуйста как установить стартовую страницу если в Admin > Options > Reading, нету выбора Front page, точнее там вообще нет этих опций, там только сколько постов выводить и кодировка страниц, ну и RSS.

ps версия 3.0.1–ru_RU.
Tod 21.11.2010
Тима, код добавляется в single.php — система попадает на него, а там условие и переходит на другие файлы шаблонов.
Игорь 27.11.2010
скажите пожалуйста как реализовать №9, надо создать новый файл стиля? и туда впихнуть код?
Tod 27.11.2010
Игорь, создавать ничего не нужно, данный код можно применить к выборке постов в файле index.php и архива archiv.php, можно также с помощью похожей конструкции выводить любые посты в сайдбаре — подробнее об этом советы по работе с GoGetLinks для блогов на wordpress.
Yaroslav.CH 27.11.2010
Вывод заголовков в п. 2) сделан не в самом лучшем виде — хотя бы уже потому, что в title должно выводится в том числе и название блога, а этот код не позволит решить эту проблему.

Кроме того, не указано — как выводить заголовок для страницы.

Первый и второй моменты решаются так:
elseif (is_page()) {
echo wp_title(»); echo » | «; bloginfo(‘name’);

где
wp_title(»); — заголовок материала или страницы.
echo » | «; — вывод разделителя «|»
bloginfo(‘name’); — вывод заголовка блога.

В целом это будет работать так, как сделано в заголовке этого же блога.

Остальные моменты — по аналогии.
Yaroslav.CH 27.11.2010
М-да, кавычки покалечили весь код…
Tod 28.11.2010
Yaroslav.CH, суть замечания ясна в любом случае) Спасибо. Для отдельных страниц лучше заголовки плагином выводить.
zi3k 13.01.2011
Спасибо за проделанную работу, статья получилась познавательная и содержательная.
onjee 23.01.2011
Сань. не подскажешь как сделать кнопку Цитировать в комментариях?
zenith 29.06.2011
Вопрос по 5-му пункту: в какое место шаблона вставлять сей код?
Tod 01.07.2011
zenith, этот код добавляется в single.php, хотя сейчас (правильнее) использовать для отдельных категорий разные файлы шаблонов — подробнее об этом было в «официальном кодексе вордпресс».
gsg 05.11.2011
По первому пункту вопрос.
А в каком файле добавлять?
И если можно разжуйте поподробнее. У меня не складывается, что и куда: Если второй элемент будет «About», добавьте класс «current». А если не будет? А если будет не «About»? И как узнать?
Tod 07.11.2011
gsg, добавлять в том файле где у вас меню — на 99% это header.php. Фишка этого хака в том, что вы добавляете меню вручную и прописываете каждый пункт… потом условие IF проверяет — если это страница about, то добавить класс current в этот пункт. Дальше для класса current в стилях style.css нужно прописать стиль для активного пункта меню.
teonote 13.12.2011
Отличная подборка, прочитал много интересного. Спасибо.
Сергей 30.05.2012
Хорошая статья, много нового и полезного узнал.
Правда, в некоторых пунктах не разобрался, но на данном этапе мне это и не надо. Зато буду знать, куда зайти, если что.