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

Grids

تُمثل الشبكة قائمة بالموردين والمخزون، وتُظهر التفاصيل عبر واجهة مستخدم تفاعلية قابلة للحجز.

تدعم الشبكة عرض أي مخزون من قائمتك المُنسقة أو البحث المحفوظ.

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

  1. التنقل عبر الشبكة عن طريق النقر علىShow more زر (عندما تتوفر المزيد من العناصر).
معاينة الشبكة
شبكة تُظهر أنواع الغرف المتعددة

ما سبق هو مثال لشبكتنا التي تعرض قائمة ببطاقات أنواع الغرف.

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

هناك ثلاثة أنواع من الشبكات:

  1. شبكة مبنية علىقائمة مختارة.
  2. شبكة مبنية علىالبحث المحفوظ.
  3. شبكة الشبكة بناءً على معايير الموقع والفرز (أي الشبكة المصنفة).

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

انتقل إلىInventory > Curated Listsمن شريط التنقل الرئيسي. في هذا المثال، سنستخدمFavoritesإذا لم تقم بإضافة أي شيء إلى قائمتك بعدFavorites، اذهب إلىيبحثلتعلم كيف.

إنشاء شبكة قائمة منسقة
إنشاء نموذج شبكة قائمة مُنسقة
  1. انقر على Actions الزر الموجود على Favorites قائمة.
  2. انقر على Create a grid زر.
  3. ستظهر نافذة جديدة تسمح لك بتسمية الشبكة الخاصة بك. انظر أدناه.
  4. انقر OK زر للاستمرار.

تم إنشاء شبكتك. انتقل إلىTools > Gridsمن شريط التنقل الرئيسي وانقر علىCurated Gridsانقر فوق علامة التبويب “عرض” لرؤية شبكتك الجديدة.

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

  1. أعطها اسمًا لتتذكر ما تدور حوله الشبكة.
  2. حدد التخصيص تريد تطبيق هذه الشبكة.
  3. حدد واجهة البطاقة الأولية التي تريد أن يراها المستخدمون أولاً. افتراضيًا، تكون هي الواجهة الأصلية لتلك القائمة.
  4. اختر الشارة التي تريد استخدامها على البطاقة. تتيح الشارة للمستخدمين مقارنة المخزون بناءً على مقياس إجمالي مثل eco-friendly.
  5. أضف الكلمات الرئيسية، مفصولة بفاصلة، والتي سيتم استخدامها بواسطة برامج الزحف على الويب.
  6. أضف العناوين والأوصاف باللغات التي تريد أن يراها المستخدم.
  7. انقر على Save زر للاستمرار.
شبكة القائمة المنسقة
إدخال شبكة قائمة مُنسقة مع قائمة إجراءات مُنهارة

يظهر لك أعلاه صورة تحتوي على جميع الإجراءات المتاحة لشبكتك:

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

سنتناول بعض هذه الخيارات بمزيد من التفصيل أدناه.

<html>
<head>
<link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
</head>
<body>
<wink-content-loader
layout="LIST"
id="9a212b5e-62a7-11ef-ac3f-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 كيفية استخداممُحمّل محتوى الوينكمكون الويب وطلب منه جلب شبكة للكود الخاص بك.
  • يوضح لك السطر 11 كيفية تضمين Javascript الخاص بنا في موقعك.
  • يوضح لك السطر 13 كيفية تضمينأداة تحميل تطبيقات وينكمكون الويب وأخبره بجلب تفضيلات تكوين مستوى الصفحة الخاصة بك.

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

انتقل إلىInventory > Saved searchesمن شريط التنقل الرئيسي. إذا لم تُنشئ بحثًا محفوظًا بعد، فانتقل إلىيبحثلتعلم كيف.

إنشاء شبكة بحث محفوظة
إنشاء نموذج شبكة البحث المحفوظة
  1. انقر على Actions الزر الموجود على بحثك المحفوظ.
  2. انقر على Create a grid زر.
  3. ستظهر نافذة جديدة تسمح لك بتسمية الشبكة الخاصة بك. انظر أدناه.
  1. انقرOKزر للاستمرار.

تم إنشاء شبكتك. انتقل إلىTools > Gridsمن شريط التنقل الرئيسي وانقر علىSaved Search Gridsانقر فوق علامة التبويب “عرض” لرؤية شبكتك الجديدة.

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

  1. أعطها اسمًا لتتذكر ما تدور حوله الشبكة.
  2. حدد التخصيص تريد تطبيق هذه الشبكة.
  3. حدد واجهة البطاقة الأولية التي تريد أن يراها المستخدمون أولاً. افتراضيًا، تكون هي الواجهة الأصلية لتلك القائمة.
  4. اختر الشارة التي تريد استخدامها على البطاقة. تتيح الشارة للمستخدمين مقارنة المخزون بناءً على مقياس إجمالي مثل eco-friendly.
  5. أضف الكلمات الرئيسية، مفصولة بفاصلة، والتي سيتم استخدامها بواسطة برامج الزحف على الويب.
  6. أضف العناوين والأوصاف باللغات التي تريد أن يراها المستخدم.
  7. انقر على Save زر للاستمرار.
شبكة البحث المحفوظة
إدخال شبكة البحث المحفوظة مع قائمة الإجراءات المنهارة
<html>
<head>
<link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
</head>
<body>
<wink-content-loader
layout="LIST"
id="be3130d5-62a7-11ef-ac3f-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 كيفية استخداممُحمّل محتوى الوينكمكون الويب وطلب منه جلب شبكة للكود الخاص بك.
  • يوضح لك السطر 11 كيفية تضمين Javascript الخاص بنا في موقعك.
  • يوضح لك السطر 13 كيفية تضمينأداة تحميل تطبيقات وينكمكون الويب وأخبره بجلب تفضيلات تكوين مستوى الصفحة الخاصة بك.

إنشاء شبكة مرتبة من خلال الانتقال إلىTools > Gridsوانقر علىRanked Gridعلامة التبويب. انقر فوقCreate ranked grid زر.

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

  1. اختر وجهة. على سبيل المثال طوكيو.
  2. أعطها اسمًا لتتذكر ما تدور حوله الشبكة. على سبيل المثال، الفنادق الصديقة للبيئة في طوكيو
  3. حدد التخصيص تريد تطبيق هذه الشبكة.
  4. حدد واجهة البطاقة الأولية التي تريد أن يراها المستخدمون أولاً. افتراضيًا، تكون هي الواجهة الأصلية لتلك القائمة.
  5. اختر الخاصية التي تريد فرز الخصائص حسبها. على سبيل المثال، الصديقة للبيئة.
  6. أضف الكلمات الرئيسية، مفصولة بفاصلة، والتي سيتم استخدامها بواسطة برامج الزحف على الويب.
  7. أضف العناوين والأوصاف باللغات التي تريد أن يراها المستخدم.
  8. انقر على Save زر للاستمرار.

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

الشبكة المصنفة
شبكة مرتبة مع قائمة إجراءات منقوصة

يظهر لك أعلاه صورة تحتوي على جميع الإجراءات المتاحة لشبكة rankd الخاصة بك:

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

سنتناول بعض هذه الخيارات بمزيد من التفصيل أدناه.

<html>
<head>
<link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
</head>
<body>
<wink-content-loader
layout="RANKED"
id="2483d55e-62a5-11ef-ac3f-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 كيفية استخداممُحمّل محتوى الوينكمكون الويب وطلب منه جلب شبكة مرتبة لكودك.
  • يوضح لك السطر 11 كيفية تضمين Javascript الخاص بنا في موقعك.
  • يوضح لك السطر 13 كيفية تضمينأداة تحميل تطبيقات وينكمكون الويب وأخبره بجلب تفضيلات تكوين مستوى الصفحة الخاصة بك.

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