be art agency
Адресный сбор
небольшое руководство со скриншотиками по добавлению,
оптимизации и поддержrt сайта.

Удачи и
Приятного просмотра!

Кстати, читать гайд удобнее всего на одной из двух  опубликованных страниц.

Новый кот Адресный сбор
Как добавить страницу котика на сайт?
  1. Нажимаем кнопку + Создать новую  страницу, в появившемся окне выбираем пункт Мои шаблоны.
  2. Из шаблонов выбираем Фонд экстренной помощи.
  3. Страница создана и готова к редактированию.
Как редактировать и настраивать новую страницу
  1. В первом блоке нажимаем Редактировать блок.
  2. В появившемся окне находим меню слоев (находится слева).
  3. Выбираем слой Фото.
  4. Переключается на меню настроек (находится справа).

Для замены обложки нажимаем на большую черную кнопку Upload file и загружаем нашу фотографию. Все готово, фотография обновлена.

Как изменить текст на обложке?


  1. В меню слева выбираем группу Мейн.
  2. В открывшейся группе выбираем первый блок.

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


Для выравнивания текста внутри данной группы нужно просто нажать на автовыравнивание по центру: по вертикали и горизонтали.


Будьте внимательны, данную настройку необходимо сделать для всех версий сайта (мобильной и декстопной) отдельно.

Что делать, если на мобильной версии картинка отображается некорректно?


  1. В пункте Position нажимаем на иконку [ · ].
  2. В появившемся окне нажмите на центр лица котика.
  3. Все готово, сохраняем и смотрим результат.
Как поменять текст?
  1. Выбираем второй сверху блок TL03.
  2. Заменяем текст на нужный нам.
  3. Нажимаем на иконку книги над текстом
(этот элемент называется “Автотипограф”). С его помощью в текст автоматически добавляется неразрывный пробел.
Как поменять фото?
  1. Переходим в блок GL16.
  2. Нажимаем на вкладку “Контент” и меняем фотографии.

Важно следить за отображением фото-контента, и, по возможности, располагать кота в центре карточки.


Убедительная просьба! Сжимайте фото перед загрузкой на сайт, ссылка на сервис: https://www.iloveimg.com/ru/compress-image

Как настроить страницу Адресного сбора?

За работу виджета отвечает самый нижний блок — T123!
Чтобы настроить сам адресный сбор необходимо перейти в настройки Миксплат.

Настройка миксплата
  1. Заходим в раздел Миксплат.
  2. На главной странице Миксплата находим пункт Инструкменты. Выбираем самый нижний блок Адресные сборы.
  3. Далее следуя инструкциям заполняем всю необходимую информацию. После завершения редактирования мы попадаем на страницу Размещение адресного сбора.
  4. Находим пункт Форма пожертвований и нажимаем кнопку установить на сайт.
Интеграция формы адресного сбора на сайт
  1. Копируем код и возвращаемся в тильду.
  2. Находим наш блок T123 в самом низу страницы и нажимаем на кнопку контент.
  3. В появившемся окне нам нужно будет поменять две строки кода.
Начнем

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


Берем вариант из примера и вставляем:

<mixplat-form id='6ab21715-cb30-409b-8fad-c0d74f1c89b9' data-type='mixplat-form' data-tid='10925'></mixplat-form>

Обязательно сохраняем результат

Далее все в том же блоке Т123 нажимаем на пункт настройки.
Листаем в самый низ и копируем текст из пункта Block id


В нашем примере это #rec819060705


После этого возвращаемся в блок Т123 и нажимаем контент.

Теперь нам нужна строка №10:

Вставляем копированный Block id


Обратите внимание!

div перед block id не обязателен, но пробел между номером блока и открывающей фигурной скобкой обязателен!


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

Возвращаеся в Миксплат и копируем первый код
<script src="https://widgets.donation.ru/wloader/bb8696b2-c8f8-4cc7-a8ca-bd28c5fa1e6e/wloader.js" async></script>

Для этого открываем настройки и переходим в раздел дополнительно и ищем раздел Html-код для вставки внутрь HEAD, после чего Редактировать код.


Вставляем наш код, сохраняем и закрываем страницу.


Обратите внимание! При закрытии данного блока вас перебросит на главную страницу тильды, не пугайтесь, так и должно быть, но страницу опубликовать придется, поэтому возвращаемся на нашу страницу и публикуем только её, либо все страницы из главного меню.

Как добавить новый адресный сбор

Обратите внимание на имя кота!


Необходимо выделить текст, в пункте выше выбрать (-) пятый слева пункт добавить ссылку, в появившемся окне вписать в верхнюю строку header, цвет и стиль задавать не надо


Имя кота пишется в пункте описание.


Отступ между именем кота и описанием — 1 строка.


Фото вставлять в рамку
Figma с рамками: Figma.


Далее добавляем ранее созданную нами ссылку.


Сохраняем, публикуем, наслаждаемся результатом.


Теперь все готово!

Остались вопросы?