Skip Navigation

[Resolved] Bootstrap Tweaks

This support ticket is created 6 years, 4 months 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.

Our next available supporter will start replying to tickets in about 4.82 hours from now. Thank you for your understanding.

Sun Mon Tue Wed Thu Fri Sat
- - 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00
- - - - - - -

Supporter timezone: Asia/Ho_Chi_Minh (GMT+07:00)

This topic contains 3 replies, has 2 voices.

Last updated by Beda 6 years, 4 months ago.

Assisted by: Beda.

Author
Posts
#924445

Tell us what you are trying to do? Tweak the bootstrap styling of the filters (e.g. drop down menus and checkboxes) in the Search and Pagination section of a View.
Is there any documentation that you are following? No
Is there a similar example that we can see? No
What is the link to your site? hidden link

I noticed superior styling on the filtering elements in the Search and Pagination section when I had the Let Toolset Load Bootstrap 3.0 setting chosen. Obviously, these are being styled automatically with Bootstrap. Is there a way to tweak the styling on those drop down menus (select) and checkboxes? Primarily I want to reduce line-spacing (the space between the lines in the filters (especially the spaced between checkboxes, which seems a bit excessive to me). THANKS!

#924626
CSS.png

You can apply some CSS.
See my screenshot how to find the classes or ID's to target.
Sometimes, you will maybe need an !important but that will be very rare.

#924688

Excellent. But I'm still having trouble targeting the LABEL in the each form-group. What's the CSS code to target all the bootstrap labels (primarily I want to reduce the spacing (bottom-margin) below each label)? I can't seem to modify it. Thanks!
Here's an example page: hidden link

#924985

Toolset does not provide or Support Styling and JS logic Support, this is something that you need to master in order to fully take advantage of it.

I suggest to consult the online repos here:
hidden link
They are very useful on CSS, JS and HTML questions, which we cannot fully assist in the forum as those are required knowledges to use Toolset.

It seems you could profit from a customized Bootstrap Version.
hidden link

This tool allows you to create your own, particular version of Bootstrap pretty quickly.
Then, you would need to enqueue that in your Theme:
hidden link

After, you would deselect the Bootstrap loaded by Toolset in Toolset > Settings and instead choose that the Theme loads it.
Then you need to make sure all your changes applied work nicely (I would not go and mess with Bootstrap Rows and Columns rules for example, but Labels, spacings and such should not be an issue).

Then you can enjoy your own version of it that needs no tweaks at all 🙂