1. Как лучше добавлять JS в Тильда

Благодаря веку информационных технологий, мы можем делать все что угодно и как угодно, поэтому любые ваши действия будут правильными, просто не всегда логичными:-) Поэтому в Тильда можно подключить JS к сайту разными способами

1 Способ: Через настройки сайта \ проекта

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

Я говорю про добавление JS кода прямо в настройки проекта

Между тегами <script> </script> вставляйте ваш код

Однако, вы должны понимать, что просто несжатый код, да и еще с комментариями вставлять нельзя. Сервис, где я например жму код https://minify-js.com

Но сначала я его готовлю к сжатию, удаляю ненужные фрагменты оставшиеся от разработки, комментарии, всякие логи и проставляю точки с запятой там где они например были пропущены. Для чего? Для того чтобы при сжатии ничего не заглючило, когда весь код будет в одну строку. Пример после сжатия

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

2 Способ: Сразу на странице Тильды

Принцип тот же, между тегами <script> </script> размещаете сжатый код. Но, для этого в Тильде есть специальные блоки. T123 — блок HTML

Или можно использовать зероблок, а внутри него разместить html элемент

Когда я размещаю такие блоки, сверху я размещаю еще один стандартный блок «Системный комментарий» — T218

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

Основным минусом такого способа является наличие данных блоков в html верстке

Так что имейте это ввиду/

Еще большим минусом размещения кода в стандартном блоке, это количество символов. Например при написании решения по получению постов, и формировании из их контента саму страницу Инструкция по работе с кастомным сайтом на Тильде проект Шлокамрита мне не хватило лимита. И в итоге мой JS не сохранялся в стандартном блоке. Мне пришлось весь код переносить в сам HEAD через настройки проекта.

3 Способ: Внешнее подключение

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

Или тот же скрипт прямо на странице

Такое подключение через внешний файл часто может быть максимально выгодным, например, в своих проектах, где я делал систему пожертвований с админкой + индикаторами Система пожертвований для сайта на Тильде. Мне было бы не удобно заниматься постоянным пере размещением кода после каждого его обновления, а тем более что сайт админить я не могу, так как там есть свой администратор, с мены было только само решение. Поэтому я разместил коды на внешнем хостинге и подключил в head проекта. И у себя на хостинге я просто вношу правки в код, а все обновления автоматом подтягиваются в Тильду без повторного размещения. Удобно. Но это актуально только ну прям для сложных сайтов.

Итог

Всегда старайтесь подключать JS в HEAD сайта, минифицируйте его обязательно. Если код внешний то подключаем в так же в HEAD

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

Как со мной связаться

Если вы не нашли для себя ответ в моих статьях или у вас есть задача, присылайте ваше ТЗ задание под ваш проект.
Пишите https://t.me/vbalakin буду рад помочь с доработкой.

Еще материалы

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Для корректного функционирования, сайт использует cookie, поэтому если вы согласны с политикой конфиденциальности нажмите "Принять"