#Tilda #тильда #collabza #коллабза #nocode #ноукод #AirTable
В этой статье я расскажу вам, что такое collabza, как персонализировать личный кабинет (ЛК), как сделать обращение по имени.
Я намеренно не включал Collabza в «ТОП сайтов со скриптами и модификациями для Тильды», потому что Collabza – это нечто большее, чем модификация. Это самостоятельный nocode-сервис. С его помощью вы можете делать на Тильде то, о чём раньше и мечтать не могли.
Настроить автоматический доступ к контенту, а также автоматическое закрытые доступа при неуплате подписки или наступлении определённой даты (например, вы выдаёте доступ на 1 месяц)? Легко! И это реально одно из самых простых действий. С помощью коллабзы можно создавать целые порталы. Свои Инстаграм, Авито, Яндекс.Мартк или AirBnb.
Но сегодня поговорим об азах, чтобы вы поняли, как работает этот сервис.
Сайт Collabza.ru
Telegram-чат с поддержкой
Чем плох личный кабинет Тильды?
Когда Тильда представила общественности личные кабинеты, моему восторгу не было предела: «Наконец-то, мы дождались! Теперь можно будет делать закрытые материалы на сайте!» – так думал я и многие другие веб-дизайнеры. Но спустя год восторг сменился негодованием, т.к. личные кабинеты, не смотря на заявления, никак не развивался. Да, официальных заявлений Тильда особо не даёт, но исходя из рассказов приближённых (например, Макса Ширко), в планах у Тильды было развитие ЛК. Однако по сей день им не дано было сбыться.
Никакой базы
На данный момент Тильда разработала просто систему входа по паролю в закрытую часть сайта. Страницы входа, выбора группы, смены пароля и базовой регистрации никак по-человечески не кастомизируются. Благодаря Станиславу Быстрицкому, мы с горем пополам можем кастомизировать страницу выбора групп и более-менее сносно клепаем кастомные страницы авторизации. Но это костыли.
Чего уж говорить о функциях ЛК?
Если смотреть глубже, то пофигу на эти страницы, ведь вся работа с пользователями происходит в ручном режиме. Да, мы можем автоматизировать добавление пользователя в группу личного кабинета, но как сделать так, чтобы через месяц юзер вылетал из этой группы, не совсем понятно. А если быть точнее, такой функции не предусмотрено.
А если у меня на сайте подписка? Как быть с теми, кто её отменил или не продлил вовремя? Получается, я должен вручную отслеживать таких пользователей и удалять их из группы. И ладно, когда у вас 30 пользователей и 5 групп – можно помучиться, но если у вас масштабный проект, это не представляется возможным.
Никакой персонализации
Вы наверняка привыкли к тому, что заходя в личный кабинет на сайте или в приложении, вас радостно приветствую с хлебом и солью по имени, знают, когда у вас кончается подписка, показывают только доступные вам страницы, подсовывают различные персональные предложения и пр.
Так вот, на Тильде ничего такого нет. Каждый пользователь в личном кабинете Тильды видит одно и то же. За небольшим исключением – в углу есть кружочек с человечком, где написаны его имя, email и доступные группы. На этом всё!
Короче, говоря
Я надеюсь, что в будущем Тильда нас порадует доработками в этой области, т.к. сейчас (именно сейчас) это самый необходимый функционал. Уже через несколько лет либо всем станет всё-равно на Тильду, либо попросту ажиотаж вокруг инфо-бизнеса (и я сейчас не только про всеобщее любимое слово "инфоцыгане") спадёт, и надобность в подобном станет минимальна.
А что делать-то?
Ввода часть закончена, поэтому перейдём к главному. Вы спросите меня: «Всё очень плохо, мы поняли, а делать-то что?» – и я вам скажу – «выход есть». Он нашелся 1,5 года назад, когда случайно встретились два энтузиаста: один любил кодить, второй ноукодить 😅. Так появился сервис Collabza.
Я не знаю, как так случилось, но именно в этот Момен ко мне пришёл клиент с запросом: «Нужен сайт, желательно на Тильде, чтобы на каждый урок мы могли выдавать временный доступ. Желательно, чтобы ручками не мониторить, когда у них закончится доступ.» – так я вышел на Коллабзу.
Что такое AirTable
«Так, стой! Мы только что говорили про Collabza, какой ещё нафиг AirTable?»
Collabza – это сервис, который позволяет соединить ваш сайт на Тильде с внешней базой данных AirTable. Поэтому сначала нужно сказать пару слов об этом сервисе. Что такое AirTable мы подробно поговорим в другой статье, просто знайте, что это внешняя база данных (БД).
База данных – такая штука, которой нет в Тильде 😆. БД – это невидимая пользователю часть вашего сайта, к которой сайт обращается за получением информации.
Процессы, отвечающие за обращение к БД и сама БД – это бэкэнд, а то, что видит пользователь это фронтэнд.
Таким образом, вы имеете все данные в БД:
- Информация о пользователе:
• email;
• имя;
• фамилия;
• телефон;
• дата старта подписки;
• дата окончания подписки;
• размер платежа;
• многое другое; - Информация о покупках:
• что купили;
• когда купили;
• кто купил;
• в каком количестве;
• сколько потратил;
• какой промокод применил;
• что-то ещё; - Уроки в онлайн-школе (если ваш проект – это e-learning, например):
• название урока;
• контент урока (тексты, видео, ссылки и пр.);
• стоимость урока;
• другие параметры; - И многое-многое другое.
Подобная структура позволяет связывать между собой различные таблицы. Вы не прописываете заново в покупках все данные о пользователе и уроке, который он купил, а просто пишете дату, в которую была совершена покупка, привязываете конкретный урок (или товар) из базы «Уроки», и все данные об этом уроке автоматически подтягиваются в покупку, а также привязываете пользователя к этой продаже, и его данные также автоматически подтягиваются.
По этому принципу построены и CRM, однако они сделаны с упором на другие удобства, но по факту, свою CRM, настроенную так, как вам это нужно, вы можете сделать даже в AirTable.
А при чём тут Collabza и Tilda?
Как уже говорилось выше, Collabza позволяет соединить Тильду и AirTable. Что вы получаете? Например, в личном кабинете можно будет сделать любую персонализацию. Хотите показать на главной странице ЛК персональную информацию? Легко:
Представьте, что бы вам пришлось делать на Тильде без коллабзы, чтобы сотворить такое для каждого пользователя. А теперь представьте, что у вас 100 пользователей. Стало дурно?
Так вот с коллабзой вам нужно сделать всего лишь одну страницу, разместить 1 блок (ST200 или AB605) и настроить интеграцию на сайте коллабзы. Всё это займет от силы 5 минут времени.
Инструкции есть на сайте collabza.ru, а помочь и ответы на вопросы можно получить в Telegram-чате. Да, Collabza – это платный сервис. Но, во-первых, при регистрации вам даётся 14 дней триала, чтобы опробовать все функции. У вас будет всего 5 интеграций, но, чтобы обучиться, этого хватит. К тому же их можно удалять. А во-вторых, это единственное nocode-решение, позволяющее сделать подобное на Тильде.
«Обращение по имени» или как пользоваться коллабзой
Конечно, у меня есть отдельная инструкция для обращения к пользователю по имени на сайте necodim.ru, но nocode на то и НОУкод, чтобы не использовать скрипты. Если вы настроили что-то на подобие предыдущего примера, вы уже понимаете, как обращаться по имени, но давайте пройдём этот путь от и до. Представим, что вы уже зарегистрировались на сайте коллабзы, завели AirTable (но ещё не настроили его) и у вас, естественно, есть сайт на Тильде.
Шаг 1
Давайте создадим новую пустую страницу на Тильде и добавим туда обычный текстовый блок TX01. Вы можете оставить текст, который предлагает Тильда или написать что-то своё, например, что должно отображаться в этом блоке, чтобы в будущем не забыть, зачем он вам вообще был нужен.
Не нужно переживать за текст, который вы написали, пользователь его не увидит. Этот текст заменится тем, который вы укажите в AirTable.
Быстро бежим в настройки сайта > Личный кабинет, добавляем только что созданную страницу в ЛК. Если у вас ещё нет личного кабинета, создайте его, создайте себе тестового пользователя, включите его в данную группу ЛК, запомните Email.
Шаг 2
Теперь переходим в AirTable, создаем новый Workspace (если у вас его ещё нет), а затем новую базу данных. Вы можете назвать её как угодно, выбрать иконку и основной цвет. Получится что-то типа такого (в галерее 2 фотографии):
Вам необходимо изменить столбцы «Name», «Notes» и «Attachments», столбец «Status» можете пока удалить. Нажмите правой кнопкой мыши на названии столбца «Name», переименуйте его в «Email» и выберите тип «Email». Далее измените столбец «Notes» – назовите его «Name» и выберите тип «Single line text». Столбец «Attachments» переименуйте в «Text» и измените тип на «Formula». В поле формулы впишите (с двойными или одинарными кавычками): "Здравствуйте, " & Name & "! Добро пожаловать в личный кабинет". Видео-инструкция:
Если хотите выделить имя жирным, то используйте Markdown- или HTML-разметку в формуле. То есть либо "Здравствуйте, **" & Name & "**! Добро пожаловать в личный кабинет", либо "Здравствуйте, <b>" & Name & "</b>! Добро пожаловать в личный кабинет".
Для теста добавьте новую строку, напишите Email пользователя, которого создавали на предыдущем шаге, впишите имя. О-па! Теперь в столбце «Text» появилось персональное обращение по имени. Но это ещё не всё, едем дальше.
Шаг 3.1
Как же теперь нам отобразить эту фразу на Тильде? Дело за малым. Переходим в Collabza, нажимаем «Создать новую интеграцию» и видим непонятную форму. Поверьте, она только на первый взгляд кажется сложной и непонятной. Для всех полей есть подпись с пояснением ниже.
Где взять AirTable API key?
Перейдите по указанной под полем для ввода ссылке и нажмите в указанную область, появится API ключ. Если ключа нет (а в первый раз его и не должно быть), сгенерируйте новый. Ключ копируем и вставляем в первое поле формы в коллабзе. Пример:
Где взять AirTable base ID?
Перейдите по указанной под полем для ввода ссылке и выберите вашу базу данных. На следующей страничке ключ будет выделен зелёным цветом – именно его копируем и вставляем в соответствующее поле в коллабзе. В галерее 2 скриншота, где показано, куда нажимать:
Откуда брать название таблицы (листа)?
Если вы не переименовывали таблицу, то просто впишите Table 1 (это стандартное название для первой таблицы БД), если переименовали – то без ошибок введите своё название (рекомендую копировать его из AirTable, т.к. из-за малейшей ошибки интеграция может попросту не сработать).
Что за вид таблицы?
Далее вам нужно вписать название вида таблицы в AirTable. Вид таблицы – это то, что указано слева (изначально все виды в новых таблицах называются Grid view). На данном этапе можете вообще ничего не вписывать, т.к. это для нас неважно. В будущем это поле поможет вам создавать интеграции с более тонкими настройками.
Как понять, кому доступны данные?
Да, это поле всегда вызывает вопросы. Сейчас мы не будем рассматривать подробнее каждое значение, просто знайте, что в данном поле выбирается то, кому будут доступны данные: всем пользователям или только авторизованным (или по условию авторизован / не авторизован). Т.к. сейчас мы делаем страницу в личном кабинете, выберите "Только авторизованным, которые есть в списке".
Так. Что-то ещё появилось. Эт чё?
Здесь вы показываете коллабзе, для какого пользователя будет отображаться то, что мы выберем дальше. Помните, мы на втором шаге создавали поле «Email»? Так вот для конкретного Email будет показана конкретная фраза из столбца Text. Короче, вписываем сюда название столбца, в котором содержатся почты наших пользователей, т.е. пишите «Email». Иначе, если бы вы выбрали в предыдущем пункте просто «Только авторизованным», пользователь на страничке в личном кабинете увидел все тексты для всех пользователей, а нам такое не нужно. Грубо говоря, коллабза будет просматривать столбец с имейлами и искать там имейл пользователя в ЛК на Тильде. Если найдёт, то отобразит текст.
Фух! С самым сложным разобрались. На первом этапе у вас форма должна выглядеть так:
Шаг 3.2
Дальше всё просто. Выберите название для вашей интеграции. Это системное название, по которому вы будете определят, что это за интеграция. Так что можете написать что угодно, но опять же, рекомендую описать подробнее, например: «Текст, который выводится пользователю на главной странице ЛК».
ID блока, надеюсь, вы знаете как копировать. Но, раз инструкция такая подробная, расскажу. Переходите в настройки блока, проматываете их вниз и копируете ID.
Затем выбираете тип блока, в который будем внедрять наш текст. В данном случае это TX01.
В появившемся поле вписываем название столбца из AirTable, в котором содержится текст, который мы будем показывать пользователю.
У вас должно получится вот так (только ID блока свой, естественно):
Нажимаем создать, ждём несколько секунд и получаем скрипт. Копируем его и переходим снова на Тильду.
Шаг 4
Добавьте под текстовым блоком ещё один блок из раздела «Другое» под названием «T123 – HTML-код». Нажмите «Контент» и вставьте скрипт, сгенерированный коллабзой, который только что скопировали. Сохраните изменения и опубликуйте страницу. Должно получиться следующее:
Теперь давайте тестировать! Входим в личный кабинет, переходим на созданную страницу и видим заветное обращение по имени:
Подытожим
«Пипец! И эта мутотень, хочешь сказать, гораздо проще?» – спросит человек, впервые столкнувшийся со всем этим. И я отвечу: «Да!» – потому что эту «мутотень» делать меньше 5 минут. На самом деле я на написание статьи потратил в 100 раз больше времени, чем делал саму интеграцию. Пару раз сделав интеграцию вы разберётесь в азах, поймёте принцип и сможете творить вещи гораздо сложнее.
На данный момент Collabza позволяет интегрировать данные не с каждым блоком в Тильде, но это и не нужно. На выбор у вас есть 16 блоков:
Этого вполне достаточно для того, чтобы воплотить самые смелые фантазии. Но о таких «смелостях» поговорим в будущем 😉.
Эта подробнейшая (я не знаю, куда уж подробнее) инструкция нужна для новичков, которые впервые столкнулись с коллабзой, не знают, что такое база данных, впервые слышат о ноукоде. Я преднамеренно не включал в этот разбор информацию о том, как автоматизировать попадание данных о пользователе в AirTable (для этого нужно воспользоваться ещё одним сервисом), потому что тогда бы статья стала огромной и нечитабельной.
В будущем я постараюсь сокращать количество текста, записывать больше видео и раскрывать более интересные темы. Напишите в комментариях, что вам понравилось, что стоит изменить и вообще, что бы вы хотели видеть в этом блоге.
