To add a new message section under the “Order Summary” and “Promo Code” section on the checkout page. This message will provide a contact number for customers to call in case they face any issues during checkout. The message will always be displayed.
Solution:
- Added a new help message section under
<section id="wizard-step-content-right"></section>to provide contact support information. - Frontend HTML Update:
- Introduced a new
<div>within the<section id="wizard-step-content-right"></section>to display a static help message: "Need help placing an order? Call us now at 1-800-508-4735."- Styling:
- Added a CSS class
.help-messageto style the message consistently with the rest of the page. - Key styles include:
- Background color: Light grey for visibility.
- Padding and borders: To ensure visual separation and alignment with the design.
- Sticky positioning: Keeps the message visible at the bottom of the section while scrolling.