Статьи Новости Контакты


Игорь Крейн

Построение сайта на движке WordPress

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

WordPress

Статья написана совместно с Владиславом Михеевым

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

Далеко за примерами ходить не надо. Сравнительно недавно один петербургский бизнесмен со вздохом продемонстрировал нам свой новый сайт, производящий весьма удручающее впечатление (неумело отсканированная из рекламного буклета корпоративная символика на главной странице, неуместные похоронные цвета и ни малейшего намека на юзабилити). Как оказалось, при выборе между известной в городе дизайнерской конторой и знакомым программистом администрация фирмы предпочла второй вариант. Что ж, в итоге был получен сайт, изобилующий совершенно излишним кодом, а управление контентом осуществлялось через простой текстовый редактор, причем все правки вносились непосредственно в PHP-файлы. Очевидно, что при наличии желания сэкономить более правильным подходом было бы использовать какую-либо систему управления контентом (благо выбор как коммерческих, так и бесплатных CMS достаточно широк) и заказать (купить или выбрать из имеющихся бесплатных) шаблон.

WordPress подходит для создания не только блогов, но и сайтов другой направленности

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

Тут следует отметить, что WordPress в первую очередь предназначен для ведения блогов, то есть сайтов достаточно специфических. Но это не значит, что эту платформу нельзя применить для чего-то другого.

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

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

Конечно, и у WordPress имеются недостатки, выражающиеся, например, в значительном числе обращений к базе MySQL в процессе генерации каждой страницы. Это вполне может вызвать ощутимое снижение производительности при более-менее серьезной посещаемости сайта. Однако существуют простые методы, позволяющие уменьшить нагрузку на сервер MySQL, и о них мы скажем несколько слов ниже.

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

Сайт, построенный на движке WordPress
Сайт на движке WordPress... не так уж и плохо выглядит

Покончив с установкой WordPress (которая, напомним, выполняется за считаные минуты), мы задались вопросом, как должен выглядеть сайт. Тема по умолчанию однозначно не годилась: во-первых, она слишком распространена, а во-вторых, она заточена лишь под использование сайта в качестве блога. К счастью, имеется немало готовых тем для WordPress, в том числе великое множество полностью русифицированных. Чтобы установить понравившуюся тему, ее достаточно скачать, распаковать архив на локальный диск и при помощи FTP-клиента залить содержимое архива на сайт в папку /wp-content/themes/.

Темы для WordPress бывают простыми и виджет-совместимыми

При выборе темы следует учитывать, что они бывают простыми и виджет-совместимыми. Виджет-совместимость дает возможность через меню "Дизайн" (подменю "Виджеты") легким движением мыши (drag-n-drop) добавлять, удалять и перемещать модули, отображаемые на страницах сайта. Предположим, вам не нужен виджет, отображающий список свежих публикаций в боковой панели. Прекрасно — просто уберите его. Или вы хотите видеть меню навигации по разделам в самом верху сайдбара. Нет ничего проще — перетащите его мышкой в нужное место. Вы считаете, что вашим посетителям не нужен поиск по сайту? Уберите соответствующий виджет; если вы передумаете, вернуть его на место можно будет в любой момент.

WordPress: работа с виджетами
Drag-n-drop в действии

Но если таких возможностей кастомизации вам недостаточно, это еще не повод отказываться от использования WordPress. Ведь всегда можно обратиться непосредственно к разработчику той или иной темы и попросить его внести изменения под ваши нужды: во всяком случае, это обойдется куда дешевле, чем обращение в дизайн-студию. При большом желании пользователь может внести правки и самостоятельно, тем более что это реализуется средствами самого движка: в меню "Дизайн" админпанели имеется пункт "Редактор тем". Конечно, для внесения такого рода изменений крайне желательны хотя бы базовые знания по HTML, CSS и PHP, но в ряде случаев вполне можно обойтись помощью Google и элементарной логикой.

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

Редактор тем поможет заточить сайт под ваши требования

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

Следующий код, обнаруженный в файле шаблона "шапки" (header.php), автоматически формировал главное меню, состоящее из ссылок на страницы корневого раздела сайта:

<ul class="menu">
  <li class="<?php if ( is_home() ) { ?>current_page_item<?php } else { ?>page_item<?php } ?>"><a href="<?php echo get_settings('home'); ?>"><?php _e('Главная'); ?></a></li>
  <?php wp_list_pages('sort_column=id&depth=1&title_li='); ?>
</ul>

Мы заменили этот код на собственный, состоящий из ссылки на главную страницу, команды вывода перечня категорий (рубрик) и команды вывода ссылок на статичные страницы:

<ul class="menu">
  <li class="page_item"><a href="<?php echo get_settings('home'); ?>"><?php _e('Главная'); ?></a></li>
  <?php wp_list_cats('sort_column=id&hide_empty=0&optioncount=0&hierarchical=0'); ?>
  <?php wp_list_pages('sort_column=id&depth=1&title_li='); ?>
</ul>

Далее. По умолчанию на главной странице сайта выводились анонсы публикаций из всех рубрик подряд — на манер обычного блога. Мы же решили ограничиться лишь анонсами публикаций из категорий "Новости" и "Статьи". Для этого пришлось добавить в шаблон главной страницы непосредственно перед командой <?php while (have_posts()) : the_post();) ?>, предназначенной для вывода анонсов публикаций, следующий код (где 1 и 3 — порядковые номера соответствующих категорий в базе данных):

<?php
  if (is_home()) {
    query_posts("cat=1,3");
  }
?>

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

Дополнительные плагины помогут русифицировать даты и автоматизировать типографику

По умолчанию даты публикаций на сайте выглядели несколько не по-русски, например: "1 июль", "28 март". Для решения данной проблемы мы воспользовались плагином MaxSite Russian Date. Для установки этого (да и любого другого) подключаемого модуля достаточно его скачать, распаковать архив и загрузить содержимое в папку /wp-content/plugins/ через FTP-клиент. После этого остается только активировать плагин через админку (меню "Плагины"). Результат тут же отобразится на сайте.

Другой "косметический дефект", который пришелся нам не по вкусу, — это проблемы с типографикой. Конечно, WordPress предоставляет своим пользователям возможность вводить и "правильные" угловые кавычки, и тире, однако всякий раз выбирать эти знаки вручную из таблицы символов в WYSIWYG-редакторе не слишком-то удобно. Мы воспользовались плагином SmartyPants Typographer, который автоматически заменяет "неправильные" кавычки на "правильные", а также превращает сочетание символов «--» в стандартное тире. Перед активацией плагина нам пришлось указать коды символов, которые мы хотели бы видеть в качестве открывающих и закрывающих кавычек (для разных языков эти символы, как известно, могут отличаться):

# Opening and closing smart double-quotes.
define( "SMARTYPANTS_SMART_DOUBLEQUOTE_OPEN", "&#171;" );
define( "SMARTYPANTS_SMART_DOUBLEQUOTE_CLOSE", "&#187;" );

Эти правки вносятся непосредственно в PHP-код плагина. Можно было до закачки плагина на сервер отредактировать файл в каком-либо текстовом редакторе, но мы предпочли воспользоваться встроенным редактором подключаемых модулей WordPress, который доступен в том же меню "Плагины".

Результат работы пары полезных плагинов для WordPress
Русифицированные даты, длинные тире и кавычки ''елочкой''

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

Нагрузку на сервер MySQL можно уменьшить за счет кеширования страниц

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

После установки и активации плагина требуется включить кеш через меню "Настройки" (подменю «WP Super Cache»). Обратите внимание, что для правильной работы плагина необходимо, чтобы в файле .htaccess (который находится в корневой директории сайта) были прописаны правила Mod Rewrite. Нужные команды можно найти здесь же, на странице с настройками плагина. Не забудьте, что после включения кеша изменения, вносимые вами в контент или шаблоны, будут отображаться на сайте не сразу. Впрочем, кеш можно в любой момент очистить вручную на странице с настройками плагина. Здесь же можно задать и регулярность обновления кеша.

Второй способ снижения нагрузки доступен только тем, кто знаком с основами PHP и HTML. Суть здесь состоит в замене PHP-кода с обращениями к базе MySQL простым HTML-кодом в тех случаях, когда это имеет смысл. Для примера заглянем в наш файл шаблона "шапки" (header.php). Поскольку мы не планировали в ближайшем будущем менять ни название сайта, ни его подзаголовок, ни доменное имя, то следующий код:

<h1><a href="<?php echo get_settings('home'); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a></h1><br />
<span class="description"><?php bloginfo('description'); ?></span>

без малейших негативных последствий мы заменили на такой:

<h1><a href="http://autoglossy.ru/" title="Автодейли">Автодейли</a></h1><br />
<span class="description">Автоновости. Кроме шуток</span>

Результат тот же, а обращений к базе на четыре штуки меньше. Подобным образом можно внести изменения и в раздел с метатегами, и в главное меню нашего сайта. Никто не запрещает вносить такого же рода правки и в шаблоны "подвала" (footer.php) и боковой панели (sidebar.php). Недостатком этого метода являются те трудности, которые могут возникнуть в дальнейшем при смене темы сайта.

Теперь работу над первичной настройкой WordPress можно считать завершенной и смело переходить к главному — наполнению сайта.




Скоро на сайте

  • Wordpress

    Серия статей о плагинах к движку WordPrress
  • AJAX

    Проекты и продукты, ориентированные на AJAX
  • Новые сервисы Google

    Обзор новых сервисов Google
 

Copyright © 2003—2018 Все права защищены

При использовании материалов сайта ссылка на hostinfo.ru обязательна

  • хостинг от .masterhost
  • Rambler's Top100