Grids
تُمثل الشبكة قائمة بالموردين والمخزون، وتُظهر التفاصيل عبر واجهة مستخدم تفاعلية قابلة للحجز.
تدعم الشبكة عرض أي مخزون من قائمتك المُنسقة أو البحث المحفوظ.
يتفاعل المستخدم مع الشبكة بنفس الطريقة التي يتفاعل بها مع أي فرد.بطاقةمع ميزة إضافية واحدة:
- التنقل عبر الشبكة عن طريق النقر على
Show more
زر (عندما تتوفر المزيد من العناصر).
ما سبق هو مثال لشبكتنا التي تعرض قائمة ببطاقات أنواع الغرف.
يرشدك الجزء المتبقي من هذه المقالة إلى كيفية إنشاء الشبكة وتخصيصها وعرضها على المستخدمين.
أنواع الشبكات
Section titled “أنواع الشبكات”هناك ثلاثة أنواع من الشبكات:
- شبكة مبنية علىقائمة مختارة.
- شبكة مبنية علىالبحث المحفوظ.
- شبكة الشبكة بناءً على معايير الموقع والفرز (أي الشبكة المصنفة).
شبكة القائمة المنسقة
Section titled “شبكة القائمة المنسقة”هذه شبكة تستخدم المخزون الذي جمعته في إحدى قوائمك المنظمة وتحول القائمة إلى مخزون سفر قابل للحجز يمكنك عرضه على المستخدمين.
انتقل إلىInventory > Curated Lists
من شريط التنقل الرئيسي. في هذا المثال، سنستخدمFavorites
إذا لم تقم بإضافة أي شيء إلى قائمتك بعدFavorites
، اذهب إلىيبحثلتعلم كيف.
- انقر على
Actions
الزر الموجود علىFavorites
قائمة. - انقر على
Create a grid
زر. - ستظهر نافذة جديدة تسمح لك بتسمية الشبكة الخاصة بك. انظر أدناه.
- انقر
OK
زر للاستمرار.
تم إنشاء شبكتك. انتقل إلىTools > Grids
من شريط التنقل الرئيسي وانقر علىCurated Grids
انقر فوق علامة التبويب “عرض” لرؤية شبكتك الجديدة.
يتيح لك النموذج تخصيص شبكتك بالطرق التالية:
- أعطها اسمًا لتتذكر ما تدور حوله الشبكة.
- حدد التخصيص تريد تطبيق هذه الشبكة.
- حدد واجهة البطاقة الأولية التي تريد أن يراها المستخدمون أولاً. افتراضيًا، تكون هي الواجهة الأصلية لتلك القائمة.
- اختر الشارة التي تريد استخدامها على البطاقة. تتيح الشارة للمستخدمين مقارنة المخزون بناءً على مقياس إجمالي مثل
eco-friendly
. - أضف الكلمات الرئيسية، مفصولة بفاصلة، والتي سيتم استخدامها بواسطة برامج الزحف على الويب.
- أضف العناوين والأوصاف باللغات التي تريد أن يراها المستخدم.
- انقر على
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 كيفية تضمينأداة تحميل تطبيقات وينكمكون الويب وأخبره بجلب تفضيلات تكوين مستوى الصفحة الخاصة بك.
شبكة البحث المحفوظة
Section titled “شبكة البحث المحفوظة”هذه شبكة تستخدم المخزون الموجود في استعلام البحث المحفوظ لديك وتحول نتائج البحث إلى مخزون سفر قابل للحجز يمكنك عرضه على المستخدمين.
انتقل إلىInventory > Saved searches
من شريط التنقل الرئيسي.
إذا لم تُنشئ بحثًا محفوظًا بعد، فانتقل إلىيبحثلتعلم كيف.
- انقر على
Actions
الزر الموجود على بحثك المحفوظ. - انقر على
Create a grid
زر. - ستظهر نافذة جديدة تسمح لك بتسمية الشبكة الخاصة بك. انظر أدناه.
- انقر
OK
زر للاستمرار.
تم إنشاء شبكتك. انتقل إلىTools > Grids
من شريط التنقل الرئيسي وانقر علىSaved Search Grids
انقر فوق علامة التبويب “عرض” لرؤية شبكتك الجديدة.
يتيح لك النموذج تخصيص شبكتك بالطرق التالية:
- أعطها اسمًا لتتذكر ما تدور حوله الشبكة.
- حدد التخصيص تريد تطبيق هذه الشبكة.
- حدد واجهة البطاقة الأولية التي تريد أن يراها المستخدمون أولاً. افتراضيًا، تكون هي الواجهة الأصلية لتلك القائمة.
- اختر الشارة التي تريد استخدامها على البطاقة. تتيح الشارة للمستخدمين مقارنة المخزون بناءً على مقياس إجمالي مثل
eco-friendly
. - أضف الكلمات الرئيسية، مفصولة بفاصلة، والتي سيتم استخدامها بواسطة برامج الزحف على الويب.
- أضف العناوين والأوصاف باللغات التي تريد أن يراها المستخدم.
- انقر على
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 كيفية تضمينأداة تحميل تطبيقات وينكمكون الويب وأخبره بجلب تفضيلات تكوين مستوى الصفحة الخاصة بك.
الشبكة المصنفة
Section titled “الشبكة المصنفة”إنشاء شبكة مرتبة من خلال الانتقال إلىTools > Grids
وانقر علىRanked Grid
علامة التبويب. انقر فوقCreate ranked grid
زر.
يتيح لك النموذج تخصيص شبكة التصنيف الخاصة بك بالطرق التالية:
- اختر وجهة. على سبيل المثال طوكيو.
- أعطها اسمًا لتتذكر ما تدور حوله الشبكة. على سبيل المثال، الفنادق الصديقة للبيئة في طوكيو
- حدد التخصيص تريد تطبيق هذه الشبكة.
- حدد واجهة البطاقة الأولية التي تريد أن يراها المستخدمون أولاً. افتراضيًا، تكون هي الواجهة الأصلية لتلك القائمة.
- اختر الخاصية التي تريد فرز الخصائص حسبها. على سبيل المثال، الصديقة للبيئة.
- أضف الكلمات الرئيسية، مفصولة بفاصلة، والتي سيتم استخدامها بواسطة برامج الزحف على الويب.
- أضف العناوين والأوصاف باللغات التي تريد أن يراها المستخدم.
- انقر على
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 كيفية تضمينأداة تحميل تطبيقات وينكمكون الويب وأخبره بجلب تفضيلات تكوين مستوى الصفحة الخاصة بك.
واجهة برمجة التطبيقات
Section titled “واجهة برمجة التطبيقات”يمكن للمطورين الذين يرغبون في إدارة الشبكات التوجه إلىالمطورون > واجهة برمجة التطبيقات > المخزون.
قراءة إضافية
Section titled “قراءة إضافية”- تعرف على المزيد حول مجموعتنامكونات الويب.
- تعرف على المزيد حولإضافة Wink WordPress.