Как сделать многостраничный сайт


Как создать многостраничный сайт самому

Дата публикации: 02-02-2016       13291

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

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

Создание многостраничного сайта

Шаг 1. Определите, какие страницы будут на сайте. Например: Главная страница, О нас, Каталог, Контакты. Затем создаем главную страницу сайта. На ней делаем меню - добавляем для этого соответствующий блок.

 

Шаг 2.  Создаем вторую страницу. Для этого нужно зайти на страницу Проекты и нажать на три точки рядом с кнопкой РЕДАКТИРОВАТЬ. Там вы увидите знаки в ряд, в них нужно выбрать значок "копировать". 

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

Далее делаем и заполняем страничку "О нас". Чтобы создать страницы "Каталог" и "Контакты", делаем все то же самое, что и со страницей "О нас": копируем страницы, "закрываем" значок глаза.

 

Шаг 3.  Важный шаг - создание меню сайта. Переходим в редактор главной страницы и кликаем на меню. Выйдет окно. В этом окне вам нужно кликнуть на каждую строчку меню (например, "О нас", "Контакты" и так далее) и в появившейся строке прописать ссылку на нужную страницу.

 

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

  • сначала перейти в "Настройки проекта" и там в самом низу выбрать строку "Использовать страницы вместо A-B тестирования", активируйте ее. Страница с проектами будет выглядеть примерно так:

  • далее нам нужно прописать URL для страниц. Для этого заходим на сайт Транслит и в окно для русского текста вставляем название страницы (например, "О нас"), нажимаем - Перевести. И копируем то, что сайт выдал. В данном случае: o-nas;
     
  • переходим снова в Проекты, нажимаем на три точки рядом с кнопкой РЕДАКТИРОВАТЬ и из ряда значков выбираем знак редактирования (Карандаш). Появится окно. В нем в строку "URL страницы" (см. скриншот ниже) вставляем то, что скопировали на сайте Транслит. 

Повторяем это с каждой страницей сайта. И затем переходим в режиме редактирования на Главную страницу - в меню. Далее здесь нужно проделать следующее:

  • Кликаем на меню. Появится окно слева. В этом окне нажимаем на нужную строку в меню и увидите справа от строки зеленый квадрат со знаком цепочки.
  • Нажмите на нее и из появившегося списка выберите то, что вам необходимо. Например, "О НАС" (см. скриншот ниже). И так проделываем со всеми страницами.

Не забывайте нажимать кнопки сохранения между выходом из сайтов!


Шаг 4.  Делаем SЕО оптимизацию нашего сайта. Переходим на страницу Проекты. Кликаем на три точки и выбираем первый редактор. Значок с карандашом.

В открывшемся окне сначала активируем галочку у строки "Использовать индивидуальные SEO настройки для этой страницы". И ниже прописываем Title, Description, Keywords на каждую страницу по аналогии с инструкцией - SEO для лендинг пейдж. И так проделываем с каждой страницей. Не забывая сохранять все действия.

 

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

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

  • Открываем редактирование каждой страницы.
  • В настройках меню в главном разделе появилось ID. Копируем его.
  • В редактировании остальных страниц добавляем "Блок-ссылку" и поднимаем её наверх. Туда, где находится шапка сайта. В настройках вставляем ID секции.
  • И эту процедуру проделываем на каждой странице.
  • Сохраняем и проверяем.

Поздравляем! Вы сделали многостраничный сайт своими руками!

Рассказать друзьям:

Как создать многоязычный веб-сайт в Webflow

Если вы хотите вести бизнес на более чем одном рынке, многоязычный сайт больше не является желанным в 2020 году. Хотя это правда, что английский язык доминирует в Интернете, вы может быть удивлен, узнав, что он составляет всего 25% языков, на которых говорят в Интернете.

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

Переведенный веб-сайт особенно важен для предприятий, продающих товары или услуги в Интернете. Полные 75% людей, опрошенных о том, почему язык имеет значение на глобальных веб-сайтах, признали очевидное предпочтение покупок в Интернете на своем родном языке, а 60% людей редко или никогда не покупают на веб-сайтах только на английском языке.

Итак, имея это в виду, давайте рассмотрим варианты добавления языка на ваш веб-сайт Webflow.

2 способа сделать ваш веб-сайт Webflow многоязычным

В Webflow у вас есть несколько вариантов добавления многоязычности на ваш сайт. Давайте изучим их.

1. Дубликаты сайтов и страниц

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

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

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

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

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

2. Использование интеграции Weglot

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

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

Нет никакого ручного перевода страницы за страницей или необходимости дублировать страницы или веб-сайты - Weglot позаботится обо всех технических аспектах создания многоязычного веб-сайта Webflow. Затем вам нужно сосредоточиться только на своем контенте.

После установки Weglot предоставит вам отдельные языковые поддомены, которые отлично подходят для SEO и признаны одним из ключевых компонентов при следовании лучшим методам Google для многоязычного SEO.

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

Давайте быстро рассмотрим, как интегрировать Weglot с вашим веб-сайтом Webflow.

Создание многоязычного веб-сайта Webflow с помощью Weglot

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

Для тех, кто любит смотреть, можете посмотреть это видео:

Для читателей продолжим.

Шаг 1: создайте учетную запись

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

Шаг 2: добавление проекта

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

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

Шаг 3. Настройка записей DNS

Создайте свои поддомены, настроив записи DNS. Это можно сделать в учетной записи поставщика доменного имени. Найдите вкладку DNS и создайте новую запись CNAME.

Добавьте код языка для языка, который вы добавляете, в поле "Имя", а в поле "Данные" добавьте sites.wegot.com. Затем нажмите Проверить DNS.

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

Шаг 4: добавление собственного кода в Webflow

Скопируйте и вставьте фрагмент кода JavaScript из своей учетной записи Weglot. Затем перейдите в админку Webflow в разделе «Настройки» → «Пользовательский код». Перейдите в Head Code и вставьте код Weglot в свой тег .

Шаг 5: сохраните и опубликуйте

Сохраните и опубликуйте изменения. Вот и все - теперь у вас есть многоязычный веб-сайт Webflow.

Webflow и Weglot в действии. Создано Finsweet.

Технические аспекты перевода сайта

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

Многоязычный SEO

Многоязычное SEO - важный фактор при переводе вашего сайта.Если решение, которое вы планируете использовать, не принимает во внимание многие аспекты SEO, оно может повлиять на видимость вашего недавно переведенного веб-сайта.

Вы решаете добавить на свой веб-сайт дополнительные языки, чтобы выйти на новые рынки. Но если вы используете решение, которое не включает языковые субдомены, то маловероятно, что ваша новая аудитория найдет вас из-за штрафов за дублирование контента со стороны Google.

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

Возможности редактирования

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

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

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

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

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

Навигация

Одним из наиболее важных аспектов добавления языка на ваш веб-сайт Webflow является повышение удобства работы посетителей вашего веб-сайта.

Поэтому важно дать посетителю вашего веб-сайта возможность изменить язык своего веб-сайта с помощью переключателя языка.Если вы используете Weglot в качестве решения для перевода Webflow, вы получите интерфейсный переключатель языков, автоматически добавленный на ваш сайт.

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

И это упрощается благодаря удобному набору пользовательского интерфейса Weglot, включающему 14 настраиваемых переключателей языка, которые можно клонировать и добавлять на свой веб-сайт.Посмотрите обучающее видео здесь.

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

Заключение

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

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

.

css - как создать несколько страниц в html

Переполнение стека
  1. Около
  2. Товары
  3. Для команд
  1. Переполнение стека Общественные вопросы и ответы
  2. Переполнение стека для команд Где разработчики и технологи делятся частными знаниями с коллегами
  3. Вакансии Программирование и связанные с ним технические возможности карьерного роста
  4. Талант Нанимайте технических специалистов и создавайте свой бренд работодателя
.

Легко создать многоязычный веб-сайт (Практическое руководство и рекомендации)

Нужен способ создать многоязычный веб-сайт?

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

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

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

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

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

  • Нетехнический .Вы будете использовать простой визуальный интерфейс для перевода своего контента - никаких технических знаний не требуется.
  • Доступный . Фактически, многие из инструментов, которые мы используем в этом руководстве, на 100% бесплатны.
  • Быстро . Самое главное, вы можете настроить это быстро. Вы даже можете использовать службы машинного перевода, такие как Google Translate и Deepl, чтобы ускорить процесс.

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

Готовы начать? Давайте углубимся в…

Как выбрать лучшую платформу для многоязычного веб-сайта

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

Существует два основных подхода к созданию веб-сайта в современной сети:

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

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

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

Самостоятельный WordPress .

WordPress - это , безусловно, , самый популярный способ создания любого типа веб-сайта. Его популярность превосходит популярность как конструкторов веб-сайтов, так и других автономных систем управления контентом. Фактически, WordPress поддерживает более 35% всех веб-сайтов в Интернете.

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

И да, ядро ​​WordPress 100% бесплатно .

Почему WordPress - лучшая платформа для создания многоязычного веб-сайта

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

Вот конкретные причины, по которым мы рекомендуем WordPress для многоязычного веб-сайта:

  • Ядро программного обеспечения WordPress на 100% бесплатное.
  • Вы можете расширить свой сайт WordPress тысячами бесплатных и платных плагинов.
  • Вы получаете доступ к простым инструментам визуального перевода, таким как TranslatePress.
  • WordPress оптимизирован для SEO, что упростит ранжирование переведенного контента в Google и других поисковых системах.
  • Вы можете контролировать внешний вид своего сайта с помощью тысяч бесплатных и платных тем.
  • Программное обеспечение WordPress является безопасным, и вы можете еще больше повысить безопасность с помощью плагинов безопасности WordPress.

WordPress позволяет использовать визуальный редактор TranslatePress

Одним из расширений, к которому WordPress предоставляет вам доступ, является TranslatePress, которое позволяет переводить ваш сайт WordPress с помощью удобного визуального интерфейса, такого как:

Это намного на быстрее и удобнее, чем практически любая другая платформа веб-сайтов, на которую вы посмотрите.

Чтобы еще больше ускорить процесс, TranslatePress также дает вам возможность автоматически переводить ваш сайт с помощью Google Translate или DeepL.

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

TranslatePress Multilingual

TranslatePress - это самый простой способ перевести ваш сайт WordPress. Это быстро, не замедлит работу вашего сайта, работает с ЛЮБОЙ темой или плагином и оптимизировано для SEO.

Скачать плагин

Кроме того, TranslatePress также помогает реализовать ряд передовых методов работы с многоязычными веб-сайтами.Кстати о…

Семь передовых методов создания многоязычного веб-сайта

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

Вот на что обратить внимание…

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

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

Однако, если вы хотите добиться этого преимущества, вам нужно сделать упор на многоязычную поисковую оптимизацию (SEO).

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

У нас есть целая статья о передовых методах многоязычной поисковой оптимизации, но некоторые из тактик, которые вы захотите применить, следующие:

  • Комплексные переводы - сюда входит не только ваш текст, но и ярлыки URL-адресов и метаданные SEO.
  • Многоязычная карта сайта в формате XML - помогает Google находить весь ваш контент на всех языках.
  • Оптимизированная структура URL - мы поговорим об этом подробнее в следующем разделе, потому что это влияет не только на многоязычное SEO.
  • атрибут hreflang - это помогает Google понять, какую версию вашего веб-сайта предоставлять на разных языках.

TranslatePress может помочь вам реализовать все эти многоязычные передовые методы SEO.

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

Чтобы ранжировать каждый язык на вашем сайте в Google, вам необходимо дать каждой языковой версии свой собственный URL.

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

Существует три основных стратегии построения URL-адреса вашего многоязычного веб-сайта:

  • Подпапки - например, ваш сайт.com / content для вашего основного языка и yoursite.com/es/content для ваших переводов на испанский.
  • Поддомены - например, yoursite.com/content для вашего основного языка и es.yoursite.com/content для ваших переводов на испанский.
  • Отдельные домены - например, yoursite.com для вашего основного языка и yoursite.es для ваших переводов на испанский.

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

TranslatePress автоматически использует подпапку - никаких технических настроек не требуется.

3. Обратите внимание на время загрузки страницы

Быстрая загрузка вашего сайта важна для всего, от взаимодействия с пользователем до SEO, взаимодействия и даже коэффициента конверсии вашего сайта.

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

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

4. Добавьте удобный переключатель языков

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

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

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

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

  • Показать язык в его местном формате . Например, Deutsch (правильно) vs German (неверно). Это позволяет людям быстро узнавать свой язык, даже если они не говорят по-английски.
  • Не полагайтесь только на языковые флаги . Хотя допустимо включать флаги в дополнение к названию на местном языке , использование языковых флагов само по себе вызывает затруднения.Например, на некоторых сайтах используется флаг Мексики для испанского языка, а на других - испанский. Это добавляет ненужной путаницы.

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

5. Автоматическое определение языков посетителей

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

Есть два способа сделать это. Вы можете перенаправлять посетителей на основе:

  • Язык их браузера, который является предпочтительным языком, выбранным посетителем.
  • Есть IP-адрес, который является их географическим положением.

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

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

6. Обратите внимание на дизайн и верстку на разных языках

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

Например, должен ли заголовок занимать две или три строки? Умещается ли текст кнопки в одну строку? И т. Д.

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

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

7. Сосредоточьтесь на полной локализации, а не только на тексте

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

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

Например, вы можете захотеть использовать разные изображения / видео для разных языков или отображать разные пункты меню для каждого языка (, а не просто переводить одни и те же пункты меню на разные языки ).

С WordPress и TranslatePress вы также сможете учесть эти мелкие соображения.

TranslatePress Multilingual

TranslatePress - это самый простой способ перевести ваш сайт WordPress. Это быстро, не замедлит работу вашего сайта, работает с ЛЮБОЙ темой или плагином и оптимизировано для SEO.

Скачать плагин

Как создать многоязычный веб-сайт с помощью WordPress

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

1. Настройте свой сайт WordPress на родном языке

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

Но вот основы…

Сначала вам нужно:

  1. Выберите хостинг WordPress. - SiteGround - хороший доступный вариант, который работает для большинства многоязычных сайтов WordPress.
  2. Купите доменное имя - вы можете приобрести свое доменное имя при подписке на SiteGround.
  3. Установите основное программное обеспечение WordPress. - SiteGround включает в себя приветственный мастер, который упрощает установку WordPress - никаких технических знаний не требуется.

Когда у вас будет базовый сайт WordPress, вам потребуется:

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

Если вы хотите немного большей гибкости в дизайне, вы можете предпочесть плагин для создания страниц WordPress, например Elementor. Это добавляет WordPress более «похожий на Wix» или «Squarespace» дизайн, который предпочитают некоторые пользователи.

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

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

2. Установите TranslatePress и выберите язык (а)

После настройки одноязычного сайта WordPress вы готовы перевести его на один или несколько новых языков.

Для этого вы можете использовать бесплатный плагин TranslatePress, о котором мы говорили выше. Начните с посещения Plugins → Add New на панели инструментов WordPress и установки бесплатного плагина TranslatePress с WordPress.org.

После того, как вы установили плагин, перейдите в «Настройки » → TranslatePress , чтобы выбрать языки, которые вы хотите предложить на своем сайте.

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

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

3. Настройте автоматический перевод (необязательно)

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

  1. Google Translate - доступен в бесплатной версии TranslatePress .
  2. DeepL - требуется платная версия TranslatePress .

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

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

Если вы все же хотите настроить автоматический перевод, перейдите на вкладку Автоматический перевод в настройках TranslatePress.

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

Хотя TranslatePress не взимает дополнительную плату в зависимости от вашего использования перевода, Google Translate и DeepL взимают плату (хотя Google Translate предлагает ограниченную бесплатную квоту):

4. Переведите содержимое с помощью визуального редактора

Теперь вы официально готовы приступить к переводу содержания своего веб-сайта.

Чтобы открыть визуальный редактор TranslatePress, перейдите на страницу, которую вы хотите перевести, и нажмите опцию Translate Page на панели инструментов WordPress:

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

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

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

Если вы переводите свой сайт с нуля, вы будете видеть пустое поле, пока не добавите перевод:

Это так просто!

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

Например:

Хотите перевести текст кнопки и URL? Просто щелкните значок карандаша!

Хотите «перевести» изображение, чтобы посетители видели другое изображение в зависимости от выбранного ими языка? Используйте тот же значок карандаша!

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

У нас есть подробные руководства о том, как перевести некоторые из наиболее распространенных элементов многоязычного веб-сайта:

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

5. Оптимизируйте свой переключатель языка (дополнительно)

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

Если вас устраивает такое поведение и местоположение, вам не нужно и пальцем пошевелить.

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

Чтобы получить доступ к этим настройкам, перейдите в Настройки → TranslatePress .

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

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

Запустите свой многоязычный веб-сайт сегодня

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

Благодаря своей гибкости и популярности WordPress - лучшая платформа для запуска многоязычного веб-сайта.

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

TranslatePress Multilingual

TranslatePress - это самый простой способ перевести ваш сайт WordPress. Это быстро, не замедлит работу вашего сайта, работает с ЛЮБОЙ темой или плагином и оптимизировано для SEO.

Скачать плагин

С TranslatePress на вашем многоязычном веб-сайте будет:

  • Многоязычное SEO лучших практик для ранжирования каждого языка в Google.
  • Быстро загружаемые переводы для удобства пользователей.
  • Полный перевод с возможностью локализации каждого отдельного элемента на вашем сайте, включая изображения, формы и многое другое.

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

  • Улучшенные многоязычные функции SEO и поддержка всех основных плагинов SEO
  • Доступ к службе машинного перевода DeepL
  • Возможность переводить ваш сайт на неограниченное количество новых языков ( бесплатная версия позволяет вам переводить ваш сайт на один новый язык )
  • Специальные аккаунты переводчиков, которые помогут вам работать с внештатными переводчиками или другими службами
  • Автоматическое определение языка

Чтобы максимально использовать возможности многоязычного веб-сайта, ознакомьтесь с полным списком функций TranslatePress.

.

php - Как сделать многоязычный сайт

Переполнение стека
  1. Около
  2. Товары
  3. Для команд
  1. Переполнение стека Общественные вопросы и ответы
  2. Переполнение стека для команд Где разработчики и технологи делятся частными знаниями с коллегами
  3. Вакансии Программирование и связанные с ним технические возможности карьерного роста
  4. Талант Нанимайте технических специалистов и создавайте свой бренд работодателя
.

Смотрите также

Поделиться в соц. сетях

Опубликовать в Facebook
Опубликовать в Одноклассники
Вы можете оставить комментарий, или ссылку на Ваш сайт.

Оставить комментарий