How to Customize the Look and Feel of the Booking Engine
From hoteliga
Contents
Introduction
The changes of the look and feel of the booking engine can be done via the CSS language. A person with basic web development skills can easily follow these instructions.
The final CSS layout can be set in the Booking Engine => Appearance area where the CSS field is located.
General Elements
Search Page
Results Page
Area / Elements | Instructions | Example |
---|---|---|
Replace content with a “Terms” button | terms-conditions-content
terms-conditions-btn |
.terms-conditions-content{ display: none; } .terms-conditions-btn{ display: block; } |
Options Page
Area / Elements | Instructions | Example |
---|---|---|
Display Children Policy content on demand using a button | children-policy-txt
show-more-txt |
.children-policy-txt{ display: none; } .show-more-txt{ display: block; } |
Details Page
Area / Elements | Instructions | Example |
---|---|---|
Hide specific Card icons | visa-card-icon
master-card-icon amex-card-icon diners-card-icon discover-card-icon masterpass-card-icon paypal-card-icon |
.visa-card-icon{ display: none; } |
Hide all card icons | payment-method-icons | .payment-method-icons{ display: none; } |
Hide specific payment method description | cash pay-pal bank-deposit bank-full-amount two-checkout cash-checkin Eurobank veritrans alpha-bank cash-credit-card redsys pay-pal-pre bank-deposit-checkin
fideli-pay cash-credit-card-vault alpha-bank-master-pass moneris Sampath cash-credit-card-checkin-vault asia-pay |
.Cash{ display: none; } |
Hide all payment method descriptions | payment-method-description | .payment-method-description{ display: none; } |