Доработка функционала сайта на Тильде

Автор: Роман Чернышов    Опубликовано: 3 декабря 2022

Доброго времени друзья! Ко мне часто обращаются владельцы сайтов созданных на конструкторе Тильда, интернет-магазинов, сайтов ресторанов и кафе, агентств недвижимости и прочих, с вопросом — можно ли доработать функционал сайта? Ведь известно, что сайт созданный на конструкторе, практически всегда не предоставляет доступ к своему коду, а все его изменения и доработки, возможны лишь за счет изменения предусмотренных настроек. Что ограничивает свободу владельца сайта, по части функциональных изменений. Но, к счастью осуществить доработку функционала сайта на Тильде, все таки — можно! О том, как это делать я расскажу далее.

Доработка путем размещения JavaScript кода

О данном способе доработки(изменения, добавления) функционала много где написано, в том числе в документации самой Тильды. Суть заключается в том, чтобы разместить на сайте с Тильда(Настройки сайта -> Ещё -> HTML-код для вставки внутрь Head), который будет работать со структурой DOM дерева страницы сайта. Это позволяет добавить, изменить или удалить любые элементы на странице сайта, манипулировать ими и т.д. Можно также разместить любой готовый виджет, от мессенджера(форма связи с владельцем), до различных сортировщиков товаров, фильтров поиска и т.д. Тильда включает во все свои страницы библиотеку jQuery, что тоже несомненно упрощает работу с сайтом, из кода.

Недостаток данного метода заключается в том, что он не позволяет сайту работать с более сложными технологиями, например взаимодействие сайта по REST/JSON API с банковским интернет-эквайрингом, который требует передачу в запросах между сайтом и банком, секретных ключей доступа(токена) и т.д. Но, для решения этой проблемы, есть другой способ доработки сайта на Тильде, о чем далее.

Доработка путем интеграции с PHP скриптом на внешнем хостинге

Как известно на самом сайте сделанном на Тильде, нельзя размещать скрипты написанные на PHP или Python, но это ограничение можно обойти, разместив такой скрипт на внешнем хостинге, с поддержкой соответственных интерпретаторов языка программирования. При этом, связь с таким внешне-размещенным скриптом будет обеспечиваться за счет JvasScript кода, который уже в свою очередь будет размещен на вашем сайте(на Тильде). Иногда(например в случае с интеграцией с тем же банковским интернет эквайрингом), размещение PHP скриптов которые будут взаимодействовать с API банка, запрещено на доменах не относящихся к основному домену вашего сайта(на сторонних доменах). Это может создать определенную проблему, но для этого также есть решение.

Если вы подключили к Тильде свой домен второго уровня(прописав в его настройках NS, адреса Тильды), то вы можете попросить поддержку Тильды(отправив им соответствующее обращение) о том, чтобы они создали поддомен третьего уровня, и прописали в настройках DNS запись типа A, с указанием IP адреса, вашего внешнего хостинга с поддержкой PHP.  Таким образом имея домен второго уровня, например myshop.ru, вы с легкостью получите домен третьего уровня, например engine.myshop.ru на котором сможете разместить любые серверные скрипты. И при этом, это не будет нарушать правил, установленных внешними сервисами(как пример выше, банковский эквайринг), с которыми вы планируете взаимодействовать.

Пример кода:

jQuery(document).ready(function($) {
 
    // Добавление в корзину, под полем Итог, информационное сообщение о скидке
    $('.t706__cartwin-prodamount').after(`<span class="">Скидка 100 руб.</span>`);
});

Доработка путем манипуляции объектами JS

Еще один способ функциональных доработок сайта на Тильде, это манипуляция JavaScript объектами на странице сайта, которые объявлены в глобальном пространстве имен, и доступны через глобальные объекты window и document. Например, на страницах сайта интернет-магазина Тильды, есть глобальный объект tcart, доступ к которому можно получить, соответственно winodw.tcart, с целью дальнейшего изменения данных в этом объекте. Например так можно реализовать, изменение цен в корзине интернет-магазина, в зависимости от количества заказанного товара и т.д. Но, справедливости ради стоит отметить, что в некоторых случаях, все же без хитростей не обойтись, например если вы хотите изменить стоимость товара, путем манипуляции JS объектом, его новая цена все-же должна быть предусмотрена в системе товара-учета Тильды(вашего сайта). Иначе, разумеется Тильда обнаружит несостыковку данных(в момент перехода на оплату), и выдаст ошибку, сославшись на попытку взлома сайта(реально на практике встречалось такое).

Пример кода:

jQuery(document).ready(function($) {
 
    // Отправка запроса на ваш поддомен третьего уровня, который делегирован на хостинг с поддержкой PHP
    $.ajax({
 
            url: 'https://engine.myshop.ru/index.php',
            data: "param1=test&param2=foo",
            dataType: 'json',
            type: 'POST',
            success: function(obj) {
                // Получение ответа и выполнение действий на странице сайта на Тильде
            },
            complete: function(obj) {},
            error: function(jxhr, msg, err) {},
    });
});

Что можно реализовать?

Что вообще можно реализовать выше описанными способами? К счастью большую часть задумок как правило, реализовать можно. Добавить на страницу новые элементы, настроить взаимодействие с пользователем с дальнейшим динамическим изменением контента на странице, изменение параметров заказа и прочее. Интеграция с большинством API различных сервисов. И даже реализация личного кабинета(как пример) пользователя на сайте Тильды с уникальным функционалом, разумеется бэкенд которого будет хранится на внешнем хостинге с поддержкой PHP.

jQuery(document).ready(function($) {
 
  var timer = setInterval(function() {
 
  if(typeof window.tcart == 'object' || countLoading >= 30) {
 
    // Дождались загрузки объекта корзины Тильда tcart
 
    // Работаем с объектом
    console.log(rcart);
 
    clearInterval(timer);
 
  } else {
 
    countLoading++;
    console.log('Загрузка...');
    return;
 
  }
});

Заключение

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

Друзья, если вам нужна помощь с реализацией ваших идей на сайте Тильда, пожалуйста обращаетесь буду рад помочь!

CMS, HTML, JavaScript / jQuery, jQuery, Система     доработка сайта, Тильда