Как сделать Instagram истории в Tilda. Instagram stories в Тильде

Пример модификации

Введение

Instagram истории стали незаменимой частью маркетинговой стратегии в социальных медиа. Однако, чтобы привлекать внимание аудитории и добиваться максимального вовлечения, важно создавать качественные и привлекательные истории не только в социальных сетях, но и на своих сайтах. И здесь на помощь приходит Tilda в связке с нашим кодом. В этой статье мы подробно рассмотрим, как сделать Instagram истории в Tilda, используя zero block, галерею GL27 и нашу тильда модификацию.

Как создать Instagram истории в Tilda

Чтобы начать создавать свои Instagram истории в Tilda, следуйте инструкции:

1. Перейдите в Настройки сайта – Еще и активируйте пункт Подлкючить jQuery на страницах сайта. После этого опубликуйте все страницы вашего сайта
2. Создайте zero block
3. Очистите содержимое блока и уменьшите его высоту
4. Нажмите на кнопку +»и выберите Add Shape
5. В настройках shape в пункте SHAPE выберите Circle из выпадающего списка
6. Удалите фоновую заливку shape
7. Нажмите правой кнопкой мыши на shape и выберите Add CSS Class Name
8. В появившемся поле пропишите класс stories1
9. Нажмите на кнопку Upload file и загрузите иконку для ваших историй
10. Если нужен второй такой элемент, создайте его, как и первый, и присвойте класс stories2 (третьему элементу stories3 и так далее)
11. Сохраните изменения и закройте zero block

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

1. Добавьте блок GL27 из категории Галерея
2. Добавляйте и изменяйте истории в этом блоке по своему усмотрению
3. В настройках блока присвойте ему класс uc-st-slide1 (для второго блока uc-st-slide2, для третьего uc-st-slide3 и так далее)
4. После всех блоков на странице добавьте HTML блок Т123
5. Нажмите на кнопку Контент, скопируйте в него код модификации и опубликуйте страницу

Модификация для создания instagram историй в Тильде

При нажатии на stories1 будет показываться блок uc-st-slide1, при нажатии на stories2 откроется блок с классом uc-st-slide2 и т.д.Истории корректно отображаются как на десктопе, так и на мобильных.

Истории в Tilda как в Instagram: создание интерактивных контента

Чтобы сделать ваши истории в Tilda еще более привлекательными, вы можете использовать различные элементы интерактивности. Например, вы можете добавить вопросы или кнопки “Подписаться” прямо в свои истории. Это позволит вам взаимодействовать с вашей аудиторией и собирать полезную обратную связь.

Заключение

Создание Instagram историй в Tilda с использованием zero block предоставляет вам уникальную возможность привлекать аудиторию на свой веб-сайт и продвигать ваш бренд. Следуя рекомендациям по SEO оптимизации и создавая интерактивный контент, вы сможете добиться максимальной эффективности от ваших историй в Tilda, подобно тому, как это делается в Instagram.

Смотрите обучающие видео уроки по Тильде тут

Читайте также: Автоматический скролл слайдер