Как создать сайт за 159 рублей — пошаговая инструкция для создания разных видов сайтов

Создать сайт можно на CMS или заказать разработку в агентстве, но гораздо проще создать сайт на конструкторе сайтов – это самый быстрый в реализации вариант, не требующий знания программирования и большого бюджета. Конструкторы сайтов предоставляют всю необходимую инфраструктуру для сборки, наполнения, продвижения и дальнейшего ведения сайта. Мы подготовили инструкцию, как самостоятельно создать сайт или лендинг на конструкторе сайтов и выполнить все необходимые настройки.

Как создать сайт за 159 рублей — пошаговая инструкция для создания разных видов сайтов

Конструктор сайтов – что это, как работает и сколько стоит

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

  • 170 готовых блоков и 150 шаблонов, охватывающих актуальные тематики, они разработаны опытными дизайнерами с учетом актуальных технических требований и трендов;
  • интуитивный графический редактор, с ним легко взаимодействуют и новички, и профессионалы;
  • дизайн-блок, позволяющий реализовать нестандартные идеи и выполнить перенос готового макета;
  • создание сайта с помощью нейросети Craftum AI - полностью автоматическое создание сайта, достаточно ввести текстовый запрос;
  • хостинг и бесплатный SSL-сертификат, а также всю инфраструктуру для запуска и ведения проекта в интернете;
  • отсутствие лимитов по количеству страниц, объему диска и трафика во всех тарифах;
  • SEO-инструментарий для продвижения в поисковых системах;
  • разнообразие готовых интеграций, обеспечивающих эффективное расширение основного функционала сайта, настраиваемые формы и калькуляторы;
  • быструю техническую поддержку в режиме 24/7;
  • создание сайта под ключ.

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

Тарифы конструктора Крафтум
Тарифы конструктора Крафтум

Способы создания сайтов на конструкторе Craftum

Рассмотрим доступные методы создания сайтов на Крафтум:

  • шаблоны и блоки. Шаблоны разрабатывают дизайнеры, они имеют логичную структуру и дополнены необходимыми элементами для сбора заявок, оформления товарных карточек и решения других задач. Каждый шаблон – легко редактируемый, доступно изменение визуального и текстового контента, а также управление компонентами – от размера и цвета кнопок до количества строк в форме для сбора контактных данных. Блоки – отдельные элементы, которые легко добавить в шаблон в несколько кликов. Например, вы создаете сайт для специалиста, но в шаблоне не хватает раздела с картой или отзывами: достаточно перейти в каталог, выбрать подходящий блок и загрузить его. Все происходит автоматически, остается произвести редактирование;
  • дизайн-блок. Представлен профессиональным редактором внутри Craftum, однако его нередко используют и новички – это очень просто и интуитивно. Дизайн-блок является чистым листом, позволяющим реализовать любые оформление, структуру и другие параметры. Поддерживает весь функционал стандартных блоков – от редактирования до добавления элементов, для ровного расположения объектов предусмотрена сетка.

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

Как создать интернет-магазин на конструкторе Крафтум с помощью шаблона

Регистрация на платформе

Регистрация занимает меньше минуты, на любой странице конструктора Craftum нужно кликнуть на кнопку «Создать сайт». В открывшемся окне будет доступна форма: введите номер телефона (необязательно) и адрес электронной почты, примите оферту и дайте согласие на обработку персональных данных. На указанный email придет письмо, помимо регистрационных данных, в нем содержатся полезные материалы, позволяющие познакомиться с возможностями конструктора.

Выбор шаблона

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

Кнопка «Просмотр» позволяет познакомиться с шаблоном в режиме предпросмотра
Кнопка «Просмотр» позволяет познакомиться с шаблоном в режиме предпросмотра

Мы будем создавать интернет-магазин десертов: смотрим шаблон, кликаем на «Выбрать» и попадаем в графический редактор.

Редактирование шаблона

На этом этапе изучаем возможности графического редактора, рассмотрим элементы управления:

  • Возврат к домашней странице.
  • Переключение между внутренними страницами сайта, если их несколько.
  • Просмотр отображения на разных типах устройств.
  • Полезные рекомендации по основным настройкам.
  • Отмена действия и возврат к предыдущему действию.
  • Публикация всех внесенных изменений.
  • Настройки страницы: название, состояние публикации, HTML, SEO и другие.
  • Предпросмотр сайта.
  • База знаний.
  • Переход к настройкам контента и дизайна.
  • Управление блоками: сохранение в избранное, перемещение по странице, копирование, удаление и скрытие.
  • Управление фотоном: цвет, фото и видео.
Основные настройки сайта
Основные настройки сайта

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

  • «Контент». Здесь можно прописать заголовок и подзаголовок, настроить кнопки и изображения, задать SEO, а также поработать с CSS и аналитикой;
  • «Дизайн». Необходим для изменения шрифтов, цветов, отступов, изображений и других параметров, влияющих на визуал. Можно полностью сбросить дизайн или провести конвертацию в дизайн-блок;
  • «Форма». Отображается только в блоках с формами, необходима для управления действиями после отправки и передачей данных.
Управление контентом и дизайном есть в каждом блоке
Управление контентом и дизайном есть в каждом блоке

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

Как добавить новый блок
Как добавить новый блок

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

Так выглядит каталог
Так выглядит каталог

Добавление карточек товаров и настройка кнопок

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

Карточка до и после редактирования
Карточка до и после редактирования

Изменение можно выполнить через раздел «Настройки»: нужно выбрать блок «Контент», потом – «Товары». Возле каждой позиции есть настройки (колесико-шестеренка), перейдите в этот раздел, чтобы добавить подпись и заголовок, изменить цену, установить изображение и иконку скидки. Под списком товаров отображается кнопка «Добавить», с помощью которой блок можно дополнить любым количеством карточек.

Управление карточкой через «Настройки»
Управление карточкой через «Настройки»

Отдельный вопрос – кнопки, после клика на которые потенциальный клиент будет перенаправлен на другую страницу или же сможет добавить десерт в корзину. Для управления нажмите на «Контент» → «Кнопки» → «Тип ссылки» и установите необходимую (мы задали добавление товара в корзину).

Так настраиваются все кнопки на сайте, стоит обратить внимание на следующие параметры (находятся в блоке «Контент»):

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

Изменить визуальное отображение можно в разделе «Дизайн», как и в случае с другими объектами.

Настройка корзины и форм

Переходим в каталог и выбираем блок «Корзина» (если его нет), приступаем к настройкам:

  • указываем заголовок и краткое описание;
  • корректируем количество и содержание полей в форме. В готовом варианте собраны имя, телефон, почта и способ доставки – можно добавить новые поля или удалить имеющиеся. Возле каждого поля есть шестеренка – нажмите на нее, чтобы провести редактирование содержимого;
  • после регистрации в платежном сервисе добавляются способы оплаты (об этом расскажем позже);
  • в разделе «Дизайн» можно изменить шрифты, стили, цветовые решения и оформление формы.

В блоке «Форма» настраиваем действия после отправки, например, пользователь будет перенаправлен на другую страницу или же появится всплывающее окно. Дополнительно – выбор метода передачи данных из форм, доступны электронный адрес, Телеграм, Google Таблицы, CRM-система (требуется предварительная интеграция) и Webhook URL.

Настройка корзины
Настройка корзины

Аналогичным образом можно настроить все формы, представленные в интернет-магазине. Для мониторинга стоит подключить системы аналитики (Google Analytics, Яндекс.Метрика).

Контактные данные

Здесь настраиваются:

  • контактные данные: номер телефона и email;
  • адрес и карта, если магазин располагает наземными точками продаж;
  • социальные сети и мессенджеры.

В нашем варианте есть только WhatsApp, дополнительно добавим Телеграм:

  • переходим в настройки, кликаем на «Социальные сети»;
  • нажимаем «Добавить», появится новая соцсеть – кликните на шестеренку, чтобы изменить кнопку;
  • выбираем тип мессенджера, после чего оформление кнопки подстроится автоматически;
  • меняем описание, в соответствующее поле вставляем ссылку на мессенджер;
  • даем разрешение на открытие в новом окне, устанавливаем параметр Nofollow.

Открываем блок «Дизайн», здесь мы можем поработать с оттенками и шрифтами, скруглить или заострить кнопки, установить отступы – отредактировать визуал.

Как настроить блок с контактными данными и картой
Как настроить блок с контактными данными и картой

Создание блога

Для интернет-магазина легко создать блог, необходимый для информирования аудитории и эффективного продвижения по информационным запросам. Переходим в личный кабинет на платформе, выбираем сайт и кликаем на него. Рядом с разделом «Страницы сайта» есть вкладка «Создать блог» – нажимаем. В открывшемся окне указываем название блога и добавляем теги, кликаем на кнопку «Создать».

Как создать блог
Как создать блог

Нажимаем на «Создать статью» и переходим в редактор, здесь есть:

  • поля для названия статьи и добавления основного текста, который можно сопровождать картинками;
  • указание тегов для упрощенной навигации, а также обложки;
  • управление URL-адресом и SEO: title, description, keywords.
Текстовый редактор Крафтум
Текстовый редактор Крафтум

После загрузки статьи нажимаем «Опубликовать», она отобразится в списке и будет доступна для редактирования.

Как собрать сайт-визитку на Крафтум, используя готовый шаблон

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

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

Для создания сайта-визитки на Крафтум предпринимаем следующие действия:

  • заходим в личный кабинет на платформе, если его до сих пор нет – регистрируемся;
Как создать сайт из личного кабинета
Как создать сайт из личного кабинета
  • в личном кабинете кликаем на «Создать сайт», можно собирать до 5 проектов до внесения оплаты за тариф;
  • выбираем «Сайт хореографа», попадаем в каталог шаблонов;
  • мы будем создавать визитку услуги – знакомимся с шаблоном в режиме предпросмотра, кликаем на «Выбрать».

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

Настройка обложки (первого блока)

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

  • меняем фоновое изображение. Можно оставить то, которое предложено в шаблоне, однако для получения уникального дизайна лучше добавить новую картинку;
  • редактируем текстовое наполнение. Указываем, какая услуга предлагается, дополняем заголовок коротким оффером. Оффер раскрывает уникальное торговое предложение, должен быть емким и иметь продающий окрас. Может оттенять уникальные черты услуги, создавать ощущение искусственной выгоды или же акцентировать на полезности – здесь все зависит от направления деятельности и болей целевой аудитории.

Если возможности или желания самостоятельно писать тексты нет – прибегаем к инструменту «Перефразировать». Достаточно выделить необходимый текстовый фрагмент, а потом нажать на волшебную палочку, после чего AI изменить формулировку с сохранением максимальных логики и удобочитаемости.

Как перефразировать текст с помощью ИИ
Как перефразировать текст с помощью ИИ

Редактирование шапки сайта

Остается настроить шапку сайта – это фрагмент с разделами, выполняющий навигационную функцию. Действуем так:

  • выделяем, например, «Преимущества»;
  • в появившемся меню кликаем на пункт «Ссылка» → «Тип ссылки»;
  • можно указать внутренний, внешний и другие типы линков, мы выбираем якорный – при нажатии пользователь попадет в соответствующий блок;
  • указываем страницу, если на сайте их несколько, потом – нужный блок. При наведении курсора на название блока отображается миниатюра с его содержимым;
  • задаем цвет ссылки и толщину линий, сохраняем внесенные изменения. Так настраиваем линки для каждого пункта в шапке.
Настройка якорных ссылок для шапки сайта
Настройка якорных ссылок для шапки сайта

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

Изменение остальных блоков

Следующий блок – преимущества, здесь тоже изменяем текстовое наполнение и работаем с визуалом:

  • кликаем на «Фоновое изображение» (нижний левый угол блока), загружаем картинку и сохраняем. Если текст на фоне картинки теряется – лучше настроить заливку: «Фильтр» → «Градиентная заливка» (есть еще однотонная) и выбор цветовых сочетаний;
Настройка фона
Настройка фона
  • изменяем иконки в шаблоне: кликаем на мини-изображение, переходим в каталог и выбираем из предложенных вариантов. Для добавления достаточно кликнуть по картинке дважды или нажать на нее, а потом на кнопку «Вставить изображение».
Настройка иконок в блоке «Преимущества»
Настройка иконок в блоке «Преимущества»

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

Редактирование блока «Обо мне»
Редактирование блока «Обо мне»

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

Как удалить блок из шаблона
Как удалить блок из шаблона

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

  • выделяем текст, в появившемся всплывающем меню кликаем на «Ссылка»;
  • указываем тип ссылки – внешняя, добавляем URL (он обязательно должен начинаться с https://);
  • устанавливаем параметр Nofollow, чтобы линк не передавал вес странице, на которую ссылается;
  • указываем, выполнять ли открытие в новом окне (предпочтительно, чтобы пользователь не уходил с основного сайта и не утрачивал импульсивность);
  • редактируем цвет и толщину линий, сохраняем изменения.
Как настроить внешнюю ссылку
Как настроить внешнюю ссылку

Следующий блок – портфолио, сюда можно добавить фото, формируя галерею, видео или же картинки со ссылками на сторонние сайты. Желательно изменить фоновый цвет, базовый белый выглядит стандартно и не привлекает внимание (вновь применяем градиент).

Каким стал раздел с портфолио после редактирования
Каким стал раздел с портфолио после редактирования

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

При написании отзывов обязательно изменяем все наполнение блока, чтобы не было повторов с другими хореографами, которые будут использовать шаблон. Желательно добавление реальных имен и естественного текста, приоритетна привязка к региональности (указание города/области), что повысить правдоподобность.

Измененный блок с отзывами
Измененный блок с отзывами

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

  • максимально сокращаем количество полей в форме, иначе потенциальным клиентам будет лень ее заполнять. Оставляем поля для номера телефона и имени, а также тип постановки. Для удаления нажимаем крестик в поле рядом с лишним разделом, если нужно расширить форму – кликаем на «Добавить»;
Редактирование формы сбора контактных данных
Редактирование формы сбора контактных данных
  • работаем с текстовым наполнением для заголовка, оффера и кнопки;
  • настраиваем действия после заполнения формы, а также указываем, куда будут отправляться введенные данные (у нас в Telegram);
  • на финише изменяем дизайн, управляя цветом и шрифтами, проверяем внесенные изменения.

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

Настройка иконок социальных сетей и ссылок в подвале сайта
Настройка иконок социальных сетей и ссылок в подвале сайта

Как создать универсальный сайт на конструкторе Craftum с помощью нейросети

Генерация сайта нейросетью – относительно новый инструмент конструктора Craftum, который был запущен в 2023 году. Наделен следующими возможностями:

  • сборка сайта в режиме онлайн по краткому описанию и ключевым словам, выполняющаяся за 3 минуты;
  • подбор качественных и релевантных изображений с фотостока, что нивелирует риск споров об авторском праве;
  • формирование логической структуры, идеально подходящей для проекта;
  • написание цепляющих текстов – от заголовков и офферов до наполнения блоков, используется ChatGPT-4;
  • предоставление всей необходимой для проекта инфраструктуры – это доменное имя и хостинг, защита от атак, SSL-сертификат;
  • генерация сайта – бесплатная, дальнейшее обслуживание сайта осуществляется по стандартным тарифам конструктора Крафтум.

Этапы создания универсального сайта за 3 минуты с помощью нейросети

К этому моменту у нас уже есть личный кабинет, заходим в него и открываем «Сайты» → «Сгенерировать сайт». Выполнится перенаправление на страницу, где необходимо выбрать тип проекта, в нашем случае универсальный. Вводим краткую информацию о том, что нужно создать:

  • название сайта – указывайте емкие формулировки, наиболее близкие к тематике;
  • напишите, для кого сайт и какие товары/услуги с его помощью будут продвигаться.
Нужно заполнить форму, чтобы обеспечить максимально корректную генерацию
Нужно заполнить форму, чтобы обеспечить максимально корректную генерацию

Проверив правильность наполнения – нажимаем на «Сгенерировать сайт», после чего запустится процесс создания: за результатом можно наблюдать в режиме реального времени. Вот такой первый (главный) блок у нас получился, также есть разделы с преимуществами и видео, описанием услуг, формой для сбора контактных данных.

Пример оформления блока: тексты, изображения, форма подобраны нейросетью
Пример оформления блока: тексты, изображения, форма подобраны нейросетью

Все компоненты, присутствующие на сайте, можно изменять и редактировать, чтобы адаптировать их под потребности бизнеса. Например, мы хотим дополнить структуру таймером для создания ощущения дефицита – кликаем на «+», переходим в каталог блоков и загружаем необходимый. Проводим редактирование: оформляем фон градиентной заливкой, изменяем надпись, корректируем время (отсчет ведется автоматически).

Добавляем и настраиваем таймер
Добавляем и настраиваем таймер

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

  • прикрепление внешних, внутренних и других ссылок;
  • добавление контактных данных: номер телефона, электронный адрес, социальные сети;
  • подключение счетчиков статистики и аналитики;
  • настройка кнопок и форм, помимо изменения полей – указание действий после заполнения и способа отправки данных.

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

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

Теперь возвращаемся в блок, где размещена нужная форма, переходим в раздел настроек:

  • «Настроить» → «Форма» → «Действия после отправки» → «Что сделать»;
  • выбираем «Всплывающее окно» и задаем номер страницы;
  • указываем номер блока с формой, изменения сохраняются автоматически.
Привязываем всплывающее окно к форме
Привязываем всплывающее окно к форме

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

Обратите внимание на то, что после генерации первой страницы постоянно будет доступно предложение о создании новых – кликните на «Создать еще одну», чтобы запустить процесс.

Как провести повторную генерацию из редактора
Как провести повторную генерацию из редактора

Как создать лендинг на конструкторе Крафтум в дизайн-блоке

Мы рассмотрели, как работать с готовыми шаблоном и нейросетью, лендинг будем собирать в дизайн-блоке. Открываем его через кнопку «Создать сайт» в личном кабинете: нужно выбрать «Пустая страница», в каталоге блоков кликнуть на «Дизайн-блок». Произойдет перенаправление в редактор – доступен чистый лист для реализации любых идей в вопросах оформления.

Открываем дизайн-блок
Открываем дизайн-блок

Выделяем все элементы, нажимаем Delete для очистки.

Удаляем все лишнее
Удаляем все лишнее

Открываем меню (кнопка-стрелка в левом углу экрана) и создаем новый фон через раздел «Настроить».

Настройка фона в дизайн-блоке
Настройка фона в дизайн-блоке

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

Работа с фоном
Работа с фоном

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

Включаем сетку, этой же кнопкой выполняется выключение
Включаем сетку, этой же кнопкой выполняется выключение

Для начала напишем текст, нажимая «+» в верхнем левом углу экрана. Так можно добавить не только контент, но и формы, код, таймер, кнопки, слайдеры и другие элементы.

Добавление текста и объектов на страницу
Добавление текста и объектов на страницу

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

Как управлять оформлением текста и других элементов
Как управлять оформлением текста и других элементов

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

Настраиваем дизайн кнопок
Настраиваем дизайн кнопок

Дополнительно добавляем форму для записи на фотосессию:

  • корректируем количество полей;
  • указываем действия после отправки, у нас будет всплывающее окно;
  • выбираем, куда будут передаваться данные с форм (Телеграм, CRM и другие варианты);
  • настраиваем цвет полей, текста и кнопки.

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

Изменение высоты блока и настройка формы для записи
Изменение высоты блока и настройка формы для записи

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

Адаптация под разные версии
Адаптация под разные версии

Как выполнить настройку сайта на Крафтум

Подключаем сервисы статистики

Для подключения сервисов статистики и аналитики переходим в личный кабинет, выбираем сайт из списка и кликаем на него. Идем по пути «Настройки сайта» → «Аналитика».

Как настроить сайт
Как настроить сайт

В поля стоит добавить номера счетчиков Яндекс.Метрики и Google Analytics, если их еще нет – можно воспользоваться инструкцией по созданию (нажмите на знак вопроса, чтобы получить больше информации). Дополнительно проводится настройка сбора информации с помощью UTM-меток.

Как добавить счетчики Яндекс.Метрика и Google Analytics
Как добавить счетчики Яндекс.Метрика и Google Analytics

Проводим SEO-оптимизацию нового сайта

SEO-оптимизация может выполняться через «Настройки сайта» или «Настройки страницы» прямо в шаблоне. Открываем шаблон, кликаем на шестеренку (рядом с кнопкой «Опубликовать») и прописываем:

  • заголовок title и описание description, в которые нужно интегрировать запросы;
  • ключевые слова keywords, их вводим через запятую.

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

SEO-инструменты в конструкторе Крафтум
SEO-инструменты в конструкторе Крафтум

В шаблоне при наполнении выбираются теги заголовков для каждого блока, необходимые для SEO-продвижения. Открываем разделы «Контент» → SEO, устанавливаем тег Н1, Н2 или другой вариант.

Есть теги Н1-Н6, внесенные изменения сохраняются автоматически
Есть теги Н1-Н6, внесенные изменения сохраняются автоматически

Подключаем виджеты, интеграции

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

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

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

Как подключить виджеты и интеграции
Как подключить виджеты и интеграции

Добавляем онлайн-оплату

В блоке «Настройки сайта» есть раздел «Оплата на сайте», здесь доступны Робокасса и ЮKassa. Другие платежные методы можно подключить через раздел с интеграциями.

Как подключить онлайн-оплату
Как подключить онлайн-оплату

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

  • необходимо пройти регистрацию в сервисе Робокасса;
  • после завершения процедуры возвращаемся в Craftum. Подключение платежных инструментов возможно при настройке «Корзины» (прямо в шаблоне) или в разделе «Оплата на сайте» (личный кабинет);
  • нажимаем кнопку «Настроить» (мы заходим через личный кабинет), указываем название способа в списках, идентификатор магазина, пароль #1 и #2;
  • задаем параметры для формирования чека: предмет и способ расчета, ставка НДС, система налогообложения;
  • сохраняем изменения, проводим тестовый платеж для проверки корректности.

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

Настройка приема платежей на сайте
Настройка приема платежей на сайте

Выбираем и регистрируем доменное имя

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

Как перейти во вкладку с доменами
Как перейти во вкладку с доменами

Нажимаем «Купить домен» и начинаем вводить имя, можно использовать ключевые слова или максимально близкие к бизнесу/направлению деятельности. Через секунду появится список доступных имен, если ничего не нравится – нажмите на «Показать еще».

Выбор доменного имени
Выбор доменного имени

После выбора добавьте домен в корзину, а потом кликните на кнопку «Оплатить». В списке найдите подходящий метод и внесите оплату, следуя инструкциям сервиса. Средний срок от оплаты до регистрации составляет 24 часа, после чего можно провести привязку домена в одноименном разделе в личном кабинете.

Добавление доменного имени в корзину и оплата
Добавление доменного имени в корзину и оплата

Рекомендации по выбору доменного имени:

  • Длина. Длина домена оказывает прямое влияние на уровень восприятия и запоминаемости. Оно должно легко сохраняться в памяти пользователя, поэтому короткое имя – хорошее имя. Стоит помнить, что аббревиатуры на 3-4 буквы, не вызывающие ассоциации, сложные с точки зрения удобочитаемости. Оптимальный объем – 10-12 символов.
  • Сокращения. Если выбранный домен длиннее рекомендованного объема – стоит выполнить сокращение, но без утраты исходного смысла. Нужно придерживаться правил логичности, избегать непонятных и неудобочитаемых формулировок, которые негативно воспринимают и пользователи, и поисковые системы.
  • Цифры. В доменном имени можно использовать цифры, если они перекликаются с названием компании или ее преимуществами. Например, «24» может указывать на круглосуточную работу – этот прием применяется часто и успешно.
  • Дефисы. Дефисы тоже разрешены, поисковые роботы воспринимают их в качестве разделителя между двумя словами. Небуквенный знак позволяет сделать домен более читаемым, особенно при наличии нескольких слов. Однако если есть возможность зарегистрировать домен без дефисов (касается и цифр) – лучше обойтись без них: они хуже запоминаются и сложнее набираются на клавиатуре, поэтому при ручном вводе высок риск попасть не туда.
  • Ключевые слова. Наличие запроса в доменном имени – отличный сигнал для поисковых систем, дающий преимущество в ранжировании. Ключевое слово упрощает запоминаемость, что особо актуально в случае, если оно указывает на сферу деятельности и другие факторы, понятные постоянной аудитории.
  • Дополнительные слова. Такие слова помогут решить ситуацию, если понравившееся доменное имя уже занято. Например, вы выбрали домен «flowers», однако у него уже есть владелец, в этом случае можно дополнить его одной синонимичной или близкой по смыслу приставкой: «fresh», «online» или другой.
  • Уникальность. Не стоит копировать названия известных компаний или конкурентов, слегка видоизменяя их. Такой подход может привести на сайт нецелевую аудиторию, он будет негативно воспринят поисковыми системами и может повлечь судебное разбирательство из-за киберсквоттинга.
  • Смешивание языков. Для облегчения процесса выбора свободного имени и уникализации нередко используется смешение слов из разных языков. Однако такие сочетания очень плохо запоминаются.
  • Региональность. Интересна для компаний, оказывающих услуги в одном регионе. Например, если бизнес обслуживает клиентов на территории СПб – подойдет зона spb.ru, Москвы – msk.ru.

В заключение

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

22
11
1 комментарий

О, а я тоже сижу на Крафтум с Робокассой ) Связка вполне рабочая. Отдельно отмечу холдирование - в моем случае удобно для продажи хендмейда.