Сравнение версий

Ключ

  • Эта строка добавлена.
  • Эта строка удалена.
  • Изменено форматирование.

Image Modified

Оглавление
 

...

Настройка Мобильного Приложения через плагин «Демонстрация MetaUI»

Информация

Мобильное приложение можно приобрести тут https://box.otcommerce.com/prices-and-promo или через менеджеров ОТ в вашем скайп-чате

Как загрузить приложение в GooglePlay

Подробные шаги описаны в инструкции Гугла: https://support.google.com/googleplay/android-developer/answer/9859152?hl=ru

Где настроить приложение

Открываем админку ОТ и кликаем по пункту меню «Плагины»

...

Если у вас нет в списке этого плагина, Зайдите зайдите на вкладку «Загрузить/Обновить» и установите плагин

Если в списке Загрузок загрузок тоже нет этого плагина, обратитесь в Поддержку или к вашему менеджеру в скайп-чате.

Дизайн приложения

...

Лого

Цвета

Витрина

Мультиязычность и переводы

Реклама

баннеры

подборки

...

: логотип и цвета

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

В разделе плагинов кликаем по плагину «Демонстрация MetaUI»

Image Added

В списке доступных изменений ищем пункт «Настройка дизайна приложений»

Image Added

Кликаем по нему мышкой и нажимаем кнопку «Открыть»

Image Added

Логотип

Берем тот же самый логотип, что вы используете в Коробке ОТ и сохраняем его на ваш компьютер (если логотип у вас и так сохранен, пропускаем этот шаг).

Нажимаем на кнопку «Выбрать файл»

Image Added

Логотип загрузится автоматически, когда вы выберете файл на компьютере. Чтобы логотип появился в приложении, нажимаем кнопку «Сохранить»

Image Added

Цветовое оформление

Делает цветовое оформление 1 в 1 как у вашего магазина.

Переходим в админке в раздел «Конфигурация → Конструкция сайта → Тема дизайна»

Image Added

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

Кликаем по цвету дизайна и записываем цифры RGB (если у вас есть брендбук и используется другая система цветов, используйте её)

Image Added

Соотношение цветов в Коробке ОТ и в мобильном приложении

Название полей в приложенииНазвание полей в Коробке ОТ
Вспомогательный цветДизайн. Цвет 1
Фоновый цветЦвет фона
Основной цветДизайн. Цвет 2
Цвет текстаЦвет текста
Цвет текста на фоне основного цвета 

 

Цвета в приложении для наглядности будут обозначены ярко-синим цветом

Вспомогательный цветФоновый цветОсновной цвет
Первый цвет кнопок, нижнее менюФон страниц приложенияВторой цвет кнопок
Image AddedImage AddedImage Added

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

Image Added

Записываем цвет в формате RGB

Image Added

Если у вас формат не RGB, переключаем на нужный формат с помощью стрелочек

Image Added

После выбора цвета, нажимаем кнопку «Сохранить»

Image Added

Так по очереди делаем со всеми цветами

Image Added

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

Image Added

Нажимаем кнопку «Сохранить»

Image Added

Витрина

Настройка витрины помогает показать или скрыть определенные параметры товара, например, отзывы или ссылку на оригинал.

В разделе плагинов кликаем по плагину «Демонстрация MetaUI»

Image Added

В списке доступных изменений ищем пункт «Настройка витрины»

Image Added

Кликаем по нему мышкой и нажимаем кнопку «Открыть»

Image Added

Выбираем вкладку «Мобильно приложение»

Image Added

Проходим по списку и выбираем скрыть или показать параметры товаров.

Чтобы скрыть или показать, кликаем по настройке под названием, чтобы появился выпадающий список

Image Added

В выпадающем списке выбираем показать или скрыть

Image Added

Нажимаем кнопку «Сохранить»

Image Added

Баннеры

В разделе плагинов кликаем по плагину «Демонстрация MetaUI»

Image Added

В списке доступных изменений ищем пункт «Настройки баннеров»

Image Added

Кликаем по нему мышкой и нажимаем кнопку «Открыть»

Image Added

Здесь есть список всех баннеров, которые были установлены для мобильного приложения. Чтобы добавить баннер, нажимаем кнопку «Добавить».

Image Added

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

Image Added

Добавляем название баннера. Кликаем по названию по умолчанию (banner)

Image Added

Пишем название

Image Added

Нажимаем кнопку «Сохранить»

Image Added

Загружаем изображение (сам баннер). Нажимаем кнопку «Выбрать файл» и выбираем файл на вашем компьютере.

Image Added

Нажимаем кнопку «Сохранить»

Image Added

Теперь решаем куда будет вести баннер. Можно задать ссылку, которая направит покупателя на ваш сайт или указать категорию в каталоге. Рассмотрим оба варианта по порядку.

Баннер со ссылкой

Image Added

В списке «Действия» выбираем ссылку, нажимаем «Сохранить»

Image Added

В поле «Параметр действия» вставляем ссылку 

Image Added

Нажимаем «Сохранить»

Image Added

Баннер с категорией

В списке «Действия» выбираем «Категория» и нажимаем «Сохранить»

Image Added

В поле «Параметр действия» пишем id категории. Чтобы получить id открываем категорию на вашем сайте и смотрим ссылку. Копируем otc-8929 (у вас будет свой id)

Image Added

Вставляем скопированный id  в поле «Параметр действия» и нажимаем «Сохранить»

Image Added

 

Самое главное действие: выбираем где будет показ баннера. Из списка справа кликаем по «Мобильное приложение»

Image Added

Нажимаем кнопку «Добавить»

Image Added

Нажимаем кнопку «Сохранить» и баннер появится в вашем мобильном приложении

Image Added

 

Подборки

В разделе плагинов кликаем по плагину «Демонстрация MetaUI»

Image Added

В списке доступных изменений ищем пункт «Настройки подборок»

Image Added

Кликаем по нему мышкой и нажимаем кнопку «Открыть»

Image Added

Выбираем вкладку «Мобильное приложение»

Image Added

Добавить

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

Image Added

Нажимаем на кнопку «Добавить»

Image Added

Нажимаем на кнопку «Сохранить»

Image Added

Поменять местами

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

Image Added

Зажимаем мышку и перетаскиваем подборку куда необходимо

Image Added

Нажимаем на кнопку «Сохранить»

Image Added

Удалить

Нажимаем на крестик справа от названия подборки

Image Added

Подборка не удаляется, а перемещается в список справа, поэтому, при желании, ее можно будет вернуть на главную страницу

Настройка подборок

Ниже на странице все подборки собраны в общую форму и каждой из них можно задать 2 параметра:

  1. количество товаров в подборке
  2. включить или выключить случайный поиск

Image Added

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

Image Added

Задаем количество элементов от 1 до 100 (чем меньше тем быстрее грузится главная страница, однако меньше 4-6 шт лучше не ставить.

Image Added

Нажимаем кнопку «Сохранить»

Image Added

Выбираем включить или выключить случайный поиск

Image Added

Нажимаем кнопку «Сохранить»

Image Added