Taxonomy page picks up bootstrap 4 .tag class in the body

I have installed roots/sage v8.5.0 on Wordpress v4.7 and I’m using PHP 7.0.

I was tinkering around with a new base template that and noticed that the page for taxonomy gives a different design/layout.

After looking around, I noticed that the page layout is getting styles from the tag components in Bootstrap 4 _tags.scss. Since the taxonomy page adds the .tag class to the body, it messes things up. What would be a recommended way to solve this?

This isn’t related to Roots, but you may want to consider using the body_class filter along with some conditional checks to solve the name conflict (perhaps replace tag with tax-tag or something similar).

You could also edit your bower config to exclude Bootstrap’s _tag.scss.

This WordPress body class convention goes back quite a while, so a name collision like this could be a bit haphazard, so you may also want to file an issue or pull request with Bootstrap.

2 Likes

Thanks for the reply! Yeah I just thought to check what you folks thought would be the best solution. I found that there’s already an issue reported and PR regarding this and it’s solved by being renamed to .badge in alpha v6:

1 Like