Как сделать мультиязычный сайт на WordPress

Ведение блога 06.08.2015 Комментарии: 34 20258 просмотров

Как сделать переключатель языков на сайте WordPressДобрый день, уважаемые читатели! Давненько я Вас не радовал новыми авторскими постами — все время уходит на спецкурс и на подготовку к будущей школе для блоггеров. Но зато есть в загашнике полезный материал о том, как легко можно сделать свой блог мультиязычным. Предоставил его постоянный читатель моих «записок» Виктор Хильчук, автор блога «Типичный украинский блоггер», известный в своих кругах под ником MrVigner. Предоставляю ему слово!

Содержание

Здравствуйте, уважаемые читатели блога «Записки seo-специалиста»!

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

Преимущества и недостатки данного метода

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

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

к меню ↑

Как сделать мультиязычный сайт на WordPress

При организации мультиязычности данным методом можно выбрать два пути:

  • новая языковая версия на поддомене;
  • новая языковая версия в подпапке.

В первом случае адрес будет в формате http://en.site.com, а во втором — http://site.com/en. Я делал по второму примеру, чтобы одним сайтом считалось. Но у меня две версии — русская и украинская, а вот в случае с английской может лучше и на поддомене. В общем, выбор за вами. Теперь к делу.

к меню ↑

Шаг 1 — установка двух и более Вордпрессов

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

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /en/
RewriteRule ^index\.php$ — [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /en/index.php [L]
</IfModule>

Разница между стандартным и представленным выше файлом  .htaccess всего в двух строчках — третьей и предпоследней, где добавлено /en (имя вашей папки, в которой находится Вордпресс). Если этих исправлений не сделать, установленный сайт в папке не будет корректно работать.

к меню ↑

Шаг 2 — создание «переключателя» языков

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

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

Открываем файл functions.php вашего шаблона (темы) и дописываем в конце следующий код:

<? // Активация блока дополнительных данных (my_extra_fields)
add_action(‘admin_init’, ‘my_extra_fields’, 1);
function my_extra_fields() {
add_meta_box( ‘extra_fields’, ‘Дополнительные данные’, ‘extra_fields_box_func’, ‘post’, ‘normal’, ‘high’ );
}
function extra_fields_box_func( $post ){
?>
<p><label style=»font-weight:bold; width:145px; display: block; float: left;»>Англ. версия (url):</label><input type=»text» name=»extra[enurl]» value=»<?php echo get_post_meta($post->ID, ‘enurl’, 1); ?>» style=»width:555px;» /></p>
<input type=»hidden» name=»extra_fields_nonce» value=»<?php echo wp_create_nonce(__FILE__); ?>» />
<?php
}
// включаем обновление полей при сохранении
add_action(‘save_post’, ‘my_extra_fields_update’, 0);
/* Сохраняем данные, при сохранении поста */
function my_extra_fields_update( $post_id ){
if ( !wp_verify_nonce($_POST[‘extra_fields_nonce’], __FILE__) ) return false; // проверка
if ( defined(‘DOING_AUTOSAVE’) && DOING_AUTOSAVE ) return false; // если это автосохранение
if ( !current_user_can(‘edit_post’, $post_id) ) return false; // если юзер не имеет право редактировать запись
if( !isset($_POST[‘extra’]) ) return false;
// Все ОК! Теперь, нужно сохранить/удалить данные
$_POST[‘extra’] = array_map(‘trim’, $_POST[‘extra’]);
foreach( $_POST[‘extra’] as $key=>$value ){
if( empty($value) )
continue delete_post_meta($post_id, $key); // удаляем поле если значение пустое
update_post_meta($post_id, $key, $value); // add_post_meta() работает автоматически
}
return $post_id;
}
//Создаём функйию подключения стилей thickbox
function upload_styles() {
wp_enqueue_style(‘thickbox’);
}
add_action(‘admin_print_scripts’, ‘upload_scripts’); //Регистрируем скрипты в админке
add_action(‘admin_print_styles’, ‘upload_styles’); //Регестрируем стили в админке
?>

После сохранения файла  functions.php можно посмотреть результат работы данной функции. Заходим в админку и переходим на страницу добавления новой записи (поста, статьи). После поля формы ввода текста статьи вы увидите форму «дополнительных данных». Правда, у вас будет только одно поле, а у меня, как видите, еще и «Похожие записи» сделаны через дополнительные поля (да, заполнять приходится вручную, но зато можно указывать разные анкоры).

Результат работы изменений functions.php в админке WordPress для получения мультиязычности

В поле «Укр. Версия (url)», а после вставки кода из примера, текст будет «Англ. Версия (url)», указываем адрес переведенной на другой язык статьи. Например, если другая версия установлена в папке /en/ на основном домене, то адрес статьи можно указать без домена — /en/adres-perevedennoj-stati/. Такой формат позволит избежать лишних проблем при смене домена. В случае установленной на поддомен другой языковой версии, указываем полный адрес переведенной статьи — http://en.site.com/adres-perevedennoj-stati/.

Итак, адреса статей для переключателя мы уже можем ввести, теперь создадим сам переключатель и вставим его в нужном месте нашего шаблона. Он у меня находится в шапке, поэтому переведенный ниже код вставлен в header.php :

<?php if (is_single()) { ?>
<a href=»<?echo get_post_meta($post->ID, ‘enurl’, true);?>»>English</a>
<?php } elseif (is_front_page()) { ?>
<a href=»/»>English</a>
<?php } elseif (in_category(‘2’)) { ?> // 2 — id категории, меняем на свой
<a href=»/category/adres-kategorii-2″>English</a> //адрес категории другой версии
<?php } elseif (in_category(‘3’)) { ?> //3 — id категории, меняем на свой
<a href=»/category/adres-kategorii-3/»>English</a>
<?php } else { ?>
<?php } ?>

Код позволяет отображать переключатель языка на страницах записей, на главной и в категориях. Чтобы сделать последнее, необходимо заменить  id и адреса категорий на свои. По аналогии можно добавлять еще категории.

Пример варианта с переключателем языка

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

  • «2» — id категории в текущей языковой версии сайта, а «адрес категории» — адрес аналогичной категории в другой языковой версии. В общем, тут все понятно.

В принципе, мультиязычность вашего сайта готова — вы имеете две версии веб-ресурса с переключателей языков между ними. Только не забудьте все тоже самое проделать в шаблоне дизайна другой языковой версии, чтобы переключатель был «взаимным» (id и адреса категорий тоже поменять, поскольку они не будут идентичными).

к меню ↑

Шаг 3 — уведомление поисковых систем о другой версии сайта

И хотя посетители сайта уже будут видеть, что ваш сайт доступен и на другом языке, поисковые системы еще не в курсе. Поэтому им очень важно сообщить о другой языковой версии. Почему? К примеру, в случае поддомена получается, что с каждой страницы вашего сайта есть сквозная ссылка на другой сайт. Лучше, чтобы Гугл и Яндекс знали, что это «переключатель языков».

Сообщить им об этом очень просто, достаточно вставить в header.php мужду строчками <head> и </head> следующий код:

<?php if (is_single()) { ?>
<link rel=»alternate» hreflang=»en» href=»http://site.com<?echo get_post_meta($post->ID, ‘enurl’, true);?>»>
<?php } elseif (is_front_page()) { ?>
<link rel=»alternate» hreflang=»en» href=»http://site.com/»>
<?php } elseif (in_category(‘2’)) { ?> // 2 — id категории, меняем на свой
<link rel=»alternate» hreflang=»en» href=»/category/adres-kategorii-2/»> //адрес категории другой версии
<?php } elseif (in_category(‘3’)) { ?> //3 — id категории, меняем на свой
<link rel=»alternate» hreflang=»en» href=»/category/adres-kategorii-3/»> //адрес категории
<?php } else { ?>
<?php } ?>

Код аналогичный тому, что мы использовали для переключателя версий. Заменяем/дополняем все данные на свой лад. И не забываем значение атрибута hreflang менять на необходимое. То есть, если адрес на английскую версию страницы, то hreflang=»en», если на украинскую — hreflang=»uk» и так далее. Подробнее об атрибуте  hreflang можно почитать тут.

к меню ↑

Подведем итоги

Путем установки двух движков WordPress и добавления нескольких строчек кода можно создать полноценный мультиязычный сайт. Главное достоинство такого варианта — полная локализация обеих версий (плюс отдельно можно прописывать мета-теги и т. д., чего не сделаешь плагином). Кроме того, таким образом можно сделать и три, и более языковых версия — но это уже на любителя себя помучать. 🙂

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

С уважением, Виктор Хильчук (MrVigner)

Подписывайтесь на новости сайта!

Вверх