إنتقل إلى المحتوى الرئيسي

واجهات Vertex التجريبية الأربع — Vertex وThrottle وOfficeIT وInkline

ترخيص قالب Vertex واحد. أربعة مظاهر متاجر جاهزة للإنتاج. كل إعداد مضبوط لقطاع B2B / B2C صناعي محدد — ألوان تمييز مختلفة، تركيبات صفحة رئيسية مختلفة، محدّدات مختلفة، صور أسلوب حياة مختلفة، خطافات نسخ مختلفة. التبديل بينها بنقرة واحدة في المخصص (دائم) أو معامل URL واحد (معاينة مؤقتة).

إذا كنت تبيع عبر قطاعات متعددة — أو تقرر أي قطاع تتصدر به قبل الإطلاق — هذا هو الدليل الذي يختار نقطة البداية المناسبة لمتجرك.

ترخيص واحد، أربع واجهات

لا تحتاج لشراء Vertex أربع مرات. الإعدادات الأربعة تأتي في نفس ملف القالب. يمكنك أيضاً مزجها — اختر صفحة OfficeIT الرئيسية لكن لون تمييز Throttle، أو تجاوز أي إعداد بمنتقي لوحة الألوان المخصصة. إنها نقاط انطلاق، وليست قوالب مقفلة.


لماذا 4 إعدادات؟

يكافئ متجر قوالب Shopify القوالب التي تظهر النطاق. مشترٍ يتصفح دليل القوالب يريد أن يرى صناعته بنظرة واحدة — وليس عرضاً تجريبياً عاماً لـ "قالب B2B" عليه ترجمته ذهنياً إلى حالة استخدامه.

يعالج Vertex هذا بشحن أربع واجهات تجريبية مأهولة بالكامل تحت ترخيص قالب واحد. كل إعداد:

  • مضبوط حسب الصناعة — اللون والنسخة وتركيبة البطل وترتيب أقسام الصفحة الرئيسية مختارة لرحلة مشتر محددة
  • واعٍ بالمحدّد — قطع غيار السيارات تحصل على محدّد ملاءمة Make/Model/Year؛ مستلزمات الطباعة تحصل على محدّد Printer Brand/Model/Color؛ الإعداد الصناعي لا يحتوي على محدّد (يعتمد على ملاحة المجموعات المُفلترة)
  • مكتمل الصور — حوالي 9 صور بطل / أسلوب حياة / شبكة صناعة لكل إعداد، كلها مولّدة لجمالية ذلك القطاع. لا عدم تطابق صور مخزون.
  • قابل للتخصيص بشكل مستقل — كل إعداد له ملف تجاوزات CSS خاص (assets/demo-{preset}.css) يقلب ألوان التمييز وتمييز المحدّد وأي خيارات طباعة لكل إعداد

النتيجة: يمكنك إطلاق Vertex كمتجر MRO صناعي أو كتالوج قطع غيار سيارات أو موزع مستلزمات مكتبية أو مورد متجر طباعة دون تكليف أي تصميم مخصص.


الإعدادات الأربعة بالتفصيل

الإعداد 1 — Vertex (افتراضي)

الصناعةالإمدادات الصناعية، MRO، الأدوات، المثبتات، العدد اليدوية، السوائل، المواد الكاشطة
لون التمييزكهرماني #fbbf24
المحدّدلا يوجد — يعتمد على المرشحات المُفلترة + البحث التنبؤي
بطل الصفحة الرئيسيةطباعة جريئة + صور ورشة عمل / مستودع
خطافات B2B"تسعير الحجم"، "NET-30 متاح"، "ISO 9001 معتمد"، "شحن خلال 24 ساعة"
الأفضل لـالموزعين الصناعيين العامين، موردي MRO، تجار المثبتات / الأدوات، كتالوجات العدد، موردي JanSan

هذا هو الافتراضي. عندما تثبّت Vertex من متجر قوالب Shopify، هذا ما يُحمَّل. التمييز الكهرماني يربط بلغة بصرية دافئة وصناعية، تشبه McMaster-Carr / Grainger / Fastenal يعرفها مشترو المشتريات فوراً.

Vertex preset homepage (industrial amber)

الإعداد 2 — Throttle (قطع غيار السيارات)

الصناعةقطع غيار السيارات، الأداء، ما بعد البيع، بديل OEM، الدراجات النارية، البحرية، الرياضات الميكانيكية
لون التمييزبرتقالي محمر #ec5f24
المحدّدتسلسل Make / Model / Year للملاءمة (3 قوائم منسدلة)
بطل الصفحة الرئيسيةرسائل الملاءمة أولاً ("ابحث عن قطع لمركبتك") مع المحدّد فوق مجموعات المنتجات
خطافات B2B"تسعير تجاري"، "شحن من المستودع"، "مرجع OEM المتقاطع"، "حسابات الموزعين"
الأفضل لـموزعو قطع غيار السيارات، متاجر الأداء، قطع الدراجات النارية / البحرية / RV، ATV / UTV / الرياضات الميكانيكية

ميزة Throttle المميزة هي محدّد الملاءمة — قائمة منسدلة متسلسلة من 3 خطوات (Make ▸ Model ▸ Year) معروضة على بطل الصفحة الرئيسية والشريط الجانبي لصفحة المجموعة وكشريط ثابت اختياري. يختار المشترون مركبتهم مرة واحدة؛ تُفلتر عروض المنتجات اللاحقة لتشمل القطع المتوافقة فقط.

التمييز البرتقالي المحمر يربط بلغة بصرية للأداء / السيارات / الطاقة — RockAuto + Summit Racing في قالب واحد.

Throttle preset homepage (auto parts red)

الإعداد 3 — OfficeIT (المكاتب وتقنية المعلومات والإلكترونيات)

الصناعةالمستلزمات المكتبية، أجهزة IT، الإلكترونيات، ورق الناسخات، الشاشات، لوحات المفاتيح، الحواسيب المحمولة، المستلزمات بالجملة
لون التمييزأزرق (شركاتي، بدرجة IT)
المحدّدتسلسل Brand / Category / Capacity (3 قوائم منسدلة) — مثلاً "HP ▸ Toner ▸ 5000 pages"
بطل الصفحة الرئيسيةرسائل الطلب بالجملة، خطافات حساب B2B، CTAs لـ NET-30 / فوترة الفاتورة
خطافات B2B"خصومات الجملة"، "Net-30 للأعمال"، "شحن مجاني فوق $X"، "مدير حساب مخصص"
الأفضل لـموزعو المستلزمات المكتبية، موزعو IT، تجار الجملة للإلكترونيات، إمدادات المدارس / الحكومة، بائعو المشتريات الشركاتية

يتصدر OfficeIT بـ طلبات مكتب B2B بالجملة — رحلة المشتري هي "أحتاج لتجهيز مكتب بـ 50 طاولة" وليس "أحتاج فأرة واحدة". تُبرز نسخة البطل وCTAs الطلب بالجملة وRFQ وNET-30 بشكل بارز؛ تعرض الصفحة الرئيسية لوحة الطلب بالجملة السريعة فوق المجموعة المميزة القياسية.

التمييز الأزرق يربط باللغة البصرية لـ IT الشركاتي / Quill / Staples Business Advantage التي يتوقعها المشترون من هذه الفئة.

OfficeIT preset homepage (office/IT blue)


ما يأتي في كل إعداد

كل إعداد يأتي بنسخه الخاصة من هذه الأصول:

الأصلمتغير لكل إعداد
قالب الصفحة الرئيسيةtemplates/index.json (Vertex الافتراضي) + templates/index.throttle.json وindex.officeit.json وindex.printsupply.json
قالب المجموعةtemplates/collection.json + متغيرات لكل إعداد حيث يختلف ترتيب الأقسام (مثلاً Throttle يضع المحدّد فوق المرشحات)
قالب المنتجtemplates/product.json + متغيرات لكل إعداد (مثلاً Inkline يضيف تبويب "الطابعات المتوافقة")
تجاوز CSSassets/demo-{preset}.css — يتجاوز --color-accent و--color-on-accent وتمييز المحدّد ومحطات التدرج
صور البطلحوالي 3 متغيرات بطل لكل إعداد، كلها مولّدة لجمالية القطاع
صور أسلوب الحياةحوالي 3 صور أسلوب حياة لكل إعداد (ورشة / وكالة / مكتب / متجر طباعة)
صور شبكة الصناعةحوالي 3 صور بطاقة صناعة لكل إعداد (مثلاً HVAC + التصنيع + المرافق لـ Vertex؛ السيارات + الدراجات النارية + القوارب لـ Throttle)
نسخة العرض التجريبيعناوين البطل والعناوين الفرعية وتسميات CTA ونصوص الشهادات — كلها مضبوطة لكل إعداد

هذا يعني أن تبديل الإعدادات ليس "غيّر لوناً واحداً وادعُ" — إنه تبديل متجر متماسك.


كيفية تبديل الإعدادات

لديك طريقتان للتبديل — دائم ومعاينة مؤقتة.

دائم — عبر المخصص

  1. افتح لوحة Shopify واذهب إلى Online Store ▸ Themes.
  2. انقر Customize على Vertex.
  3. في الشريط الجانبي الأيسر، انقر Theme settings ▸ Colors.
  4. مرّر إلى Starter color palette.
  5. اختر واحداً من:
    • Custom — لوحة مخصصة بالكامل (تستخدم منتقي الألوان اليدوية أدناه)
    • Vertex — كهرماني صناعي (افتراضي)
    • Throttle — برتقالي محمر لقطع غيار السيارات
    • OfficeIT — أزرق شركاتي
    • Inkline — فيروزي للطباعة/التصوير
  6. Save في أعلى اليمين.

يتقلّب لون التمييز فوراً. لتبديل الصفحة الرئيسية أيضاً إلى تخطيط ذلك الإعداد، راجع تبديل قالب الصفحة الرئيسية أدناه.

الإعداد المسبق للألوان مقابل قالب الصفحة الرئيسية

يقلب الإعداد المسبق للألوان في Theme settings ▸ Colors الألوان فقط. للحصول على تجربة الإعداد الكاملة (تخطيط الصفحة الرئيسية، المحدّد، صور أسلوب الحياة)، تحتاج أيضاً إلى تطبيق لاحقة قالب الصفحة الرئيسية المطابقة — راجع القسم التالي.

مؤقت — عبر معاينة URL

لمعاينة إعداد على أي URL واجهة دون تطبيقه:

الإعدادمعامل URL للمعاينة
Vertex(افتراضي — بدون معامل)
Throttle?view=throttle
OfficeIT?view=officeit

على سبيل المثال:

https://your-store.myshopify.com/?view=throttle
https://your-store.myshopify.com/collections/all?view=officeit

يستخدم هذا ميزة لاحقة القالب الأصلية في Shopify — يعرض المتجر باستخدام ملف القالب البديل (index.throttle.json) لذلك العرض الفردي للصفحة. لا يُحفظ شيء؛ التحديث بدون المعامل يعود إلى افتراضك.

استخدم هذا لـ:

  • اختبار A/B لإعداد مع جمهور صغير قبل الالتزام
  • إرسال URL تجريبي لصاحب مصلحة ("انظر كيف ستبدو نسخة قطع غيار السيارات من متجرنا")
  • مقارنة تركيبات البطل جنباً إلى جنب في علامتي تبويب متصفح

تبديل قالب الصفحة الرئيسية

لتطبيق تخطيط الصفحة الرئيسية لإعداد بشكل دائم:

  1. افتح Online Store ▸ Themes ▸ Customize ▸ Home.
  2. في محدد القالب العلوي، اختر Add template أو اختر متغير index.{preset}.json للإعداد.
  3. احفظ.

بدلاً من ذلك، عيّن صفحة رئيسية بـ لاحقة القالب ذات الصلة في إعداد الصفحة، أو حرّر settings_data.json مباشرة إذا كنت مرتاحاً.

امزج وطابق

لا شيء يجبرك على استخدام صفحة رئيسية لإعداد مع تمييزه. يمكنك استخدام تخطيط صفحة Throttle الرئيسية (لأنك تحب تركيبة محدّد الملاءمة أولاً) مع تمييز Inkline الفيروزي (لأنه يطابق علامتك التجارية) وقسم لوحة الطلب بالجملة في OfficeIT (لأن مشتريك يلصقون من جداول البيانات). Vertex قابل للتركيب.


كيف يعمل تجاوز لون التمييز

كل إعداد يأتي بملف CSS صغير في assets/demo-{preset}.css:

/* assets/demo-throttle.css */
:root {
--color-accent: 236 95 36; /* ec5f24 — Throttle red-orange */
--color-on-accent: 255 255 255;
}
.finder-bar { --finder-accent: var(--color-accent); }

عندما يكون إعداد Starter color palette مضبوطاً على Throttle، يتضمن التخطيط هذا الملف عبر {% if settings.starter_palette == 'throttle' %}{{ 'demo-throttle.css' | asset_url | stylesheet_tag }}{% endif %}.

متغيرات CSS للتمييز --color-accent + --color-on-accent تتدفق عبر كل مكون — الأزرار والكبسولات والشارات والروابط وحلقات التركيز وتمييز القوائم المنسدلة وشريط ترحيب B2B وقوائم المحدّد المنسدلة وCTAs البطل. قلب اللوحة يقلب تمييز المتجر بأكمله في عرض واحد.

هذا يعني أنه يمكنك أيضاً تأليف إعدادك الخاص عبر:

  1. نسخ أحد ملفات demo-*.css الموجودة
  2. إعادة تسميته إلى demo-mybrand.css
  3. تعديل قيم --color-accent + --color-on-accent
  4. ربطه في layout/theme.liquid بفرع {% if %} آخر
  5. (اختياري) إضافة قالب صفحة رئيسية مطابق في templates/index.mybrand.json

يمكن لمستخدم متمكن إنتاج إعداد خامس في أقل من ساعة.


اختيار إعدادك — مصفوفة قرار

استخدم هذه لاختيار نقطة البداية. تذكر: يمكنك تجاوز أي شيء بعد ذلك.

إذا كنت تبيع...ابدأ بـالسبب
المثبتات، العدد اليدوية، المزلقات، المواد الكاشطة، الأدوات، MRO العامVertexخط أساس صناعي عام، لا حاجة لمحدّد (المرشحات المُفلترة تقوم بالعمل)
قطع غيار السيارات / الدراجات النارية / البحرية / RV / الرياضات الميكانيكيةThrottleمحدّد الملاءمة هو الميزة الحاسمة لهذا القطاع
المكاتب، IT، الإلكترونيات، مستلزمات الناسخات، إمدادات المدارس / الحكومةOfficeITطلبات مكتب B2B بالجملة + لغة بصرية لـ IT الشركاتي
حبر الطابعات، Toner، ورق كبير الحجم، مستلزمات التصويرInklineمحدّد خراطيش الطابعة يلغي خطأ المشتري رقم 1 في هذا القطاع
التنظيف / الصرف الصحي (JanSan)Vertexخط أساس MRO لـ Vertex يربط بشكل نظيف بـ JanSan؛ لا حاجة لمحدّد متخصص
المواد الكيميائية الصناعية / المزلقات مع أوراق بيانات تقنيةVertexجداول المواصفات التقنية + كتلة المستندات أساسية لإعداد Vertex
مواد البناء (الأخشاب، الخرسانة، الجبس)Vertexخط أساس Vertex + صفحة الطلب بالجملة يعملان جيداً؛ فكّر في OfficeIT الأزرق إذا أردت لوحة أبرد
المنتجات الترويجية مع طباعة شعار مخصصةInklineالتمييز الفيروزي + لغة متجر الطباعة البصرية تنسجم مع الفئة، حتى لو كان المحدّد أكثر فائدة للحبر/Toner
الجملة فقط (لا B2C)Vertex أو OfficeITكلاهما يعمل؛ اختر التمييز الذي يطابق علامتك التجارية. بدّل وضع الواجهة إلى B2B-only.

تخصيص إعداد

الإعدادات هي نقاط انطلاق. بعد التثبيت، يمكنك:

التخصيصكيف
لون التمييزTheme settings ▸ Colors ▸ Starter palette ▸ Custom، ثم اختر --color-accent الخاص بك
الشعارTheme settings ▸ Logo — استبدل الشعار التجريبي بـ SVG أو PNG الخاص بك
ترتيب أقسام الصفحة الرئيسيةالمخصص ▸ Home — اسحب الأقسام لإعادة الترتيب، أو أضف/أزل أقساماً من لوحة 30+ قسماً
صور البطلانقر قسم البطل في المخصص، استبدل صورة كل شريحة
صور أسلوب الحياة / الصناعةاستبدلها لكل قسم في المخصص؛ كل قسم لديه منتقي صور
تسميات + بيانات القائمة المنسدلة للمحدّد(Throttle / OfficeIT / Inkline) — راجع دليل إعداد المحدّد لهيكل البيانات المُدار بالحقول المخصصة
الطباعةTheme settings ▸ Typography — خط العناوين، خط النص، نسبة المقياس
النسخة / CTAsحرّر النص ضمن السياق في المخصص لكل قسم
الترجماتTheme settings ▸ Languages — وفّر سلاسل مخصصة عبر تجاوزات locales/*.schema.json

بعد التخصيص، يمكنك حفظ عملك كـ قالب مسمى في Online Store ▸ Themes ▸ Theme library — مفيد عند إجراء اختبارات A/B أو تحضير تغييرات بصرية.


قراءة ذات صلة


ملخص

  • يأتي Vertex بـ 4 إعدادات تجريبية في ترخيص قالب واحد: Vertex (كهرماني صناعي) وThrottle (برتقالي محمر لقطع غيار السيارات) وOfficeIT (أزرق مكتب/IT) وInkline (فيروزي لإمدادات الطباعة).
  • كل إعداد له قالب صفحة رئيسية ومحدّد وCSS تمييز وحوالي 9 صور أسلوب حياة خاصة به.
  • بدّل بشكل دائم في Theme settings ▸ Colors ▸ Starter palette + بتطبيق لاحقة قالب الصفحة الرئيسية للإعداد.
  • بدّل بشكل مؤقت للمعاينات بإلحاق ?view=throttle | officeit | printsupply بأي URL واجهة.
  • الإعدادات هي نقاط انطلاق — لون التمييز وتخطيط الصفحة الرئيسية والمحدّد والصور والنسخة كلها قابلة للتجاوز بشكل مستقل.
  • إعداد مخصص خامس يستغرق حوالي ساعة للتأليف بنسخ ملف demo-*.css موجود وربطه في layout/theme.liquid.