Брендинг и контент: логотип, главная и тексты

Шаг 1. Откройте «Брендинг и контент»

Войдите в кабинет владельца, нажмите «Панель» и выберите «Брендинг и контент». Страница открывается сразу на блоке «Логотип».

Интерфейс разбит на блоки сверху вниз, в том же порядке, в котором они идут на странице: логотип, главная страница, hero, вступление, преимущества, шаги, финальный CTA, страница «О программе», подвал и SEO. Порядок совпадает с порядком блоков на витрине — удобно заполнять и сразу представлять результат. Так проще.

Если вы меняете только текст, не трогайте файлы: пустое поле загрузки оставляет текущий знак. Замена файла происходит только при выборе нового.

Права на страницу есть только у владельца программы и администратора. Если коллега не видит раздел, проверьте его роль: клиентские аккаунты брендинг не настраивают.

Заполняйте блоки по порядку и сохраняйте в конце. Промежуточных кнопок «сохранить блок» нет: всё пишется одной кнопкой, поэтому не закрывайте вкладку до сохранения — введённый текст пропадёт.

Внизу страницы есть блок SEO: заголовок и описание для поиска. Они не видны на витрине, но именно их показывают Яндекс и Google в результатах. Заполните их после текстов главной.

Шаг 2. Загрузите логотип и favicon

Фирменный знак — первое, что видит клиент. Он должен быть в PNG или WebP до 2 МБ, с прозрачным фоном и читаться на светлой шапке.

Favicon — маленькая иконка рядом с названием вкладки. Без неё браузер показывает пустой лист, и страница выглядит недоделанной. Загрузите квадратную картинку 64×64 или 128×128: она уменьшится автоматически.

Важно. Не растягивайте картинку до загрузки: если исходник маленький, на витрине он будет мыльным. Загружайте картинку не меньше 400 px по ширине.

Название бренда попадает в шапку сайта, письма и подвал. Пишите так, как клиент называет вас в разговоре: «Кофейня на Покровке» лучше, чем «ИП Иванов А. А.».

Прозрачный фон обязателен: белый квадрат вокруг знака виден на цветной шапке и выглядит как ошибка вёрстки. Если исходник на белом фоне, уберите его в редакторе перед загрузкой.

Не используйте стоковые иконки вместо знака: клиент запоминает форму и цвет. Уникальная картинка работает лучше идеальной, но чужой.

Проверьте знак на тёмной и светлой шапке: если он теряется на одном из фонов, добавьте тонкую обводку или выберите другую версию.

Шаг 3. Включите блочную главную

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

Блочная главная собирается из тех же полей, что ниже на странице: hero, вступление, преимущества, шаги и CTA. Пустой блок не выводится — витрина не покажет дыру, но и пользы от него не будет.

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

Не включайте блочную главную на живом трафике без предупреждения партнёров: ссылки ведут на те же адреса, но клиент увидит другую страницу и может не узнать магазин.

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

Совет. Включите блочную главную до заполнения текстов и проверьте на витрине: так видно, какие блоки уже есть, а какие ещё пустые.

Шаг 4. Заполните Hero

Hero — первый экран: заголовок, подзаголовок и кнопка. Здесь решается, останется клиент или уйдёт.

Заголовок пишите про выгоду, а не про технологию: «Покупайте с бонусом за друга» работает лучше, чем «Реферальная программа нового поколения». Подзаголовок объясняет механику в одном предложении.

Проверьте длину: на телефоне заголовок в две строки уже выглядит громоздко. Если не помещается, сокращайте слова, а не размер шрифта.

Кнопка должна обещать действие, а не «отправить»: «Смотреть каталог», «Выбрать товар», «Начать покупки». Одна кнопка на первом экране — этого достаточно.

Если не знаете, что написать, начните с вопроса клиента: «Что я получу?» Ответ и станет заголовком. Подзаголовок объяснит, как это работает, а кнопка покажет первый шаг.

Кнопка ведёт в каталог или на регистрацию. Ссылка указывается относительным путём — `/catalog` или `/register`, без домена: домен подставится сам.

Ошибка. Ставить в hero ссылку на внешний сайт. Клиент уйдёт с программы и не зарегистрируется, а партнёр не получит привязку.

Шаг 5. Преимущества, шаги и CTA

Дальше идут блоки, которые объясняют механику и снимают возражения.

Преимущества — четыре карточки: доставка, ассортимент, бонусы, поддержка. Пишите по одному предложению: длинный текст в карточке не читают.

Карточки должны отвечать на возражения, а не перечислять достоинства. «Доставим за день» снимает страх ждать; «Широкий ассортимент» не снимает ничего.

Шаги пишите в одном времени и от лица клиента: «Выбираете товар», «Оплачиваете», «Получаете бонус». Такой текст читается как инструкция, а не как реклама.

Финальный CTA не дублируйте дословно: если в hero кнопка «Смотреть каталог», в конце можно «Начать покупки» — тот же путь, другое действие.

Не перегружайте блоки эмодзи и капсом: они привлекают внимание, но в большом количестве выглядят как спам. Один акцент на блок — достаточно.

Шаги объясняют путь клиента: зарегистрировался, купил, получил бонус. Пять строк достаточно; если шагов больше, объедините.

Финальный CTA — последний экран перед подвалом. Он повторяет главное действие: «Начните покупать с бонусом» и кнопка в каталог.

Шаг 6. Сохраните и проверьте витрину

Кнопка «Сохранить брендинг» одна на всю страницу: она записывает все блоки сразу. После сохранения откройте витрину в новой вкладке и пройдите по ней глазами клиента.

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

Откройте витрину в инкогнито: в обычном браузере вы уже авторизованы, и часть блоков может выглядеть иначе. Инкогнито показывает страницу глазами нового клиента.

Проверьте скорость: большая картинка грузится секунды. Если файл весит больше мегабайта, сожмите его перед загрузкой — визуально разница незаметна, а загрузка быстрее.

Сохраните страницу в закладки: брендинг меняют нечасто, но при каждой смене акции или названия возвращаться придётся сюда. Один клик экономит поиск раздела в меню.

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

Что проверить после загрузки логотипа

Важно. После смены знака проверьте письма: в шаблоне может остаться старое название. Клиент получит письмо от «Shop» и не поймёт, кто ему пишет.

Частые вопросы

Можно ли загрузить SVG? Интерфейс принимает PNG и WebP. SVG сначала конвертируйте в PNG с прозрачным фоном.

Что делать, если логотип выглядит размытым? Загрузите исходник большего размера: интерфейс уменьшает картинку, но не увеличивает. Минимум — 400 px по ширине.

Почему на витрине старые тексты? Проверьте, сохранён ли брендинг, и обновите страницу с очисткой кеша. Иногда браузер держит старую версию несколько минут.

Можно ли сделать разные тексты для разных страниц? Блочная главная одна; отдельные страницы (каталог, «О программе») настраиваются своими полями.

Что будет, если не заполнить блок? Пустой блок не выводится на витрине. Но лучше заполнить все: дыры в структуре заметны по ритму страницы.

Нужно ли менять SEO-поля? Да, если вы изменили название: заголовок и описание страницы должны совпадать с брендом, иначе поиск покажет старое имя.

• Логотип загружен и читается
• Favicon установлен
• Блочная главная включена
• Hero заполнен
• Преимущества и шаги готовы
• Брендинг сохранён
• Витрина проверена на телефоне

Что запомнить

Брендинг — это не дизайн ради красоты, а узнаваемость: клиент должен понять, куда попал, за пару секунд. Логотип, название, hero и подвал закрывают этот вопрос.

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