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

Установка 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 ▸ Visit 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 поставляется с 4 стартовыми палитрами:

ПресетОтрасльАкцент
Vertex (по умолчанию)Промышленность / MROЯнтарный #fbbf24
ThrottleАвтозапчастиКрасно-оранжевый #ec5f24
OfficeITОфис и IT-снабжениеСиний
InklineПечатное снабжениеБирюзовый

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

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

→ См. Руководство по демо-пресетам для различий между пресетами.

Шаг 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 + устранение неполадок для дополнительной информации.

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