Skip to content

Instantly share code, notes, and snippets.

@svenl77
Created August 7, 2013 12:38
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save svenl77/6173685 to your computer and use it in GitHub Desktop.
Save svenl77/6173685 to your computer and use it in GitHub Desktop.
Add Bootstrap classes to WordPress core html elements - default widgets and comments. If you want to build a WordPress theme using twitter bootstrap, this will help you to add all needed classes to html witch comes from functions inside WordPress like widgets and comments.
// first set the body to hide and show everyhthing when fully loaded ;)
document.write("<style>body{display:none;}</style>");
jQuery(document).ready(function(){
jQuery( 'input.search-field' ).addClass( 'form-control' );
// here for each comment reply link of wordpress
jQuery( '.comment-reply-link' ).addClass( 'btn btn-primary' );
// here for the submit button of the comment reply form
jQuery( '#commentsubmit' ).addClass( 'btn btn-primary' );
// The WordPress Default Widgets
// Now we'll add some classes for the wordpress default widgets - let's go
// the search widget
jQuery( 'input.search-field' ).addClass( 'form-control' );
jQuery( 'input.search-submit' ).addClass( 'btn btn-default' );
jQuery( '.widget_rss ul' ).addClass( 'media-list' );
jQuery( '.widget_meta ul, .widget_recent_entries ul, .widget_archive ul, .widget_categories ul, .widget_nav_menu ul, .widget_pages ul' ).addClass( 'nav' );
jQuery( '.widget_recent_comments ul#recentcomments' ).css( 'list-style', 'none').css( 'padding-left', '0' );
jQuery( '.widget_recent_comments ul#recentcomments li' ).css( 'padding', '5px 15px');
jQuery( 'table#wp-calendar' ).addClass( 'table table-striped');
jQuery(document.body).show();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment