[Resolved] Booking Form is not showing well in generatepress

[Joan]

Hello,

I’ve changed to GeneratePress a web this week, and I need help for showing Yith Booking for Woocommerce form now. The calendar picker and the person selector are not showing well, some content is hidden. I’ve tried with CSS but solved only part of the problem.

You can see an example here:
https://www.lamountain.es/product/hostal-vall-daneu/

I amb requesting help in plugin support too.

Thank you very much for your help.

[David]

Hi there,

i am seeing a jQuery error in your console related to this script:

https://d1nn1beycom2nr.cloudfront.net/news/scripts/form.script.js

You may want to resolve that issue first as one broken piece of JS may stop any other scripts from running, including those used by the booking form.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Joan]

Hi David.

Sorry, but I don’t know what to do with this information. How can I fix this jQuery error?

Thank you.

[David]

The request for the form.script.js is coming from the form you have in the Elmentor section at the foot of the page. You will need to contact the provider of that form script. This is the error:

TypeError: $ is not a function. (In '$(document)', '$' is undefined)

Wordpress doesn’t use the $ function by default. It needs to be jQuery

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Joan]

Hello David!

I’ve removed that section at the foot of the page and the error in the console disappears. So, I will request the provider of the subscribe form script to fix it.

Anyway, I’ve just received this CSS code from plugin support and the problem with the booking form is solved:

.woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {
    display: inline-block;
    width: 60%;
    box-sizing: border-box;
    padding-left: 50px;
    overflow: visible;
}

.woocommerce-product-gallery.woocommerce-product-gallery--with-images.images {
    display: inline-block!important;
    margin: 0;
}
 

Thank you very much

[David]

Glad to hear that!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts