Top.Mail.Ru
Установка

MODX

Подробная инструкция по установке виджета Touch_me на сайт на MODX. Разбираем три способа подключения кода: через основной шаблон, чанк и файл шаблона на сервере.

6 мин. на чтение

Содержание инструкции

    Способ 1. Через основной шаблон сайта — рекомендуемый

    Это рекомендуемый способ, если у вас есть доступ к административной панели MODX.

    1. Войдите в административную панель MODX

    Откройте панель управления сайтом и авторизуйтесь под учетной записью, у которой есть права на редактирование элементов сайта.

    2. Перейдите в раздел «Элементы» → «Шаблоны»

    В левом меню административной панели откройте раздел «Элементы», затем выберите «Шаблоны». Здесь находятся шаблоны, определяющие структуру и отображение страниц сайта.

    3. Откройте основной шаблон сайта

    Найдите шаблон, который используется для нужных страниц сайта. Обычно он может называться BaseTemplate, Main, «Основной шаблон», «Главная» или иметь другое название. Если на сайте используется несколько шаблонов, убедитесь, что выбираете тот, который применяется к нужным страницам.

    4. Найдите закрывающий тег </head>

    В открывшемся шаблоне найдите секцию <head> и закрывающий тег </head>. Для быстрого поиска можно воспользоваться сочетанием клавиш Ctrl + F (Windows) или Cmd + F (macOS).

    5. Вставьте код виджета Touch_me перед </head>

    Скопируйте код виджета Touch_me и вставьте его непосредственно перед закрывающим тегом </head>.

    Пример вставки:

    <head>
     ...
     <script async src="https://api.touch-me.pro/widget/bundle.js?site=ВАШ_ID" data-touch-me-widget-siteid="ВАШ_ID" data-touch-me-api="https://api.touch-me.pro"></script>
    </head>

    6. Сохраните изменения

    Нажмите «Сохранить», чтобы применить изменения. После сохранения код Touch_me будет добавляться в <head>.  всех страниц, которые используют этот шаблон.

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

    Способ 2. Через чанк, если head вынесен отдельно

    Этот способ подходит для проектов на MODX, где секция <head> не прописана непосредственно в шаблоне, а вынесена в отдельный чанк. Такой подход часто используется для удобного управления общими элементами сайта в одном месте.

    1. Перейдите в раздел «Элементы» → «Чанки»

      В административной панели MODX откройте раздел «Элементы», затем выберите «Чанки». Здесь находятся переиспользуемые фрагменты кода, которые подключаются к шаблонам сайта.

    2. Найдите чанк, отвечающий за блок <head>

      Найдите чанк, в котором содержится код секции <head>. В зависимости от структуры проекта он может называться Head, head, tpl.Head, BaseHead или иметь другое название. Если вы не уверены, какой чанк используется, проверьте шаблон страницы и найдите в нем вызов соответствующего чанка.

    3. Откройте чанк и найдите тег </head>

      Откройте найденный чанк для редактирования и найдите закрывающий тег </head>. Если закрывающего тега в чанке нет, найдите конец блока, в котором подключаются стили, скрипты и другие элементы секции <head>.

    4. Вставьте код виджета Touch_me

      Скопируйте код виджета Touch_me и вставьте его непосредственно перед </head> или в конец блока <head>. Не изменяйте код виджета при вставке, если это не предусмотрено инструкцией по установке.

    5. Сохраните изменения

      Нажмите «Сохранить», чтобы применить изменения. Если этот чанк используется на нескольких страницах сайта, код Touch_me будет подключаться на всех страницах, где вызывается данный чанк.

    Важно: перед изменением чанка убедитесь, что он действительно отвечает за секцию <head>. Если этот чанк используется на всем сайте, добавленный код также будет загружаться на всех страницах, где он подключен.

    Способ 3. Через файл шаблона на сервере

    Этот способ подходит, если шаблон сайта хранится непосредственно в файлах проекта или структура сайта настроена таким образом, что разметка <head> формируется из файлов на сервере. Для внесения изменений потребуется доступ к файловой системе сайта.

    1. Подключитесь к сайту по FTP, SSH или через файловый менеджер хостинга

      Используйте удобный способ доступа к файлам сайта: FTP-клиент, SSH-подключение или файловый менеджер в панели управления хостингом.

    2. Найдите файл основного шаблона

      Найдите файл, в котором формируется HTML-код страницы и содержится секция <head>. Это может быть файл основного шаблона или отдельный файл, отвечающий за подключение служебных элементов, стилей и скриптов.

    3. Найдите закрывающий тег </head>

      Откройте файл для редактирования и найдите закрывающий тег </head>. Для быстрого поиска можно воспользоваться сочетанием клавиш Ctrl + F (Windows) или Cmd + F (macOS).

    4. Вставьте код виджета Touch_me перед </head>

      Скопируйте код виджета Touch_me и вставьте его непосредственно перед </head>. Не изменяйте код виджета при вставке, если это не предусмотрено инструкцией по установке.

    5. Сохраните изменения

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

      Пример кода:

    <!-- Код виджета Touch_me -->
    <script async src="https://api.touch-me.pro/widget/bundle.js?site=ВАШ_ID" data-touch-me-widget-siteid="ВАШ_ID" data-touch-me-api="https://api.touch-me.pro"></script>

    Очистка кэша MODX

    После изменения шаблона или чанка обязательно очистите кэш сайта: 

    • Админ-панель MODX → «Управление» → «Очистить кэш»;
    • если используется внешний кэш или CDN, очистите его тоже;
    • если сайт использует минификацию или объединение скриптов, после очистки проверьте исходный код страницы повторно.

    Проверка установки

    После установки рекомендуем убедиться, что код подключён корректно.

    1. Откройте ваш сайт в браузере.
    2. Нажмите Ctrl + U (на macOS — ⌘ + Option + U), чтобы открыть исходный код страницы.
    3. Найдите строку data-touch-me-widget-site-id.
    4. Убедитесь, что скрипт расположен внутри блока <head>...</head>.
    5. Проверьте, что код добавлен только один раз.

    После этого можно проверить статус установки сайта в личном кабинете Touch_me.

    Важно

    1. Код виджета должен быть размещён на сайте только один раз.
    2. Не добавляйте скрипт одновременно в шаблон, чанк и файл на сервере.
    3. Если на сайте несколько шаблонов, убедитесь, что код добавлен в общий head-блок или во все нужные шаблоны.
    4. После установки проверьте работу виджета на главной странице и на внутренних страницах сайта.

    Связанные инструкции и гайды

    Содержание инструкции

      Попробуйте все возможности touch_me бесплатно! Триал - 14 дней

      Попробовать бесплатно

      Изучите инструкции и гайды

      Установка

      Самописный сайт

      Инструкция по добавлению кода виджета Touch_me для сайтов с индивидуальной разработкой: HTML, PHP, Laravel, Django, Node.js, React, Vue, Next.js и других технологий.

      Установка

      LPgenerator

      Инструкция по подключению виджета Touch_me на лендинг, созданный в LPgenerator.

      Установка

      Taptop

      Как установить виджет Touch_me в Taptop и запустить его на сайте.

      Начните повышать
      конверсию уже сегодня

      Подключите touch_me и превратите трафик
      в реальные заявки

      Установка Touch_me на MODX— инструкция по подключению виджетов — №2 Установка Touch_me на MODX— инструкция по подключению виджетов — №3
      Установка Touch_me на MODX— инструкция по подключению виджетов — №1

      Мы используем куки, чтобы улучшить ваш пользовательский опыт