Akhtarujjaman Shuvo

Simple Plugin for Enqueue Bootstrap 4 CSS, JS, and Some Helpful WordPress Shortcodes for visual usages.
<h3>ShortCode List</h3>
Container Fluid
<pre>[containerfluid] contents [/containerfluid]</pre>
Container
<pre>[container] contents [/container]</pre>
Row
<pre>[row] contents [/row]</pre>
Equal Columns
<pre>[col] contents [/col]</pre>
Colunm for Extra small Devices – screen width: <576px
<pre>[col num="12"] contents [/col]</pre>

Colunm for small Devices – screen width: >=576px
<pre>[col sm="12"] contents [/col]</pre>
Colunm for Medium Devices – screen width: >=768px
<pre>[col md="12"] contents [/col]</pre>
Colunm for Large Devices – screen width: ≥992px
<pre>[col lg="12"] contents [/col]</pre>
Colunm for Extra Large Devices – screen width: ≥1200px
<pre>[col xl="12"] contents [/col]</pre>
Colunm for Multi Devices
<pre>[col sm="3" md="6" xl="12"] contents [/col]</pre>
Button Group
<h4>Parameters:</h4>
<ul>
<li>class=”” ( add extra class with ‘btn-group’ )</li>
</ul>
<pre>[btngroup]
 [button tag='button' href="#" type="button" style='primary']Button 1[/button]
 [button tag='button' href="#" type="button" style='primary']Button 2[/button]
[/btngroup]</pre>
Buttons
<h4>Parameters:</h4>
<ul>
<li>tag=”button” ( button | a | input )</li>
<li>href=”#” ( any link you want to set. NB: tag should be ‘a’ )</li>
<li>type=”button” ( button | submit | etc. )</li>
<li>style=”primary” ( primary | secondary | success | info | warning | danger | dark | light | link ) <a href="https://www.w3schools.com/bootstrap4/bootstrap_buttons.asp" rel="nofollow ugc">See Button Ref</a></li>
</ul>
<pre>[button tag="button" href="#" type="button" style="primary"]Click Me[/button]</pre>
Card
<h4>Parameters:</h4>
<ul>
<li>class=”” ( add extra class with ‘card’ )</li>
</ul>
<pre>[card class="mycard"]
 [cardtitle]
 This is title.
 [/cardtitle]

 [cardbody]
 This is card body really cool?
 [/cardbody]
[/card]</pre>
Accordion
<h4>Parameters:</h4>
<ul>
<li>id=”” ( required: a unique id for working correctely )</li>
<li>class=”some-class” ( optional: if you need to add custom class for styling )</li>
<li>title=”This is the title of the accordion” ( described the title )</li>
<li>open=”no” ( optional: no | yes – Accordion item will be open or closed? by default: no )</li>
</ul>
<pre>[accordion id="unique-id" class="some-class" title="This is the title of the accordion" open="no"]

 Accordion Content will goes here

[/accordion]</pre>
<h3>More Shortcodes Coming Soon</h3>

Bootstrap Shortcodes Ultimate

Excellent work

Awesome...

Awesome work.

Nice plugin

Simple Plugin for Enqueue Bootstrap 4 CSS, JS, and Some Helpful WordPress Shortcodes for visual usages.

Paul

One Dollar Plugin

Support The Plugin: <a href="http://www.icontrolwp.com/2013/05/remove-ads-support-wordpress-twitter-bootstrap-plugin/" rel="nofollow ugc">Go Ad free</a>
What is Twitter Bootstrap? 
It’s a CSS and Javascript framework that helps boost your site design and functionality quickly.
We love Twitter Bootstrap on our <a href="http://icwp.io/2" title="iControlWP: Secure WordPress Management" rel="nofollow ugc">WordPress sites at iControlWP</a>. 
And we wanted a way to quickly link the latest Bootstrap CSS and Javascript to all pages, regardless of the WordPress Theme.
With this plugin, now you can!
<ul>
<li>Works with any WordPress Theme without ever editing Theme files and NO programming needed.</li>
<li>Now fully customizable with built-in LESS Compiler.</li>
<li>Handy WordPress [SHORTCODES] to add Twitter Bootstrap elements to your site quickly</li>
<li>Add your own custom CSS reset file</li>
<li>Option to add JavaScript to the [HEAD] (defaults to end of [BODY] as is good practice)</li>
<li>and more..</li>
</ul>
To get the latest news and support go here: <a href="http://icwp.io/8" title="WordPress Twitter Bootstrap CSS Plugin Home" rel="nofollow ugc">WordPress Twitter Bootstrap CSS Plugin Home</a> to see the release article on our site.
Why use Twitter Bootstrap? 
It’s good practice to have a core, underlying CSS definition so that your website appears and acts consistently across all 
browsers as far as possible.
Twitter Bootstrap does this extremely well.
From Twitter Bootstrap: 
Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. 
It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more
The problem? 
Many themes do not allow you to add custom CSS files easily. Even the Thesis Framework! So we take 
another approach and inject the CSS as one of the FIRST items in the HTML HEAD section. This way, no 
other CSS interferes first so you can be sure these bootstrap file can be used as a foundation/reset CSS.
The CSS is only part of the solution. Twitter Bootstrap also have Javascript libraries 
to complement their Bootstrap CSS. These may also be added to your site with the option to 
add them to the HEAD of your site – by default they are added to the end of the BODY.
We also wanted the option to alternatively include YUI “reset.css” and “normalize.css”. These both form related roles to bootstrap, but are lighter.
You could look at the difference between the styles as:
<ul>
<li>reset.css – used to strip/remove the differences and reduce browser inconsistencies. It is typically generic and 
will not be any use alone. It is to be treated as a starting point for your styling.</li>
<li>normalize.css – aims to make built-in browser styling consistent across browsers and adds basic styles for modern 
expectations of certain elements. E.g. H1-6 will all appear bold.</li>
<li>bootstrap.css – is a level above normalize where it adds much more styling but retains consistency across modern 
browsers. It makes site and web application development much faster.</li>
</ul>
Some References:
Bootstrap, from Twitter: http://twitter.github.com/bootstrap/
Yahoo Reset CSS, YUI 2: http://developer.yahoo.com/yui/2/
Normalize CSS: http://necolas.github.com/normalize.css/

Twitter Bootstrap for WordPress

WordPress Twitter Bootstrap CSS lets you include the latest Twitter Bootstrap CSS and Javascript libraries in your WordPress site.

Bootstrap Shortcodes Ultimate vs Twitter Bootstrap for WordPress