البطاقات

تمثل البطاقة موردًا واحدًا (مثل فندق أو مزود تجربة) أو مخزونًا (أي نوع الغرفة، غرفة الاجتماعات، السبا، إلخ) وتعرض التفاصيل من خلال واجهة بطاقة تفاعلية قابلة للحجز. يمكن للمستخدم التفاعل مع البطاقة بالطرق التالية:

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

تدعم البطاقة عدة وجوه لتقليل حجم البطاقة وتصنيف البيانات؛ مما يجعلها سهلة الاستهلاك من قبل المستخدم ويمنحك فرصة أكبر لتحويل المستخدم إلى حجز.

تحتوي البطاقة على وجهين أو ثلاثة وجوه:

تعرض بطاقة الفندق بيانات العقار على الوجه الأمامي وأفضل نوع غرفة على الوجه الخلفي. يعرض السعر، على كلا الجانبين، أفضل سعر للفندق.
تعرض بطاقة نوع الغرفة بيانات نوع الغرفة على الوجه الأمامي وبيانات العقار على الوجه الخلفي. يعرض السعر سعر نوع الغرفة على الوجه الأمامي وأفضل سعر للفندق على الوجه الخلفي.
جميع البطاقات الأخرى (مثل السبا، المطعم، إلخ) تحتوي على 3 وجوه. مثال: تعرض بيانات السبا على الصفحة الأمامية مع أفضل سعر للسبا. بيانات نوع الغرفة لأفضل غرفة سعرًا على الوجه الثاني. بيانات العقار مع أفضل غرفة سعرًا على الوجه الثالث للبطاقة.

معاينة البطاقة — *بطاقة نوع غرفة تواجه الأمام مع التوفر*

أعلاه مثال على بطاقة نوع الغرفة لدينا. تحتوي على بيانات العقار، التقييم، والبيانات الخاصة بالغرفة بالإضافة إلى سياسة الإلغاء والوجبات.

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

إنشاء بطاقة

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

تخصيص البطاقة

يتيح لك النموذج تخصيص بطاقتك بالطرق التالية:

أعطها اسمًا لتتذكر ما تدور حوله البطاقة.
اختر التخصيص الذي تريد تطبيقه على هذه البطاقة.
اختر وجه البطاقة الأولي الذي تريد أن يراه المستخدمون أولاً. بشكل افتراضي، هو الوجه الأصلي لذلك المخزون.
اختر شارة التي تريد استخدامها على البطاقة. تتيح الشارة للمستخدمين مقارنة المخزون بناءً على مقياس مجمع مثل صديق للبيئة.
أضف كلمات مفتاحية، مفصولة بفواصل، ستُستخدم بواسطة زواحف الويب.
أضف عناوين وأوصافًا باللغات التي تريد أن يراها المستخدم.
اختر صورة واحدة أو أكثر ستظهر عندما ينقر المستخدمون على رابط المعرض.
انقر على زر حفظ للمتابعة.

بعد حفظ بطاقتك، سيتم توجيهك إلى صفحة بطاقاتك وأصبحت بطاقتك جاهزة للمشاركة مع العالم.

مشاركة البطاقة

الصورة أعلاه تعرض لك جميع الإجراءات المتاحة لبطاقتك:

تحديث تحديث تكوين بطاقتك.
إضافة إلى WinkLinks يضيف البطاقة إلى حساب WinkLinks الخاص بك.
تضمين يوضح لك كيفية تضمين هذه البطاقة كـ بطاقة في موقعك.
الاستخدام مع WordPress يوضح لك كيفية استخدام إضافة WordPress الخاصة بنا لتضمين هذه البطاقة في موقعك.

نغطي بعض هذه الخيارات، بمزيد من التفصيل، أدناه.

التضمين

<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="GUEST_ROOM"
       id="2de7ee9c-61c9-11ef-9722-42004e494300"
    ></wink-content-loader>

    <script src="https://elements.wink.travel/elements.js" type="module" defer></script>

    <wink-app-loader
      client-id="YOUR CLIENT ID GOES HERE"
      configuration-id="YOUR CUSTOMIZATION ID GOES HERE"
    ></wink-app-loader>
  </body>
</html>

إليك كيفية تضمين بطاقتك في موقعك:

السطر 3 يوضح لك كيفية تضمين أنماط Wink في موقعك.
الأسطر من 6 إلى 9 توضح لك كيفية استخدام مكون الويب wink-content-loader وإخباره بجلب بطاقة غرفة ضيوف لرمزك.
السطر 11 يوضح لك كيفية تضمين جافا سكريبت الخاص بنا في موقعك.
السطر 13 يوضح لك كيفية تضمين مكون الويب wink-app-loader وإخباره بجلب تفضيلات التكوين على مستوى الصفحة.

API

يمكن للمطورين الذين يرغبون في إدارة البطاقات التوجه إلى المطورون > API > المخزون.

قراءة إضافية

تعرّف أكثر على مجموعتنا من مكونات الويب.
تعرّف أكثر على إضافة WordPress الخاصة بـ Wink.