Мультиязычный сайт

Всем доброго времени суток.

Два месяца назад пришла очередная идея по извечному вопросу всех веб-мастеров — как расширить аудиторию сайта и привлечь новых уникальных посетителей.

А идея состоит в том, чтоб вылезти из РФ на просторы Запада, Востока, ну и дальше по глобусу, то есть перевести свой сайт на несколько языков и посмотреть — что из этого получится.

Естественно, у такой заморочки сразу же обнаружились как плюсы, так и минусы.

Вернее плюс только один — большинство статей сайта состоят из минимума текста и максимума кода, поэтому особо напрягаться с переводом не придётся.

А вот проблем, связанных с реализацией этой идеи, набралось достаточно,

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

Тернистый — без преувеличения.

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

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

Я покажу конкретное, рабочее и успешное решение задачи.

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

1. Замутить несколько поддоменов и создать несколько разноязыких сайтов с перелинковкой.

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

2. Окучивание своей CMS на предмет создания отдельных папок с разными языковыми версиями и прочими заморочками, обзываемыми страшными словами синхронизация, локализация и т.п.

Мне этот метод не подошёл, так как в программировании я вероплавка, а постигать глубины нет ни времени, ни особого желания.

3. Воспользоваться плагином, который обязан всё за меня создать, синхронизировать и локализовать.

Деваться некуда. Хотя, по полученному в дальнейшем опыту, выяснилось, что плагин никому и ничего не должен.

Это вы должны, если хотите, чтоб за вас всё было сделано, сперва заплатить неплохую денежку, а потом уж получить неплохой плагин.

А если вам платить не хочется, или как я, принципиально отвергаете денежные вложения в сайт, то и получите что нибудь простенькое, да не особо функциональное.

Короче, и понапрягаться придётся, и погуглить, и попеределывать. Хотя, вам-то уже, надеюсь, не придётся.

Как бы там ни было, а методом тыка и веб-матери был выбран бесплатный плагин Polylang. Вроде и инфы много, и поддержка сообщества обещана.

Сразу отмечу — инфа вся поверхностная, а сообщество всё больше нерусское, но даже и таким же неруским на форуме в темах нет ответов.

Только FAQ, и обещание всесторонней помощи после приобретения Pro версии.

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

Скачать Попугая можно здесь, с сайта ru.wordpress.org.

Установка стандартная, так что сразу перейдём к настройкам.

Софт имеет 4 опции, начнём с Languages — выбор языка, или нескольких языков, которые вы хотели бы предложить своим посетителям.

Здесь всё просто и понятно. Плагин определяет все языковые папки, имеющиеся в вашей сборке WordPress и выводит их в списке, который открывается в первом поле опции.

Если какого либо нужного вам языка нет, то гуглите по запросу Как добавить языковую папку в WoedPress.

Как только вы выберите нужный язык, все остальные поля, которые ниже, заполнятся автоматом.

Вам нужно только проставить цифру в последнем поле Order. Обычно основному языку ставится 1, а остальным в порядке возрастания, по мере добавления.

В поле справа будут отображаться все установленные языковые версии, и некоторые данные по ним.

Там же, кстати, их можно удалить, в случае чего.

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

А по началу путал флаги языков, и с первого раза не сохранял перевод некоторых элементов интерфейса.

Следующий пункт Strings translations пока пропустим, и перейдём в Settings (Настройки).

1. URL modifications (Изменение URL)

Здесь выбираем структуру адреса переводов. Все возможные структуры показаны, я выбрал так:

И сохраняем настройки.

2. Detect browser language (Определение языка браузера)

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

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

3. Медиафайлы.

Оставляем активированной, так как картинки останутся прежними.

4. Custom post types and Taxonomies (Пользовательские типы сообщений и таксономии)

Доступно только в Peo версии

5. Synchronization (Синхронизация)

По умолчанию всё синхронизировано — так и оставим.

6. WPML Compatibility (Совместимость с WPML)

Есть такой довольно крутой, и довольно дорогой плагин переводчик WPML, так к вот, наш парень может работать совместно с ним.

Может для каких-то крутых порталов и актуально.

7. 8. и 10. — для Pro версии.

9. Tools

Здесь ставим галочку в чекбокс, чем даём согласие на удаление всех следов плагина, в случае сноса его самого. Как будто может возникнуть желание оставить пару соплей, в случае чего.

В настройках всё. Переходим в Strings translations (Строчные переводы).

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

По умолчанию Строчные переводы откроются на том языке, у которого вы установили Ордер № 1. Кнопка переключения языков находится в верхней части окна.

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

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

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

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

А конкретно — можно менять все данные и оформление в виджетах.

Можно для России и ближнего зарубежья вывести одно меню в сайдбаре, а для всех остальных другое и т.п.

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

Зачем же их переводить и показывать этому остальному миру?

Значит в виджет, который показывает эти рубрики и статьи, можно вбить что-то другое, или вообще оставить пустое поле.

Тогда в русскоязычной версии всё будет показываться как обычно, а в иноязычной — то что вы создадите при переводе.

Вот так. Для своих можно сделать одну навигацию, а для не своих другую.

Отдельный сайт в сайте! Как надо перелинкованный с основным контентом.

Теперь несколько слов о том, как сделать перевод, если не хочется платить переводчику, а свои знания, например в китайском — полный нуль.

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

Например, вот этот пост, для перевода придётся или сократить до предела, или вообще не показывать на другом языке.

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

Во-вторых — проверку перевода можно сделать забивая переведённые нерусские словосочетания в поиск, выбирая из выдачи нечто похожее и проверяя выбранное опять же в переводчике.

Та ещё работёнка.

Первели? Значит оформление страницы готово. Осталось решить с контентом. И вот тут начинается самое интересное и необычное.

Переходим в Записи. Тут уже есть флажки выбранных языков и плюсики под каждым флажком, напротив каждой записи.

Стоит нажать на плюсик, и откроется Добавить запись, пустая страница, привязанная к той записи, напротив которой мы нажали плюсик.

Справа указан язык, на который мы будем делать перевод, а чуть пониже — язык с которого делается перевод.

Я, кажется, ещё не сказал ранее, что перевод контента делается самостоятельно, т.е. плагин сам ничего не переводит.

Ну в общем, по идее, вставляй перевод в редактор, публикуй, и всё, новая статья на другом языке и с другим адресом готова.

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

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

А задача-то была, если помните, нарастить массу сайта статьями и привлечь новых иностранных посетителей.

На деле же получилось вот что.

Статьи-то публикуются, вот только в поиске им появиться оказывается не суждено, так как они остаются в недрах сайта чисто в качестве переводов, а вот в карте сайта XML Sitemap они не появляются, и не пингуются и не индексируются.

Может когда нибудь бот их и обнаружит и проиндексирует, но тут есть ещё один нюанс — переводы публикуются с тем-же числом, которым была написана статья.

Получился странный предмет — новый пост вроде есть, но его как бы нет.

По идее — всё верно. Есть статья и есть её перевод, в чём проблема?

А проблема в том, что не видать нам с неё сколь нибудь ощутимого трафика, как своих ушей.

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

Вот так! За что старались! Иностранные ключи подбирали, в из сетях регались и т.д. и т.п.

Но, этой статьи не было-бы, если бы не было решения. И решение нашлось.

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

Вот тут нужно чётко соблюсти порядок действий.

А именно:

1. Открываем выбранную для перевода запись.

2. В новой вкладе, из консоли, не с помощью плюсика, а из консоли, открываем Добавить запись.

В результате у нас открыто две вкладки — в одной статья в режиме редактирования, в другой редактор с пустыми полями.

3. Во вкладке с пустым редактором переключаем верхним переключателем язык с русского на требуемый.

4. Справа, в виджете Рубрики добавляем новую рубрику, с названием на требуемом языке.

5. Копируем заголовок и статью из первой вкладки и вставляем в пустую.

6. Начинаем работать над переводом во второй вкладке, то есть по мере создания, убираем русский заголовок и текст и вводим перевод.

7. Связываем обе статьи переключателем языков.

Вот тут остановимся поподробнее.

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

Переключатель нужен только на тех страницах, которые переведены.

Вопрос решается предельно просто.

Пишем свой переключатель, и вставляем его в обе статьи после текста.

Моих познаний на это с лихвой хватило.

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

Обратите внимание так-же на адреса, заголовки и сайдбары — всё как и задумано.

А для тех, кому своих знаний недостаточно, я привожу полный код переключателя.

HTML
Вставляется в конце записи

<div class="switch">
  <ul class="topmenu">
    <li><a href="https://starper55plys.ru/en/html-basics/links-html/" class="active"><img src="https://starper55plys.ru/wp-content/uploads/2018/09/EN.jpg" alt="" width="82" height="31" class="alignnone size-full wp-image-20586" /></a>	
      <ul class="submenu">
        <li><a href="https://starper55plys.ru/html/yakornaya-ssyilka/" class="submenu-link"><img src="https://starper55plys.ru/wp-content/uploads/2018/09/RU.jpg" alt="" width="82" height="32" class="alignnone size-full wp-image-20587" /></a></li>
        <!--<li><a href="" class="submenu-link">Meny</a></li>--> Для следующего языка
      </ul>
    </li>
   </ul>
</div>
CSS
Вставляется в конец файла style.css

.switch {
  text-align: center;
  width: 60px;
  position: absolute;
  top: 30px;
  right: 20%;
}
.switch a {
  text-decoration: none;
  display: block;
  transition: .5s linear;  
}
.switch ul {
  list-style: none;
  margin: 0;
  padding: 0;  
}
.topmenu > li {
  display: block;
  position: relative;
  top:0;
  left:0;
  margin-bottom: 2px;
}
.submenu {
  position: absolute;
  left: 0;
  z-index: 5;
  width: 60px;
  visibility: hidden;
  opacity: 0;  
  transform: translateY(10px);
  transition: .5s ease-in-out;
}
.submenu li {
  position: relative;
}
.submenu .submenu {
  position: absolute;
  top: 0;
  left: calc(100% - 1px);
  left: -webkit-calc(100% - 1px);
}
.switch li:hover > .submenu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0px);
}

Вам нужно будет только поставить свои адреса во всех ссылках. Ссылки должны вести со станицы на страницу — не перепутайте.

Картинки вырезаны в Яндекс. Картинках — их там много всяких.

Переключатель ставится на обе страницы, затем первая обновляется, а вторая, новая, публикуется в новой рубрике.

Теперь идем в XML Sitemap и проверяем, появилась ли там новая статья.

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

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

Не большой, но лиха беда начало — сделано пока всего-то 20 постов.

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

После выбора языка верхним переключателем, в Записях отображаются только записи, опубликованные на соответствующем языке.

В Рубриках — только рубрики созданные на этом языке. Та же ситуация со страницами и с меню Станицы.

В старых шаблонах это горизонтальное вордпресовское меню в пределах шапки сайта.

Тут то же, что и с рубриками. Создаём новые страницы, на нужном языке, затем переходим Внешний вид — Меню, создаём новое меню и добавляем в него новые страницы.

Всё. На данном языке в горизонтальном меню будут только страницы, созданные на этом языке.

Как видите, мы действительно создали отдельный сайт, с отдельной админкой, в пределах своего сайта. Что и требовалось.

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

Не знаю как вам, а по моему — просто здорово. И как после такого не отнестись с уважением к плагину Polylang.

Желаю успехов в создании мультиязычного сайта.

Запись опубликована в рубрике Новости. Добавьте в закладки постоянную ссылку.
А так же:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *