Лендинги на 1С-Битрикс и Tilda: новые возможности для бизнеса

Если клиенту нужен «нормальный сайт, причём как можно скорее», большинство разработчиков предложат решения на Tilda. Этот конструктор сайтов отлично справляется с задачей. Но иногда техническое задание включает сложные интеграции с сайтом клиента и другие специфичные требования, которых нет в его функционале. Решение есть: добавить к удобству конструктора функциональность популярной CMS 1C-Битрикс, используя специальные модули, или плагины. Расскажем про один из них и разберём примеры рекламных кампаний, где это будет полезно.

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

Лендинг решает эту проблему: это одностраничный сайт, созданный для конкретной цели — продажи продукта, сбора заявок, регистрации на мероприятие или продвижения спецпредложения. Он концентрирует внимание посетителя на одном действии и избавляет от лишней информации.

Лендинг — это гибкий инструмент, который можно использовать для:

•

быстрых запусков рекламных кампаний;

•

тестирования спроса на новый продукт;

•

продвижения акций и спецпредложений;

•

регистрации участников на мероприятие;

•

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

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

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

Tilda Publishing — это российский no-code конструктор сайтов, который позволяет собирать страницы как из блоков Lego — без навыков верстки и без лишних затрат времени. Создание лендингов (посадочных страниц) — одна из популярных областей применения конструктора, с помощью Tilda это можно делать быстро и качественно.

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

•

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

•

Лендинг под рекламу (PPC) — адаптирован под трафик из контекстной или таргетированной рекламы, заточен на конверсию.

•

Квиз-лендинг — с интерактивной формой (опросом) для предварительного отбора лидов.

•

Лендинг мероприятия — с программой, спикерами, регистрацией и таймером до начала.

•

Лендинг продукта, бренда или услуги — для вывода нового предложения на рынок.

•

Лендинг для линейки товаров, с каталогом — лёгкий вариант с карточками товаров или услуг без полноценной CMS.

•

Лендинг портфолио — для фрилансеров, дизайнеров, фотографов, разработчиков.

Страница создаётся из предустановленных блоков или в Zero Block — это визуальный редактор, где можно полностью контролировать структуру, позиционирование и поведение элементов. Tilda заботится об адаптивности, поэтому все сайты по умолчанию нормально отображаются на мобильных устройствах.

•

Формы и сбор заявок — формы интегрируются с email-рассылками, CRM, мессенджерами, Google Sheets и другими сервисами.

•

Интернет-магазин — корзина и каталог товаров, фильтры и разделы, приём платежей через различные сервисы.

•

Блог и статьи — удобный редактор, RSS, поиск, теги, обложки и SEO-настройки.

•

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

•

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

•

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

•

Экспорт кода — весь сайт можно выгрузить как архив. Вы получите статичный html плюс все необходимые файлы (картинки, CSS, JS) в формате упакованного архива.

Tilda дружит с десятками внешних сервисов:

•

CRM: amoCRM, Bitrix24, HubSpot, Pipedrive;

•

Платежи: ЮKassa, Сбербанк, Stripe, PayPal;

•

Рассылки: Mailchimp, UniSender, SendPulse;

•

Чаты: Telegram, WhatsApp, Viber;

•

Карты, календари, аналитика и пр.

Для нестандартных сценариев можно подключить вебхуки или отправлять данные через API сторонних сервисов.

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

Одним из популярных запросов от наших заказчиков была интеграция Tilda с 1С-Битрикс: соединить удобство и функциональность Битрикса с простотой и эстетичностью Tilda. Поэтому мы создали собственный модуль. С его помощью можно делать красивые страницы в Tilda Publishing для любого сайта на 1С. Публикуйте на своём сайте все, что сделано на Tilda, или быстро создавайте лендинги новых компаний и продуктов, связанные с основным сайтом.

В одной из статей мы подробно рассказывали про наш модуль (плагин) Tilda для 1С-Битрикс и его возможностях для создания сайтов — в том числе сложных порталов с большим количеством контента. В этой статье расскажем, как применить этот инструмент для быстрого создания лендингов и в каких проектах он может быть полезен.

1С-Битрикс: Управление сайтом (или просто «Битрикс») — это профессиональная система управления контентом (CMS) и фреймворк для разработки веб-проектов, разработанная российской компанией «1С-Битрикс». Она ориентирована на создание сложных, высоконагруженных сайтов, интернет-магазинов, корпоративных порталов и социальных сетей.

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

У многих компаний основной сайт — на 1С-Битрикс. Это удобно для корпоративного портала, интернет-магазина или каталога, но не всегда оптимально для быстрого запуска промостраниц.

Заказчик часто хочет получить на своём лендинге «конструктор» — собирать его как из кубиков Lego. Но 1С-Битрикс не даёт такую возможность. Там есть компоненты, но их функционал ограничен. А у Tilda он значительно шире. При этом запрос часто на сложные сайты, которые невозможно создать с помощью Tilda. Например, с интеграциями. Наш модуль позволяет легко управлять контентом на лендинге без знаний программирования, менять и добавлять блоки. Но при этом иметь в своём распоряжении сложную посадочную страницу со всеми нужными функциями.

Максим Глушков

старший бэкенд-разработчик

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

В таких случаях Tilda становится «ускорителем» маркетинга: лендинги можно выпускать за 1−3 дня и интегрировать с основной экосистемой при помощи модуля. Вот несколько сценариев, когда это действительно удобно.

1. Сезонные акции и распродажи. Допустим, у ритейлера распродажа к Чёрной пятнице. Основной сайт на Битриксе, но для акции нужен яркий, «легкий» лендинг с упором на эмоции и ограниченные предложения. Решение: создать лендинг на Tilda, куда с рекламы пойдёт трафик, а кнопки покупки или формы заявки интегрированы с корзиной и CRM на Битриксе.

2. Запуск нового продукта или услуги. Например, IT-компания выводит на рынок облачный сервис. Раздел о нём на основном сайте будет готов только через месяц, но рекламную кампанию нужно запустить уже сейчас. Решение: создать лендинг на Tilda с описанием продукта, формой заявки, подключённой к CRM на Битриксе, и возможностью быстро менять контент по мере тестирования гипотез.

3. Рекламные кампании под разные сегменты. Образовательная компания запускает курсы для студентов, специалистов и корпоративных клиентов. Для каждого сегмента нужны разные офферы, визуал и примеры. Решение: создать три лендинга на Tilda с уникальными предложениями и целевыми сценариями, при этом все заявки будут поступать в единую CRM на Битриксе.

4. Продвижение офлайн-мероприятий. Ситуация: компания-дистрибьютор организует серию региональных презентаций. Решение: под каждое событие сделать отдельный лендинг на Tilda с формой регистрации, программой, картой и таймером обратного отсчёта, при этом данные участников автоматически передаются в Битрикс24.

5. Лидогенерация в нишевых кампаниях. Производитель оборудования проводит рекламу в LinkedIn и таргетированную кампанию в Facebook на зарубежную аудиторию. Решение: создать англоязычный лендинг на Tilda с формой обратной связи, которая напрямую интегрирована с CRM и каталогом на Битриксе.

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

1. Мы поменяли какую-то ссылку в одной части сайта. С Tilda мы должны в остальных блоках, где она встречается, заменять её вручную. В CMS Битрикс есть инструменты, чтобы делать это автоматически.

2. Мы хотим комбинировать на лендинге разный функционал: не только информационные блоки, но и блок с закупками на специализированных площадках. Tilda не позволяет сделать интеграцию с ними, а в 1С-Битрикс это возможно.

Наш модуль позволяет совмещать удобство и скорость создания сайтов на Tilda и широту возможностей CMS Битрикс.

Максим Глушков

старший бэкенд-разработчик

1. На стороне Битрикса создается новая страница или компонент, который будет «оболочкой» для Tilda-контента.

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

3. С помощью плагина на страницу или шаблон компонента вставляется экспортированное содержимое страницы из Тильды.

4. Битрикс-шаблон (который определяет общий вид сайта) может автоматически подтягивать шапку (header) и подвал (footer).

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

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

После установки в визуальном редакторе 1С-Битрикс появляется отдельная кнопка. С её помощью в админке 1С-Битрикс или в визуальном редакторе «Эрмитаж» в тех местах, где доступна вставка текста, можно выбрать нужный сайт на Tilda и встроить его содержимое напрямую. Это упрощает работу с лендингами и позволяет без лишних интеграций связывать лендинги, созданные в Tilda, с сайтами и порталами на Битриксе.

Есть разные сценарии отображения контента на лендинге:

•

отображать из Tilda только содержимое основной части, а хедер и футер (верхнюю и нижнюю часть страницы) — из 1С-Битрикс;

•

полностью отображать на странице то, что создано в Tilda.

Модуль Tilda для 1С-Битрикс, созданый разработчиками Uplab, имеет несколько важных преимуществ, влияющих на работу готового лендинга.

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

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

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

Используя модуль Tilda для 1С-Битрикс, мы фактически мы соединяем две страницы, страницу сайта на 1С-Битрикс и страницу из Tilda. Это в некоторых случаях может создать проблемы: странное или неправильное отображение содержимого. Чтобы понять, почему это происходит, вспомним, из чего состоит страница сайта. Что на ней есть?

•

HTML (HyperText Markup Language) отвечает за структуру и содержание веб-страницы (текст, изображения, ссылки).

•

CSS (Cascading Style Sheets) отвечает за визуальное оформление (цвета, шрифты, расположение элементов).

•

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

HTML — это «скелет» страницы, CSS — «одежда», а JavaScript — «мышцы» и «мозг», которые позволяют ей двигаться и взаимодействовать.

Бывает ситуация, когда стили и скрипты сайта «не дружат» со стилями и скриптами Tilda. Например, между стилями и скриптами бывают конфликты из-за того, что не совпадают названия переменных. Ещё пример: для CSS очень важно, в каком порядке описаны правила, потому что это влияет на порядок подключения CSS-файлов. При использовании модуля из-за этого бывают ситуации, когда один блок накладывается на другой, и готовый лендинг выглядит не совсем так, как ожидается. Это бывает не очень часто, но это надо иметь в виду. Эти конфликты можно решить только в ручном режиме. Но в настройках модуля можно выбрать способы, которыми подключаются стили и скрипты (в описании модуля на маркетплейсе об этом написано), и варьируя настройки, можно попытаться исключить проблемы.

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

02

Tilda позволяет быстро создавать лендинги. Это no-code платформа удобна для создания адаптивных лендингов разных типов (продающих, рекламных, мероприятий, квизов, продуктовых), с интеграциями, SEO-настройками, анимациями и мультиязычностью.

03

Если важно объединить скорость создания страниц в Tilda с функциональностью 1С-Битрикс, пригодится специальный модуль, разработанный Uplab.

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

01

Такие лендинги на 1С-Битрикс с контентом, созданным в Tilda, актуальны для сезонных акций, запуска новых продуктов, сегментированных рекламных кампаний, мероприятий и лидогенерации в нишевых аудиториях.

04

05

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

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

06

Ограничения модуля: возможны конфликты CSS и JavaScript, которые решаются ручной настройкой.

07