How To Place Bootstrap Buttons On Your Blogger Blog !

Bootstrap have a series of button which have different type of colour and different size, and classes for use.
If your want to add the bootstrap button on your blog so you just have to follows these steps.

1. First you have to open your blogger template edittor.
2. Then place the bootstrap CDN css and javascript on your template.
3. Then refresh your page and check your page is working .
4. Then paste these codes for default size buttons.

<!-- Standard button -->
<button type="button" class="btn btn-default">Default</button>

<!-- Provides extra visual weight and identifies the primary action in a set of buttons -->
<button type="button" class="btn btn-primary">Primary</button>

<!-- Indicates a successful or positive action -->
<button type="button" class="btn btn-success">Success</button>

<!-- Contextual button for informational alert messages -->
<button type="button" class="btn btn-info">Info</button>

<!-- Indicates caution should be taken with this action -->
<button type="button" class="btn btn-warning">Warning</button>

<!-- Indicates a dangerous or potentially negative action -->
<button type="button" class="btn btn-danger">Danger</button>

These codes gives you these type of default buttons.

5. If you want to make a button with the large size so add the "btn-block" class on the previous button.

<button type="button" class="btn btn-primary btn-lg btn-block">Block level button</button>
<!-- This is the example of btn-block class -->

6. If you want to make the fancy buttons with random size, copy these codes.

<p>
  <button type="button" class="btn btn-primary btn-lg">Large button</button>
  <button type="button" class="btn btn-default btn-lg">Large button</button>
</p>
<p>
  <button type="button" class="btn btn-primary">Default button</button>
  <button type="button" class="btn btn-default">Default button</button>
</p>
<p>
  <button type="button" class="btn btn-primary btn-sm">Small button</button>
  <button type="button" class="btn btn-default btn-sm">Small button</button>
</p>
<p>
  <button type="button" class="btn btn-primary btn-xs">Extra small button</button>
  <button type="button" class="btn btn-default btn-xs">Extra small button</button>
</p>

Example of fancy btn-sm and btn-xs class.

7. If you want to make the disable button so copy these codes.

<a href="#" class="btn btn-primary btn-lg disabled" role="button">Primary link</a>
<a href="#" class="btn btn-default btn-lg disabled" role="button">Link</a>