I have added this line on my plugin
wp_enqueue_style( 'dazzling-bootstrap', get_template_directory_uri() . '/inc/css/bootstrap.min.css' );
and it seems that the whole admin backend was affected of that bootstrap. Any ideas on how to be only on that plugin?
That's because you're not specifying anywhere that the file should be included only for your plugin page, and not for the whole admin backend. Try to add a conditional check and then enqueue the stylesheet.
global $post;
if ( 'enter_plugin_page_slug_here' == $post->name ) {
// enqueue stylesheet here
}
Related
I am creating a theme with bootstrap for my WordPress site. I used codestar framework to make an admin panel. I want to use bootstrap icons instead of fontawesome icons used in Codestar framework. On the document page there is an explanation:
As you know, the Icon field works only in backend and you should to
include the icon CSS file in front-end by yourself. For eg. take a
look below enqueue styles example or use your own enqueue styles
method.
Here are the codes I need to change
if( ! function_exists( 'your_prefix_enqueue_fa5' ) ) {
function your_prefix_enqueue_fa5() {
wp_enqueue_style( 'fa5', 'https://use.fontawesome.com/releases/v5.13.0/css/all.css', array(), '5.13.0', 'all' );
wp_enqueue_style( 'fa5-v4-shims', 'https://use.fontawesome.com/releases/v5.13.0/css/v4-shims.css', array(), '5.13.0', 'all' );
}
add_action( 'wp_enqueue_scripts', 'your_prefix_enqueue_fa5' );
}
If still you want to use Font Awesome 4 only add this filter anywhere.
add_filter( 'csf_fa4', '__return_true' );
Bootstrap icon cdn =>
https://cdn.jsdelivr.net/npm/bootstrap-icons#1.8.1/font/bootstrap-icons.css
The problem is: How can I import the bootstrap icons into the code given above? Thank you in advance for your help.
I used translation for the question. If I'm not successful source:
http://codestarframework.com/documentation/#/fields?id=icon
I am developing a word press theme and I have a free plugin which helps me to add new features to my theme. I want to use this plugin in this theme but I don't want to use it as a plugin and have to activate in plugins section. I want to use it as a theme part and disable activating or deactivating it. It will be activate automatically when theme set up.
If your theme uploaded somewhere then refer -> https://wordimpress.com/how-to-easily-require-plugins-for-your-wordpress-themes/
Or
add_action( 'admin_notices', 'my_theme_dependencies' );
function my_theme_dependencies() {
if( ! function_exists('plugin_function') )
echo '<div class="error"><p>' . __( 'Warning: The theme needs Plugin X to function', 'my-theme' ) . '</p></div>';
}
OR
if your theme is in local setup then you can use must-up plugin, for that refer -> https://codex.wordpress.org/Must_Use_Plugins
So if I understand correctly you want your plugin to be in Wordpress but you don't want it to be shown to anyone else or be able to deactivate it?
Try using this plugin, which will hide your plugin('s) from everyone - WP Hide Plugins.
Or add this to your functions.php file:
function hide_plugin_trickspanda() {
global $wp_list_table;
$hidearr = array('plugin-directory/plugin-file.php');
$myplugins = $wp_list_table->items;
foreach ($myplugins as $key => $val) {
if (in_array($key,$hidearr)) {
unset($wp_list_table->items[$key]);
}
}
}
add_action('pre_current_active_plugins', 'hide_plugin_trickspanda');
Info to go with this code: rename the plugin name in the first line, also change the "plugin-directory/plugin-file.php" to the plugin file of your plugin and in the last line change the plugin name too.
I have this styles created in dynamic page with pure html, css, some js libraries. I want to add it to wordpress theme, If there any plugins can create those styles, or how can i add the code by myself ?
Style1
Style2
To add your own styles:
1) Create a child-theme
2) Add your styles to the child theme
3) Setup the child theme lo load the parent's styles.
4) If you use different css files for the added styles, load them after the child-theme's style.css is loaded.
5) For the js files you will do the same as for css files.
To load child-themes you will need make changes to the functions.php of the child-them in order to hook into wp_enqueue_scripts action.
add_action( 'wp_enqueue_scripts', 'load_aditional_styles' );
and use wp_enqueue_style();
function oad_aditional_styles(){
wp_enqueue_style( 'my_style_1', get_stylesheet_directory_uri() . '/Style1.css', array(), all );
wp_enqueue_style( 'my_style_2', get_stylesheet_directory_uri() . '/Style2.css', array(), all );
wp_enqueue_script( 'my-js', get_stylesheet_directory_uri() . 'MuJsFile.js', array(),null, true );
}
(This assumes Style1.css and Style2.css are in the root of the child-theme, otherwise you need to add the corresponding folders to the file name)
For js files, the empty array indicates no dependancies, but if you have dependancies like jQuery, the jquery handle has to be added there.
I have been looking for an answer for this in SOF but didn't find a clear answer
I have a plugin that forces pages to be shown when certain conditions are met. but when i try to include css files for styling i get no response .
I tried to include the file using normal html and this was a failure
then tried the wp_register_style and wp_enqueue_style as such:
function rw_add_style(){
$rw_path = plugins_url('kawaleb/style.css');
wp_register_style('testili',plugins_url('kawaleb/style.css'));
wp_enqueue_style( 'testili' );
}
add_action ('wp_enqueue_scripts','rw_add_style');
wp_enqueue_style( 'testili' );
}
I placed this code on the page that should be shown when the conditions are met
What I don't know here is how to procede after enqueing !
do I need to use html to include the stylesheet file ( and then what is the use of enqueing ?) or does it do that by itself (and then what I am missing here ? )
In the doc of codex they dont go further than telling you to register the style then enqueue it !!!
Thank you all :)
You don't need to register the style, you can just enqueue it. Also, you mentioned that you've put the code in the file where you'd like it to display, you should put it in the index file of your plugin, so in /your-plugin/index.php or whatever the main file is called, add this code:
function rw_add_style() {
wp_enqueue_style( 'testili', plugins_url( 'kawaleb/style.css' ) );
}
add_action( 'wp_enqueue_scripts', 'rw_add_style' );
If you need it only on a certain page then you should add your conditional within the function, so you could do this for example:
function rw_add_style() {
global $post;
if ( $post->post_name == 'post_name' ) {
wp_enqueue_style( 'testili', plugins_url( 'kawaleb/style.css' ) );
}
}
add_action( 'wp_enqueue_scripts', 'rw_add_style' );
And you can work out what the post name is for the page you need to enqueue it for by temporarily adding the following code to the page template:
global $post;
echo $post->post_name;
To be clear, you don't need to add any html <link> to include the CSS as you're right, there would be no point in enqueuing it then. Just add the enqueue as I described above in the main index file of your plugin and it will be automatically included in the wp_head() in your header and output just before the </head>.
I hope this helps. Good luck. =)
I am building a full design into WordPress for the first time and I am trying to load in stylesheets and script files but all I seem to be getting is the text output of the location.
What I have is below..
wp_enqueue_style('reset', bloginfo('template_url') . '/reset.css');
wp_enqueue_style('style', bloginfo('stylesheet_url'), array('reset'));
wp_enqueue_style('rhino', bloginfo('template_url') . '/rhinoslider-1.05.css', array('reset','style'));
Do I need to put this inside the link tags or something? I thought it would do it all itself; as what's the point loading it that way if it doesn't do it itself? I know it makes sure the same file isn't included twice or something, but if you have to include the link tags yourself and then WP decides not to include the file then you are left with blank link tags!?
Lastly, should I set these up beforehand so I can just call them via their handles? If so, where? functions.php?
Edit: I also tried putting the below in my themes functions.php file but got the same results.
add_action( 'after_setup_theme', 'mmw_new_theme_setup' );
function mmw_new_theme_setup() {
/* Add theme support for post formats. */
add_theme_support( 'post-formats' );
/* Add theme support for post thumbnails. */
add_theme_support( 'post-thumbnails' );
/* Add theme support for automatic feed links. */
add_theme_support( 'automatic-feed-links' );
/* Add theme support for menus. */
add_theme_support( 'menus' );
/* Load style files on the 'wp_enqueue_scripts' action hook. */
add_action( 'wp_enqueue_scripts', 'mmw_new_load_styles' );
}
function mmw_new_load_styles() {
$foo = bloginfo('template_url') . '/reset.css';
$bar = bloginfo('template_url') . '/rhinoslider-1.05.css';
wp_enqueue_style('reset', $foo);
wp_enqueue_style('style', bloginfo('stylesheet_url'), array('reset'));
wp_enqueue_style('rhino', $bar, array('reset','style'));
}
When storing values in a variable via PHP use:
get_bloginfo()
So your new function would now look like:
function mmw_new_load_styles() {
$foo = get_bloginfo('template_url') . '/reset.css';
$bar = get_bloginfo('template_url') . '/rhinoslider-1.05.css';
wp_enqueue_style('reset', $foo);
wp_enqueue_style('style', bloginfo('stylesheet_url'), array('reset'));
wp_enqueue_style('rhino', $bar, array('reset','style'));
}
And be more semantic! It makes code for beginners easier to look at. ($foo could be $resetCssUrl)
I was having similar issues.
The register / enqueue scripts are so that you can globally assign your functions to load in the correct order. You can call them from the page that your working in but it is considered better practice do it this way.
My template has a functions.php but its nealry empty! It sepreates the scripts into 7 subchapters, theme-options, theme-functions, themes-js, etc. Here is my themes.js.php file but this could quite easily placed in your file inside your wp-content/themes/functions.php My themes-js.php file