Перейти к основному содержимому

Установка Vertex на ваш магазин Shopify

Это руководство проведёт вас через установку премиальной B2B Shopify-темы Vertex — от покупки, через включение B2B, настройку метаполей и до первой публикации.

Предполагаемое время
  • Базовая установка B2C (только тема, без B2B): 5 минут
  • Полная установка B2B (тема + нативный B2B + метаполя + первая компания): 45–60 минут

Перед началом​

Требования к плану Shopify​

Что вам нужноПочему
Любой план ShopifyVertex устанавливается на любом плане — Basic / Shopify / Advanced / Plus
Shopify Plus ИЛИ Advanced + дополнение B2BТребуется только если вы хотите использовать нативные функции B2B Shopify. Без них Vertex работает как отполированная B2C-тема для промышленных товаров.
Включены новые аккаунты покупателейТребуется для всех функций аккаунта — Settings ▸ Customer accounts ▸ Show login link in checkout

Шаг 1 — Установите Vertex из Shopify Theme Store​

  1. Перейдите в Online Store ▸ Themes в админке Shopify
  2. Нажмите Add theme ▸ eisit Theme Store
  3. Найдите «Vertex» или перейдите в категорию B2B & Wholesale
  4. Нажмите Try theme, чтобы установить Vertex как неопубликованную тему в вашем магазине
  5. Нажмите Customize, чтобы открыть редактор темы
На этом этапе ваша витрина не меняется

Тема установлена, но не опубликована. Вы можете предпросматривать и настраивать Vertex, не затрагивая ваш живой магазин. Публикуйте (шаг 6) только когда будете готовы.

Шаг 2 — Включите нативный B2B Shopify (опционально, но рекомендуется)​

Пропустите этот шаг, если вам нужен только B2C — B2B-элементы Vertex автоматически скрываются, когда не авторизован B2B-покупатель.

  1. Перейдите в Settings ▸ Customer accounts
  2. Включите New customer accounts
  3. Прокрутите до B2B и нажмите Manage
  4. Нажмите Enable B2B
  5. Теперь вы увидите новый раздел B2B в боковой панели админки Shopify

→ См. полное руководство по настройке B2B для создания первой компании, назначения каталогов, установки NET-условий и т. д.

Шаг 3 — Настройте пространство имён метаполей Vertex​

Vertex читает несколько метаполей, управляемых продавцом, для работы улучшений страницы товара (информация о торговом представителе, отправляется из, поиск по MPN, технические спецификации, технические характеристики, история цен).

Это можно сделать двумя способами:

Вариант A — Ручная настройка через админку Shopify (~15 мин)​

  1. Перейдите в Settings ▸ Custom data
  2. Нажмите Companies (или Products, в зависимости от того, какое метаполе вы добавляете)
  3. Нажмите Add definition и создайте каждое метаполе из таблицы в Руководстве по настройке метаполей

Вариант B — Массовая настройка через Shopify GraphQL Admin API (~5 мин)​

Используйте GraphQL-мутации, включённые в Руководство по настройке метаполей, чтобы создать каждое определение метаполя Vertex одной партией.

Для начала вам не нужны все метаполя

Тема изящно скрывает компоненты при отсутствии метаполей. Блоки страницы товара (Документы, История цен, Отправляется из) автоматически скрываются, когда соответствующее метаполе пустое. Начните с наиболее значимых (vertex.mpn для поиска по SKU и vertex.rep_* для пилюли торгового представителя) и добавляйте остальные по мере масштабирования.

Шаг 4 — Выберите стартовую цветовую палитру​

Vertex устанавливается как стиль Vertex (промышленность / MRO). Настройка стартовой цветовой палитры позволяет мгновенно перекрасить его под оформление другой ниши — автозапчасти, офис и IT или расходники печати — прямо в редакторе темы.

Стартовая палитраПодходитАкцент
Custom (по умолчанию — кобальтово-синий)Промышленность / MROКобальтово-синий
Signal redАвтозапчастиКрасно-оранжевый
Office blueОфис и IT-снабжениеСиний
Inkline tealРасходники для печатиБирюзовый

Чтобы переключить палитру:

  1. В редакторе темы нажмите Theme settings (слева внизу)
  2. Откройте Colors
  3. Выберите стартовую палитру из раскрывающегося списка Starter color palette
  4. Вся витрина перекрашивается в области предпросмотра

→ См. Каким может быть Vertex, чтобы узнать, как собрать конфигурации автозапчастей / офиса и IT / печати из цветовой палитры и finder.

Шаг 5 — Настройте шапку, навигацию, футер​

Шапка + футер настраиваются через section groups в редакторе темы:

  1. В редакторе темы нажмите Sections (левая боковая панель)
  2. Нажмите Header group, чтобы настроить:
    • Полосу объявлений (верхняя полоса — тёмная, акцентная или светлая схема — со ссылками, соцсетями, телефоном)
    • Приветственную полосу B2B (видна только B2B-покупателям при авторизации)
    • Основную шапку (логотип, поиск, навигация)
  3. Нажмите Footer group, чтобы настроить:
    • Меню футера, ссылки на соцсети, контактный email, подписка на рассылку, иконки оплаты

→ Подробное руководство: Руководство по шапке и футеру · Справочник настроек темы.

Шаг 6 — Предпросмотр, затем публикация​

  1. В редакторе темы нажмите кнопку Preview (вверху справа), чтобы увидеть вашу витрину в новой вкладке
  2. Пройдитесь по:
    • Главной странице
    • Странице коллекции
    • Странице товара
    • Корзине
    • Странице входа покупателя
  3. Если настроен тестовый B2B-аккаунт покупателя, войдите и проверьте:
    • Появляется кобальтово-синяя приветственная полоса с именем компании + значком NET-условий
    • На странице товара отображаются уровни объёмных цен (если назначены каталогу этого покупателя)
    • В шапке появляется пилюля торгового представителя (если установлено метаполе vertex.rep_name)
  4. Вернитесь в Online Store ▸ Themes, найдите Vertex в Theme library
  5. Нажмите меню ⋯ рядом с Vertex ▸ Publish

Теперь ваша витрина работает на Vertex 🎉

Устранение неполадок установки​

«Я не вижу кобальтово-синюю приветственную полосу B2B»​

Причины (в порядке вероятности):

  1. Вы не авторизованы как B2B-покупатель. Кобальтово-синяя полоса отображается только когда customer.b2b? равно true И установлен customer.current_company. Войдите как B2B-покупатель, прикреплённый к компании.
  2. Режим витрины установлен на «Только B2C». Откройте Theme settings ▸ B2B ▸ Storefront mode и убедитесь, что установлен Hybrid (auto) или B2B-only.
  3. Нативный B2B не включён в админке Shopify. Подтвердите Шаг 2 выше.

«Цены показываются как „Войдите, чтобы увидеть цены“, хотя я авторизован»​

Включён переключатель Theme settings ▸ B2B ▸ Hide prices until customer logs in. Чтобы отключить, снимите галочку.

«Пилюля торгового представителя не появляется в шапке»​

Пилюля отображается только когда у компании покупателя установлено значение метаполя vertex.rep_name. Проверьте в Customers ▸ Companies ▸ [Company name] ▸ Metafields, что vertex.rep_name заполнено.

→ См. FAQ + устранение неполадок для дополнительной информации.

Следующие шаги​