Twitter Bootstrap components in the Customizr WordPress Theme


Customizr is built with Twitter Bootstrap v2.3.2.

The following is a demonstration of what you can use in the Customizr theme including the code ready to paste in your devs.

Of course this is not an exhaustive list, all the components are here.

Buttons

   

  <button class="btn btn-large">Default</button>&nbsp;<button class="btn">Default</button>&nbsp;<button class="btn btn-small">Default</button>&nbsp;<button class="btn btn-mini">Default</button>

   

  <button class="btn btn-large btn-primary">Primary</button>&nbsp;<button class="btn btn-primary">Primary</button>&nbsp;<button class="btn btn-small btn-primary">Primary</button>&nbsp;<button class="btn btn-mini btn-primary">Primary</button>

   

  <button class="btn btn-large btn-info">Info</button>&nbsp;<button class="btn btn-info">Info</button>&nbsp;<button class="btn btn-small btn-info">Info</button>&nbsp;<button class="btn btn-mini btn-info">Info</button>

   

  <button class="btn btn-large btn-success">Success</button>&nbsp;<button class="btn btn-success">Success</button>&nbsp;<button class="btn btn-small btn-success">Success</button>&nbsp;<button class="btn btn-mini btn-success">Success</button>

   

  <button class="btn btn-large btn-warning">Warning</button>&nbsp;<button class="btn btn-warning">Warning</button>&nbsp;<button class="btn btn-small btn-warning">Warning</button>&nbsp;<button class="btn btn-mini btn-warning">Warning</button>

   

  <button class="btn btn-large btn-danger">Danger</button>&nbsp;<button class="btn btn-danger">Danger</button>&nbsp;<button class="btn btn-small btn-danger">Danger</button>&nbsp;<button class="btn btn-mini btn-danger">Danger</button>

   

  <button class="btn btn-large btn-inverse">Inverse</button>&nbsp;<button class="btn btn-inverse">Inverse</button>&nbsp;<button class="btn btn-small btn-inverse">Inverse</button>&nbsp;<button class="btn btn-mini btn-inverse">Inverse</button>

 

  <button class="btn btn-large btn-block btn-primary" type="button">Block level button</button> <button class="btn btn-large btn-block" type="button">Block level button</button>

 

  <button class="btn btn-large btn-primary disabled" disabled="disabled" type="button">Primary button (disabled)</button> <button class="btn btn-large" disabled="disabled" type="button">Button (disabled)</button>

 

Labels and badges

Default Success Warning Important Info Inverse

 

1 2 4 6 8 10

 

 

Alerts

Warning!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

 

Error!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

 

Success!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

 

Info!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Progress bars

 

 

Grid

Check this snippet about Bootstrap grid and layout in Customizr WordPress theme.


Related Snippets you may also like


We can help you to implement this snippet

Coding is our job and we know WordPress inside and out. We can help you to customize your website with small chunks of code snippets like this one.

Send us your request and we'll get back to you quickly.



6 thoughts on “Twitter Bootstrap components in the Customizr WordPress Theme

Comments are closed.