Cards

การ์ดแสดงซัพพลายเออร์รายเดียว (เช่น โรงแรมหรือผู้ให้บริการประสบการณ์) หรือสินค้าคงคลัง (เช่น ประเภทห้อง ห้องประชุม สปา เป็นต้น) และแสดงรายละเอียดผ่าน UI การ์ดแบบโต้ตอบที่สามารถจองได้ ผู้ใช้สามารถโต้ตอบกับการ์ดได้ในลักษณะต่อไปนี้:

คลิกที่Book ปุ่ม.
คลิกที่Galleryลิงก์สำหรับดูรูปภาพและวิดีโอทั้งหมดของสินค้าคงคลังนี้
คลิกBest dealลิงก์หากมีเพื่อดูห้องราคาที่ดีที่สุด
คลิกHotel detailsลิงก์หากมีเพื่อดูข้อมูลทรัพย์สิน

บัตรรองรับหลายหน้าเพื่อลดขนาดของบัตรและจัดหมวดหมู่ข้อมูล ทำให้ผู้ใช้สามารถใช้งานได้ง่ายขึ้น และช่วยเพิ่มโอกาสในการแปลงผู้ใช้เป็นการจอง

ไพ่มีสองหรือสามหน้า:

บัตรโรงแรมจะแสดงข้อมูลโรงแรมอยู่ด้านหน้าและประเภทห้องที่ดีที่สุดอยู่ด้านหลัง ส่วนราคาจะแสดงราคาที่ดีที่สุดสำหรับโรงแรมทั้งสองด้าน
บัตรประเภทห้องจะแสดงข้อมูลประเภทห้องไว้ด้านหน้าและข้อมูลโรงแรมไว้ด้านหลัง ราคาจะแสดงราคาของประเภทห้องไว้ด้านหน้าและราคาที่ดีที่สุดของโรงแรมไว้ด้านหลัง
การ์ดอื่นๆ ทั้งหมด (เช่น ร้านอาหารสปา เป็นต้น) มี 3 หน้า ตัวอย่างเช่น ข้อมูลสปาจะแสดงบนหน้าแรกพร้อมราคาที่ดีที่สุดของสปา ข้อมูลประเภทห้องสำหรับห้องที่มีราคาดีที่สุดจะอยู่ด้านที่สอง ข้อมูลทรัพย์สินพร้อมกับห้องที่มีราคาดีที่สุดจะอยู่ด้านที่สามของการ์ด

การดูตัวอย่างการ์ด — *บัตรห้องพักแบบหันหน้าไปทางด้านหน้าพร้อมห้องว่าง*

ด้านบนคือตัวอย่างบัตรประเภทห้องของเรา ซึ่งประกอบด้วยข้อมูลที่พัก รีวิว และห้องพัก รวมถึงนโยบายการยกเลิกและมื้ออาหาร

บทความที่เหลือนี้จะแนะนำวิธีการสร้าง ปรับแต่ง และเปิดเผยการ์ดแก่ผู้ใช้ของคุณ

สร้างการ์ด

ด้านบนเป็นภาพที่นำมาจากค้นหาและแสดงให้คุณเห็นบางสิ่งที่คุณสามารถทำได้กับผลการค้นหาของคุณ หนึ่งในการดำเนินการเหล่านั้นคือMake a card. คลิกที่ปุ่มนั้นแล้วมันจะพาคุณไปที่หน้าแบบฟอร์มบัตรซึ่งคุณสามารถเริ่มปรับแต่งบัตรของคุณได้

ปรับแต่งการ์ด

แบบฟอร์มนี้ช่วยให้คุณสามารถปรับแต่งบัตรของคุณได้ดังต่อไปนี้:

ตั้งชื่อให้เพื่อจะได้จำได้ว่าการ์ดนี้เกี่ยวกับอะไร
เลือก การปรับแต่ง คุณต้องการสมัครบัตรนี้
เลือกหน้าการ์ดเริ่มต้นที่คุณต้องการให้ผู้ใช้เห็นก่อน โดยค่าเริ่มต้น หน้าการ์ดจะเป็นหน้าดั้งเดิมของสินค้าคงคลังนั้น
เลือก badge ที่คุณต้องการใช้บนการ์ด ป้ายช่วยให้ผู้ใช้สามารถเปรียบเทียบสินค้าคงคลังในเมตริกรวม เช่น eco-friendly-
เพิ่มคำหลักคั่นด้วยเครื่องหมายจุลภาคที่จะใช้โดย โปรแกรมรวบรวมข้อมูลเว็บ-
เพิ่มชื่อเรื่องและคำอธิบายในภาษาที่คุณต้องการให้ผู้ใช้เห็น
เลือกรูปภาพหนึ่งรูปหรือมากกว่าที่จะแสดงเมื่อผู้ใช้คลิก Gallery ลิงค์
คลิกที่ Save ปุ่มเพื่อดำเนินการต่อ

หลังจากบันทึกบัตรของคุณแล้ว คุณจะถูกส่งต่อไปยังหน้าบัตรของคุณ และตอนนี้บัตรของคุณก็พร้อมที่จะแชร์กับคนทั่วโลกแล้ว

การ์ดแบ่งปัน

ด้านบนแสดงภาพพร้อมการดำเนินการทั้งหมดที่มีสำหรับการ์ดของคุณ:

อัปเดตอัพเดตการกำหนดค่าการ์ดของคุณ
เพิ่มไปยัง 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 จะแสดงวิธีใช้ตัวโหลดเนื้อหากระพริบตาเว็บคอมโพเนนต์และบอกให้ดึงบัตรห้องพักสำหรับรหัสของคุณ
บรรทัดที่ 11 จะแสดงวิธีการฝัง Javascript ของเราลงในไซต์ของคุณ
บรรทัดที่ 13 แสดงวิธีการฝังโหลดแอพวิงค์ส่วนประกอบเว็บและบอกให้ดึงค่ากำหนดการกำหนดค่าระดับหน้าของคุณ

เอพีไอ

นักพัฒนาที่ต้องการจัดการบัตรสามารถไปที่นักพัฒนา > API > สินค้าคงคลัง-

อ่านเพิ่มเติม

เรียนรู้เพิ่มเติมเกี่ยวกับคอลเลกชันของเราส่วนประกอบของเว็บไซต์-
เรียนรู้เพิ่มเติมเกี่ยวกับปลั๊กอิน Wink WordPress-