Bootstrap 4 is interfering with the site

This thread is resolved. Here is a description of the problem and solution.

Problem:

I created a View and set Toolset to load Bootstrap 4. This works just fine for the View, however I noticed my WooCommerce checkout page is totally messed up.

Solution:

It is a conflict between Woocommerce and Bootstrap 4, see similar woocommerce ticket:

https://github.com/woocommerce/woocommerce/issues/15793

You can consider those workarounds in above ticket.

Relevant Documentation:

This support ticket is created 5 years, 1 month ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun	Mon	Tue	Wed	Thu	Fri	Sat
-	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	-
-	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	-

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

Tagged: Views, Views plugin

This topic contains 2 replies, has 2 voices.

Last updated by richardG-4 5 years, 1 month ago.

Assisted by: Luo Yang.

Author

Posts

November 14, 2019 at 5:49 am #1382745

richardG-4

I created a View and set Toolset to load Bootstrap 4. This works just fine for the View, however I noticed my WooCommerce checkout page is totally messed up: hidden link

Here is a screenshot on OceanWP: hidden link
Here is a screenshot on GeneratePress: hidden link

If I change it to disable Toolset loading Bootstrap, such as "The theme or another plugin is already loading Bootstrap 4," then the checkout page works perfectly. However, my View, of course, stops working.

Do I need to undo all of the CSS changes to Bootstrap on the checkout page? Can I have Toolset load Bootstrap only on the View pages? Or is there another solution?

November 14, 2019 at 7:34 am #1382797

Luo Yang

Hello,

Thanks for the details, I can log into your website and see the problem.
It is a conflict between Woocommerce and Bootstrap 4, see similar woocommerce ticket:
hidden link

You can consider those workarounds in above ticket.

November 14, 2019 at 7:43 am #1382803

richardG-4

I see, so it's an issue with WooCommerce, not with Toolset loading Bootstrap 4. I was so stumped on this one. For now I changed to Bootstrap 3, that is loading correctly for both elements.

I'll take it up with WooCommerce, hopefully they start supporting Bootstrap 4 before Bootstrap 3 becomes obsolete.

Thanks!