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

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

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

Приступим.

Шаг 1. Определяем, какие именно разделы будут на вашем сайте. 

  • Главная страница, О нас, Каталог, Контакты.
  • Создаем главную страницу сайта.
  • Добавим блок навигация "Меню сайта".
  • Сохраняем блоки.


Шаг 2.  Создаем 2 версию в нашем сайте. 

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

Шаг 3.  Создаем меню сайта

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

■  Например, во вторую вкладку "О нас", необходимо вставить 12536.lp.tobiz.net/?v=20870, но чтобы все правильно работало, мы не вставляем первую часть ссылки. Остается ?v=20870

  • В третью вкладку вставляем по аналогии ?v=20871
  • В четвертую - ?v=20872
  • В первую - ?v=20824

Первая страничка сайта готова.

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

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

 

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

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

Далее мы разберем следующий этап настройки сайта.

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

■  Ставим галочку "Использовать страницы вместо A-B тестирования".

■  После этого страницы будут выглядеть следующим образом:

Согласитесь, так стало намного удобнее!

■  После этого настраиваем ссылки на наш сайт. Чтобы ссылка была красивая и хорошо оптимизированная, воспользуемся инструментом - Транслит Яндекс онлайн. Сюда вставляем название страницы на русском, и переводим на английский транслит. 
Например: О нашей компании

Мы получили: o-nashej-kompanii

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

■   В открывшемся окне вставляем в поле: URL страницы и сохраняем.

   

И так проделываем с каждой страницей. Теперь у нас красивые понятные ссылки на страницы сайта.

■  И последний этап - пишем Title, description, keywords на каждую страницу по аналогии с инструкцией - СЕО для лендинг пейдж.

 

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

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

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

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

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

Cделайте первый шаг

Выберите готовый шаблон сайта из более 3900+ бесплатных и премиум вариантов.

Выбрать шаблон
X
Создайте сайт на конструкторе
прямо сейчас, и мы подарим вам
350 руб. на счет
Нажмите на кнопку, и получите бонус.
На конструкторе сайтов TOBIZ.NET, вы сможете создать сайт своими руками за максимально короткое время. В этом вам помогут 1000 готовых шаблонов и простой конструктор. Просто установите готовый шаблон сайта, отредактируйте его и привлекайте клиентов.
▣ Создать сайт