Динамический сайт нужен, когда один шаблон показывает разные записи из управляемого набора данных: карточки услуг, событий или товаров. Для первого результата без программирования соберите небольшую коллекцию, страницу списка и страницу отдельной записи в CMS-конструкторе, затем измените одну запись и проверьте обновление публичного сайта. Если нужно лишь раскрывать меню или менять цвет кнопки, базы данных и динамических страниц не требуется.
Что именно делает сайт динамическим
Слово «динамический» используют в двух смыслах. Браузер может менять вид страницы с помощью JavaScript, например открывать вкладку, при этом исходная страница остаётся одной. Другой случай: сайт берёт данные записи из хранилища и показывает их через общий шаблон. MDN описывает второй случай как формирование ответа по запросу и данным. Для каталога с отдельным адресом каждой записи нужен именно этот подход.
Правило выбора: если информация меняется только в окне одного посетителя, начните с интерактивной страницы. Если администратор должен менять данные в одном месте и видеть новые карточки на публичном сайте, используйте коллекцию CMS. Если нужна регистрация, персональные цены или сложные права, потребуется отдельное проектирование сервера и защиты; простой каталог этого не решает.
Проверка динамики проста: измените одну запись в источнике, опубликуйте и откройте её адрес в новом приватном окне. Если изменение видно без ручной правки шаблона, связь данных со страницей работает.
Понимания, как это устроено, уже достаточно, чтобы начать. На бесплатном эфире сайт собирают за один вечер и показывают, как его выложить.
Посмотреть, как собратьКакие данные подготовить до сборки
Возьмём пример каталога мастерских. Для каждой записи нужны название, короткое описание, категория, изображение с правом использования и уникальный адресный фрагмент. Сначала внесите две или три тестовые записи с разными названиями. Wix рекомендует заранее определить поля и уникальность адресов: одинаковые адресные фрагменты мешают однозначно открыть нужную страницу.
- Название и описание должны быть содержательными, а не копиями одной общей фразы.
- Для каждой записи подготовьте свой адресный фрагмент латиницей и проверьте, что он не повторяется.
- Разделите публичные поля каталога и любые внутренние заметки по разным коллекциям или системам.
- Не храните в публичной коллекции телефоны клиентов, пароли или черновики, которые посетители не должны видеть.
Нельзя считать скрытое поле секретным только потому, что вы не разместили его на странице. Справка Wix по правам коллекций предупреждает, что разрешение чтения для всех может открывать данные и через API. Для публичного примера используйте только сведения, которые действительно можно раскрыть каждому посетителю.
Самое долгое в своём сайте это первый запуск: страницы, домен, публикация. На бесплатном вебинаре по вайбкодингу весь путь проходят вживую, от идеи, описанной словами, до работающего адреса. Опыт в программировании не нужен.
Пройти путь до сайтаКак собрать каталог в CMS-конструкторе
Ниже один конкретный путь в Wix CMS, чтобы проверить идею без серверного кода. Этот пример не означает, что Wix подходит каждому: доступность сервиса, тариф и правила для вашего проекта нужно проверить до переноса рабочего сайта. Общий принцип коллекции и шаблона применим и в другой CMS; выбор движка подробнее разобран в пошаговом плане CMS-сайта.
- Создайте отдельный тестовый сайт и коллекцию CMS «Мастерские». Добавьте поля названия, описания, категории, изображения и уникального адресного фрагмента.
- Заполните две или три безопасные демонстрационные записи. Не используйте настоящие контакты или чужие фотографии.
- В редакторе CMS добавьте динамическую страницу отдельной записи. Свяжите её заголовок, описание и изображение с соответствующими полями коллекции.
- Добавьте динамическую страницу списка. Свяжите элементы списка с полями той же коллекции, а ссылку карточки направьте на страницу отдельной записи.
- Проверьте настройки прав: посетитель может читать публичное содержимое, но не должен добавлять, изменять или удалять записи без вашего намерения.
- Опубликуйте тестовый сайт. Откройте страницу списка и каждую карточку в приватном окне браузера. Измените одну запись в CMS, снова опубликуйте и повторите проверку.
Официальная инструкция Wix описывает создание страницы списка и соединение элементов с коллекцией. Описание динамических страниц уточняет роль страницы отдельной записи: общий макет один, а содержание и адрес меняются по выбранному элементу. Если после подключения поля остаются пустыми, сначала проверьте связь элемента с нужным набором данных, затем наличие значения в самой записи.
По теме: Как сделать сайт в PowerPoint: макет, ссылка и перенос в веб
Как проверить работу после публикации
Не ограничивайтесь режимом просмотра в редакторе. Откройте сайт как обычный посетитель без входа в панель. Сначала проверьте список: все тестовые карточки видны, у них разные заголовки и ссылки. Затем откройте каждую: адрес и содержимое должны соответствовать выбранной записи. Наконец, поменяйте описание одной мастерской в коллекции, опубликуйте и убедитесь, что обновилась именно её страница.
- Новая запись видна в списке и открывается по собственному адресу.
- Старая запись не изменилась после правки соседней.
- В приватном окне посетитель видит публичные данные, но не получает возможность менять коллекцию.
- Пустые поля не оставляют на странице технические заглушки.
- На узком экране карточки и кнопки остаются читаемыми.
Если ваш контент должен попадать в поиск, проверьте также уникальные названия и описания отдельных страниц, доступность ссылок без входа и то, что важный текст виден посетителю. Если платформа закрывает запись или выводит одинаковые пустые страницы, сперва исправьте публикацию и права. Отправка таких URL в индексирование проблему не решит.
Типичные сбои и безопасный выход
Если список пуст, проверьте, есть ли опубликованные записи и связана ли страница списка с нужной коллекцией. Если каждая карточка ведёт на один адрес, проверьте поле ссылки и уникальные адресные фрагменты. Если изменения видны в редакторе, но не на сайте, убедитесь, что опубликовали и данные, и страницы. Если посетитель может менять каталог, сразу ограничьте права коллекции и проверьте доступ снова в приватном окне. Настройки прав Wix позволяют отдельно определить чтение и изменение.
Для отката не удаляйте коллекцию целиком. Исправьте или снимите с публикации одну тестовую запись, сохранив структуру и проверив, что остальные страницы открываются. Когда проект начинает принимать заявки или личные данные, этот учебный каталог перестаёт быть достаточной схемой: понадобятся отдельные требования к форме, хранению, ролям и резервным копиям. Вопрос выбора между сайтом и приложением раскрыт в разборе PWA.
Частые вопросы
Нужна ли база данных для любого динамического сайта?
Для меняющегося списка записей нужен управляемый источник данных. Если требуется только анимация или переключатель, отдельная база не обязательна.
Можно ли сделать каталог без программирования?
Да, если CMS предоставляет коллекции и шаблоны записей. Проверьте возможности и ограничения конкретного плана до переноса настоящих данных.
Почему карточки есть в редакторе, но нет на сайте?
Проверьте публикацию, связь списка с коллекцией и права чтения для посетителей.
Чем динамический каталог отличается от PWA?
Каталог описывает источник и показ данных, PWA описывает возможности веб-приложения при установке и работе в браузере. Одно не требует другого.
После тестового каталога можно перейти к странице для реального проекта и научиться проверять результат работы с ИИ. На воркшопе разбирают создание сайтов на практике.
Записаться на воркшоп