Bootstrap can not be added directly to the admin of a plugin, but you can wrap your plugin in a container and compile the Bootstrap CSS to use it as a wrapper.

I do my compiling using SimpLess

In the past you could do this using SimpLess directly (my-own-bootstrap.less).

.bootstrap-wrapper {

@import (less) url( 'bootstrap.css' );

}

This fails with the latest version of Bootstrap. But you can just paste the Bootstrap CSS into the LESS file and compile it that way.

.bootstrap-wrapper {

// Paste Bootstrap CSS here

}

Run it through SimpLess and after that the new CSS can be enqueued in WordPress ! This also works nicely with themes from Bootswatch.

1	wp_enqueue_style( $this->plugin_slug .'-my-bootstrapstyle', plugins_url( 'css/my-bootstrapstyle.css', __FILE__ ), array(), $this->version );

Enjoy!

2 Comments

Oldest

Newest Most Voted

Inline Feedbacks

View all comments

herahadi

1 Jahr zuvor

i got an error when compiling this code using Online Less Compilers less2css.org

.bootstrap-wrapper {
// Paste Bootstrap CSS here
}

please help, less compiler you mentioned is not available anymore

Antworten

Autor

Alex

Reply to herahadi

Hi,
these days its far easier to use the core Sass files.
https://getbootstrap.com/docs/4.1/getting-started/theming/#sass

Just import all

@import "../bootstrap/scss/bootstrap";

or just what you need

// Required @import "../bootstrap/scss/functions"; @import "../bootstrap/scss/variables"; @import "../bootstrap/scss/mixins";

// Optional @import "../bootstrap/scss/reboot"; @import "../bootstrap/scss/type"; @import "../bootstrap/scss/images"; @import "../bootstrap/scss/code"; @import "../bootstrap/scss/grid";

Far more flexible than the old less wrapper tweak :)

Cheers
Alex

WordPress Admin + Plugin Development + Less + Bootstrap = Awesome

Alexander