Табы и вкладки: 6 блоков с переключением

Вкладки прячут несколько блоков контента за одним переключателем: человек нажимает «Москва» или «Доставка» и видит только нужное. Шесть вариантов — вкладки слева, справа или сверху, светлые и тёмные.

Собрать сайт бесплатно 6 блоков в категории

Когда нужны эти блоки

Полезно там, где информации много, а место на экране дорого: города, тарифные условия, вопросы по разделам, разные категории услуг.

Что умеют

  • Вкладки сверху, слева или справа
  • Свой заголовок и содержимое в каждой вкладке
  • Текст и картинки внутри вкладки
  • Цвет активной вкладки

Чего не умеют

  • Вложенные вкладки внутри вкладки
  • Открытие конкретной вкладки по ссылке извне
  • Больше пяти-шести вкладок — они перестают помещаться на мобильном

Все блоки категории «Табы»

Каждый блок ставится на страницу одним кликом. Тексты, картинки и цвета меняются прямо на сайте — без вёрстки.

Вкладки справа — синие — блок для сайта, конструктор Fo.ru

Вкладки справа — синие

Вкладки в правой колонке, содержимое слева, синие кнопки

табывкладкипереключениеразделысправа
Вкладки справа — тёмные — блок для сайта, конструктор Fo.ru

Вкладки справа — тёмные

Вкладки справа тёмными кнопками, содержимое во всю ширину

табывкладкипереключениеразделысправа
Вкладки слева — светлые — блок для сайта, конструктор Fo.ru

Вкладки слева — светлые

Вкладки в левой колонке светлыми кнопками, содержимое справа

табывкладкипереключениеразделыслева
Вкладки слева — красные — блок для сайта, конструктор Fo.ru

Вкладки слева — красные

Вкладки слева красными кнопками, содержимое справа

табывкладкипереключениеразделыслева
Вкладки сверху — светлые — блок для сайта, конструктор Fo.ru

Вкладки сверху — светлые

Ряд вкладок над содержимым, светлое оформление

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

Вкладки сверху — тёмные

Ряд тёмных вкладок над содержимым на цветном фоне

табывкладкипереключениеразделысверху

Частые вопросы

Как табы ведут себя на телефоне?

Вкладки переносятся в столбик или сжимаются; проверьте вид в мобильном режиме редактора.

Индексируется ли скрытый текст?

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

Сколько вкладок можно добавить?

Технически несколько, но удобно читаются три-четыре.

Соберите страницу из готовых блоков

Библиотека из 545 блоков доступна сразу после регистрации. Без программирования и без оплаты на старте.

Создать сайт бесплатно