Home › Forums › Pro Themes › Travel Base Pro › travel base pro problems on checkout page
Tagged: travel base pro
- This topic has 5 replies, 2 voices, and was last updated 2 years, 6 months ago by sanam.
-
AuthorPosts
-
February 14, 2022 at 5:27 am #178773JadeParticipant
Greetings:
travel base pro is producing problems on the checkout page of the wp travel plugin. this theme and plugin are sold as compatible by both the theme creators (your team) and the plugin authors, so I definitely want to have this addressed ASAP.
the wp travel plugin authors reviewed the issue and instructed me to reach out to your support team, sharing the theme is causing the issue.problem: on the checkout page on mobile devices, the customer input area and the trip confirmation are side by side. this is wider than the viewport width of a mobile device so the page breaks.
the theme has not received an update in an extended period of time discouraging license renewal.
please advise.
February 14, 2022 at 6:15 am #178775sanamKeymasterHello @SANOOKTIEW, Please add this CSS in the Additional CSS
.page .order-wrapper {
padding: 10px;
}
.page .order-wrapper table {
display: inline-table;
}
@media (max-width: 991px) {
.page .checkout-page-wrap {
grid-template-columns: 100% !important;
}
}Go to Customizer >> Appearance >> Additional Css, paste the above CSS there, and published the site.
Regards,
ThemepalaceApril 28, 2022 at 3:26 am #181526JadeParticipantAppreciate this fix, which I employed when you shared it. I discovered though that this places the checkout review box below the checkout process itself, which is an illogical ordering. Meaning, a customer would only encounter this checkout review area if they scrolled past the checkout input and submit fields.
Please advise.
Kind regards,
SakunaApril 28, 2022 at 4:48 am #181528sanamKeymastercould you please tell us where do you want to display the checkout review box?
May 3, 2022 at 3:21 am #181638JadeParticipantHi Support:
Appreciate the follow up. Checkout review box typically displays before the final checkout process. Your solution above fixed the broken layout; thank you for this. Only issue is that it places the checkout review box below the submit button at the bottom of the checkout page rather than at the top of the page.
Can we set this to display before the final checkout phase?
Kind regards,
SakunaMay 3, 2022 at 5:48 am #181647sanamKeymasterHello, Sakuna
Please add this CSS
.checkout-page-wrap > div {
grid-area: 2/1;
}
.checkout-page-wrap .wp-travel-checkout-section {
grid-area: 3/1;
}
@media screen (min-width:1024px) {
.checkout-page-wrap > div {
grid-area: unset;
}
.checkout-page-wrap .wp-travel-checkout-section {
grid-area: unset;
}
} -
AuthorPosts
- You must be logged in to reply to this topic.