Free and Premium WordPress Plugins & Themes Forums WordPress Plugins Hotel Booking Search Bar Appearing Vertically
- This topic has 10 replies, 6 voices, and was last updated 4 years, 11 months ago by
Mary Evans.
- AuthorPosts
- January 27, 2018 at 1:03 pm #635891
Heenaa Biswas
ParticipantHi, when I apply the shortcode [mphb_availability_search] to my homepage, the search bar appears vertically. How do I change this to appear horizontally?
Thanks,
HeenaaJanuary 31, 2018 at 3:26 pm #637666J. Davis
KeymasterHi Heenaa,
The styling of a form depends on your theme styling. Usually it is vertical to look properly on mobile devices. If you want to customize it and make its layout horizontal you should apply custom CSS code. We’ll review your request for adding some solution in future plugin updates.
Currently you can email us and we’ll take a look at your theme design to advice and assist you with it.Best regards,
JohnMarch 14, 2018 at 5:59 pm #656855Manfredo
ParticipantHello John,
i need also a horizontally search bar, like in your theme: https://hbdemo.getmotopress.com/villagio/
I use this theme: generatepress
Do you have an idea?
Thanks in advance,
best Regards,
Manfredo
March 16, 2018 at 5:17 pm #657995J. Davis
KeymasterHello Manfredo,
The styles of form depends on the theme design. In case you want to change something in theme layout you need to add custom styles to your theme. For example you can inspect form classes using browser Inspector tool and apply different CSS rules to position form horizontally.
We’ve also added your request to our features list to provide some solution in one of the next updates.
In case you need it urgently and need our assistance in customizing form layout you can order Extended Support offer and we’ll assist you with this.
best regards,
JohnBest regards,
JohnAugust 21, 2018 at 7:20 am #710561Heenaa Biswas
ParticipantHi, has there been any solution to this issue yet? I am using Generate Press theme and still having the same problem.
Also, I would like to customise the pages that get setup automatically with the plugin, like accommodation and search availability, how do I customise them to fit my theme? Also need to customise the way the calendar appears, is there a way to do all this without using a bunch of code?
I can provide login details if needed.
Many thanks.
HeenaaAugust 21, 2018 at 7:36 am #710562Heenaa Biswas
ParticipantHi, just a quick follow-up to my last question, I’ve found the code from a different thread to use in the custom css, however is there a way to further stylise the search bar? Also when I click in the date field it requires me to type in the date as opposed to a calendar showing up. What’s happening?
Honestly, I’m quite disappointed overall by this plugin, everyone seems to claim this is a very good hotel booking plugin but your styling and layout options almost seem non-existent unless used with particular themes and leave a lot to be desired. Even using the hotel booking integration for elementor doesn’t help matters any.
Very sad.August 22, 2018 at 5:23 am #710837J. Davis
KeymasterHello Heenaa,
Thank you for your comments and feedback. The design of hotel booking and its parts directly depend on your theme as it inherits your theme styles. Usually theme developers provides predefined styling for general input forms, buttons, etc and Hotel Booking plugin inherits it. However it looks like your theme does not have such styles and you need to add it with custom CSS. We have tested plugin with different free themes from wordpress . org and other premium templates and it looked nice.
Thus once you made your search form horizontal now your need to add more CSS attributes to adjust input, select, button elements.
As for calendar styles so there are available predefined style under Dashboard>Accommodation>Settings>(scroll down to find a calendar style selector)
We also provide personal style customization with Extended Support offer.
You can also take a look at our property rental templates built with Hotel Booking plugin and we’ll make an exception for you and let your pay the difference to get a theme with plugin. Then you will be able to use Hotel Booking plugin just with this theme.
Let me know if you have any further question.
best regards,
JohnJanuary 25, 2019 at 1:41 am #765315Marcel Heiniger
ParticipantHello to all complaining they are no horizontal search capacity
I’m glad happy that the developer of the plugin let the theme developer taking care about the visual and not enforcing some CSS.Here a simple custom CSS that transform the search to horizontal on screen
@media only screen and (min-width: 600px){ .mphb_sc_search-form{ display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-template-rows: 70px 10px; grid-template-areas: "checkin checkout guest kids searchbutton" "foother foother foother foother foother"; grid-column-gap: 5px; } .mphb_sc_search-check-in-date { grid-area: checkin; } .mphb-datepick{ } .mphb_sc_search-check-out-date{ grid-area: checkout; } .mphb_sc_search-adults { grid-area: guest; } .mphb_sc_search-children { grid-area: kids; } .mphb_sc_search-submit-button-wrapper { grid-area: searchbutton; margin-top: 25px;} .mphb-required-fields-tip { grid-area: foother; } }
January 30, 2019 at 1:44 pm #767272J. Davis
KeymasterThank you Marcel for shared CSS and for your feedback.
September 19, 2019 at 5:06 am #857906fernando albert
ParticipantHi, i put this css code and says that have 1 error and marks in red this part of the code: “checkin checkout guest kids searchbutton” “foother foother foother foother foother”, can you help me please? Im begging for horizontal widget!
October 10, 2019 at 8:35 am #867637Mary Evans
ParticipantHello, you may click “Update anyway” it should not break the site.
Best regards,
Mary Evans
MotoPress Support - AuthorPosts
- You must be logged in to reply to this topic.