تخطَّ إلى المحتوى
Wink

نظام إدارة المحتوى HubSpot

يدعم نظام إدارة المحتوى HubSpot وحدات HTML مخصصة ورمز رأس/تذييل على مستوى الموقع، مما يجعل من السهل تضمين مكونات Wink في صفحات التسويق وصفحات الهبوط.

تحميل سكريبتات Wink على مستوى الموقع

Section titled “تحميل سكريبتات Wink على مستوى الموقع”
  1. في HubSpot، اذهب إلى التسويق → الملفات والقوالب → أدوات التصميم.
  2. افتح main.css الخاص بـ الثيم النشط أو استخدم إعدادات المحتوى العالمية.
  3. بدلاً من ذلك، اذهب إلى الإعدادات → الموقع الإلكتروني → الصفحات → رمز مخصص.
  4. في حقل رأس HTML، أضف ورقة الأنماط: 
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css">
  5. في حقل تذييل HTML، أضف السكريبت ومحمل التطبيق (استبدل YOUR_CLIENT_ID): 
    <script src="https://elements.wink.travel/elements.js" type="module" defer></script>
    <wink-app-loader client-id="YOUR_CLIENT_ID"></wink-app-loader>
  6. احفظ وانشر.

إضافة مكون عبر وحدة HTML مخصصة

Section titled “إضافة مكون عبر وحدة HTML مخصصة”
  1. في أدوات التصميم، أنشئ وحدة جديدة من نوع نص منسق أو HTML.
  2. في محتوى الوحدة الافتراضي، الصق HTML الخاص بالمكون: 
    <wink-content-loader
      layout="HOTEL"
      id="YOUR_LAYOUT_ID"
    ></wink-content-loader>
  3. احفظ الوحدة واسحبها إلى أي قالب صفحة أو صفحة باستخدام محرر الصفحات.

إضافة مكون مباشرة في محرر الصفحة

Section titled “إضافة مكون مباشرة في محرر الصفحة”

إذا كنت تفضل عدم إنشاء وحدة، يمكنك استخدام قسم HTML مخصص في محرر السحب والإفلات:

  1. افتح الصفحة في محرر صفحات HubSpot.
  2. انقر على إضافة واختر قسم HTML مخصص أو تضمين.
  3. الصق وسم المكون في حقل HTML.
  4. انقر على تطبيق وانشر الصفحة.

المكونات المتاحة

Section titled “المكونات المتاحة”
المكونوسم HTMLالغرض
محمل المحتوى<wink-content-loader>عرض بطاقات الفنادق، الشبكات، الخرائط
البحث<wink-lookup>شريط بحث عن الوجهات
زر البحث<wink-search-button>فتح منتقي خط الرحلة
زر الحساب<wink-account-button>تسجيل الدخول / قائمة المستخدم
زر خط الرحلة<wink-itinerary-button>عرض خط الرحلة الحالي
منتقي خط الرحلة<wink-itinerary-picker>نموذج خط الرحلة الكامل
عربة التسوق<wink-shopping-cart-button>زر ملخص العربة

راجع مكونات الويب للمرجع الكامل للسمات.

قراءة إضافية

Section titled “قراءة إضافية”