brazilianldsjaguar
brazilianldsjaguar

Reputation: 1449

Add custom CSS to shortcodes

I'm developing a wordpress plugin. This plugin will use shortcodes to display larges chunks of HTML that are styled with Bootstrap 3. However, I cannot depend on whether or not the theme has bootstrap 3 enabled. Is there a way, from my plugin, to ensure that the bootstrap 3 libraries get added to the page?

I've looked through the documentation and nothing seems clear enough. I have a feeling it has to do with wp_enqueue_script, but not sure of the hooks I'd need to use to tie into the CSS/JS on the main page/post pages/theme header, etc.

Upvotes: 0

Views: 3812

Answers (1)

trex005
trex005

Reputation: 5115

The summary is, when your plugin is loaded, you should register bootstrap :

add_action( 'wp_enqueue_scripts', 'my_plugin_register_scripts' );
function my_plugin_register_scripts(){
     wp_register_script('bootstrap','//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js',array('jquery'),'3.3.2',true);
     wp_register_style('bootstrap','//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css', array(), '3.3.2');
}

Then, when your shortcode is called, you enqueue bootstrap :

wp_enqueue_script('bootstrap');
wp_enqueue_style('bootstrap');

Upvotes: 1

Related Questions