WPML Bug – JS Errors when using shortcodes with Accommodation ID

[Ryan Labelle]

I found an issue that is preventing the use of shortcodes on translated pages within WPML. It works for pages that do not require Accommodation ID parameter but not when it is used.

Example:
[mphb_availability_calendar id=21]
works well on a page using the default language, but crashes when used on a translated page.

I setup a sample site that you can access:

https://bluehost.themovation.com/

Homepage uses shortcode [mphb_availability_calendar id=21], as you can see from the calendar displayed. However, it’s missing on the translated page (French) https://bluehost.themovation.com/?lang=fr

Not only is it missing from the translated page, but it produces a JS error.

mphb.min.js?ver=3.7.2:1 Uncaught TypeError: this.roomTypeData.fillDateData is not a function.

Site specs:

• WP 5.3.2
• Hotel Booking 3.7.2
• WPML Multilingual CMS 4.3.6
• WPML String Translation 3.0.6
• WPML Translation Management 2.9.4
• Default Twenty Twenty Theme

If you need access to the site, please let me know. I set this up so you can access and debug.

Please let me know if you would like me to create a ticket.

kind regards,
Ryan

• This topic was modified 4 years, 10 months ago by Ryan Labelle.

[Steve]

Try to change the ID in shortcode on the translated page (French) from 21 to 33.
[mphb_availability_calendar id=33]
Let me know if it helps.

[Ryan Labelle]

Thanks. This works.

One thing to mention for others searching for a solution is that when using the WPML Translation Editor which looks like this:

The shortcode might not show up for translation (switching the ID in the shortcode) as Steve recommends. It did not show up for me the first time because I was using a Gutenberg Shortcode Block. I guess they don’t automatically provide translation for that block type. To resolve, I used a paragraph block and put the shortcode in there, that allowed the shortcode to be translated for the other languages.

If you don’t use the WPML translation editor (IE: You’ve duplicated your pages via WPML), then you should have access to the shortcode to translate already.

Also, ID 33 is just the ID of the translated Accommodation Type. 🙂

Thanks. Resolved. I hope this helps others.

[Mary Evans]

Hi Ryan,

Thank you for sharing your experience. Here is also an article on how to translate Hotel Booking with WPML that might be useful, in order to make sure you`ve translated everything appropriately.

Best Regards,
M. Evans

[Author]

Posts