ปรับแต่งวิดเจ็ตลอย

วิดเจ็ตของเว็บไซต์สามารถปรับแต่งได้บนเว็บไซต์ที่วางไว้ บทความนี้จะให้รหัส CSS บางส่วนที่อาจช่วยคุณได้เฉพาะกับวิดเจ็ตลอย

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับวิดเจ็ต PMS ของ Cloudbeds โปรดเยี่ยมชมบทความนี้: Cloudbeds เครื่องมือการจองวิดเจ็ตเว็บไซต์

รหัสเหล่านี้ให้เพื่ออ้างอิงและอาจไม่ทำงานกับเว็บไซต์ทั้งหมด อาจจำเป็นต้องปรับแต่งตามรหัสของเว็บไซต์ของคุณ โปรดปรึกษากับนักพัฒนาเว็บของคุณสำหรับความช่วยเหลือเพิ่มเติม โปรดทราบว่า Cloudbeds ไม่ให้การสนับสนุนสำหรับการพัฒนาเว็บไซต์ส่วนตัว

เปลี่ยนตำแหน่งของวิดเจ็ตไปที่ด้านล่าง

ตามค่าเริ่มต้น วิดเจ็ตลอยจะตั้งตำแหน่งที่ด้านบนของเว็บไซต์ของคุณ เพื่อย้ายไปที่ด้านล่างของเว็บไซต์ของคุณ ให้เพิ่มสไตล์เหล่านี้ระหว่างแท็ก <body> และ </body> (ในเว็บไซต์ของคุณ)

<style>
.CloudBedsWidget.floatWrapper {
padding-bottom: 0;
}
.CloudBedsWidget .float_bg2 {
position: fixed !important;
top:inherit;
bottom: 0;
border-bottom: none;
}
</style>

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

ปรับแต่งลักษณะของวิดเจตลอย

โดยการปรับแต่งรหัสนี้ คุณสามารถเปลี่ยนลักษณะของวิดเจตลอยได้ เพิ่ม CSS นี้ลงในรหัสต้นฉบับของเว็บไซต์ของคุณที่วิดเจตถูกวางไว้

<style>
.float_bg2 {
background: #fff;
width: 100%;
z-index: 50001;
left: 0;
top: 0;
display: block;
color: #fff;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: 600;
border: none;
border-bottom: 2px solid #fff;
box-shadow: 0 3px 5px #fff;
}
</style>

ด้วยรหัสนี้ คุณสามารถเปลี่ยนลักษณะของปุ่ม "ค้นหา" บนวิดเจตลอย

<style> 
.CloudBedsWidget .widgetHotelsForm input[type=submit],.CloudBedsWidget .widgetHotelsForm button[type=submit] {
border-radius: 0 !important;
background: #d2a917;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
font-weight: 600;
color: #fff;
padding: 4px;
min-width: 100px;
margin-top: -5px;
text-shadow: none;
white-space: normal;
cursor: pointer;
}
</style> 

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

 การเปลี่ยนจากเครื่องมือการจองเป็นเวอร์ชันใหม่! เครื่องมือการจอง Cloudbeds ได้ถูกสร้างใหม่ให้เป็นเวอร์ชันที่อัพเกรดเรียกว่า เครื่องมือจอง Cloudbeds Plus เราตอนนี้มีบริการปรับแต่งสำหรับเวอร์ชันใหม่นี้ คุณต้องการเรียนรู้เพิ่มเติมหรือไม่? กรุณาตรวจสอบบทความเหล่านี้:

บทความนี้มีประโยชน์หรือไม่
0 จาก 2 เห็นว่ามีประโยชน์

ข้อคิดเห็น

0 ข้อคิดเห็น

โปรด ลงชื่อเข้าใช้ เพื่อแสดงข้อคิดเห็น