Influential Lite uses a very limited version of Bootstrap without all the added elements like buttons, progress bars, tabs, accordions, etc. This theme only uses the grid layout to achieve the responsive column structure that this theme is built on. This also comes in handy if you want to use “columns” in your pages, posts, or even a text widget.
Using the Plugin Method
There are several Bootstrap plugins that includes “everything” Bootstrap offers while other plugins offer you select sets of elements like buttons, the grid layout columns, tabs, progress bars, etc. If you decide to use one of these plugins, you will want to disable the built-in Bootstrap grid styling for this theme because it already includes version 4 of Boostrap’s own grid layout.
To Disable the theme’s Bootstrap
- Go to Appearance >> Customize >> Site Options
- Look for the “Load Bootstrap CSS” setting and uncheck the box next to it.
- Click “Save & Publish“
If all goes well, the plugin should take over the column structure using it’s own Bootstrap code.
WARNING If you find your site’s layout is all over the place, disable the plugin and go back and “check” the box next to “Load Bootstrap CSS“.
Manually Adding Columns
If you want to insert columns into your content, this quick little tutorial will help you do that, but be careful when adding content into the column structure because the WordPress editor is notorious for removing html code if you edit your content. But generally if you want to use this, I recommend working in the Text (HTML) tab of the editor for this part.
For columns, start with an outer container with a class of “row” and then your columns are using col classes. For example, lets make a 2 column layout:
<div class="row">
<div class="col-md-6">
your 1st column content here
</div>
<div class="col-md-6">
your snd column content here
</div>
</div>
To learn more about Bootstrap grid columns, check out their documentation
Grid System