I am trying to enqueue an edited js file from my child theme and dequeue the original one from the parent. It should be simple, however, the parent theme is calling a function where all enqueues are made. I managed to enqueue it but not to dequeue. In addition, the original enqueue is followed by wp_localize_script() function.
If I copy the whole function to my child it works, but I am looking for a cleaner and better way to achieve that.
Here is how the original code is set up (Parent Theme):
In function.php this function is called
add_action('wp_enqueue_scripts', 'wpestate_scripts');
The wpestate_scripts function is found in another file, css_js_include.php
function wpestate_scripts() {
// A bunch of files being enqueued and some variables being assigned
wp_enqueue_script('wpestate_property', trailingslashit( get_stylesheet_directory_uri() ).'js/property.js',array('jquery','wpestate_control'), '1.0', true);
wp_localize_script('wpestate_property', 'property_vars',
array(
// Variables being localized
)
);
}
I have already added wp_dequeue_script('wpestate_property') and wp_deregister_script('wpestate_property') to my child function.php. And it did not work.
Any help is appreciated.
You need to make sure the function you're calling is fired after the script is enqueued by the parent. Typically this is done by adding a high integer value to the $priority argument for add_action().
add_action( 'wp_enqueue_scripts', 'modify_wpestate_scripts', 99 );
function modify_wpestate_scripts() {
wp_dequeue_script('wpestate_property');
// Enqueue your custom script instead
wp_enqueue_script( 'custom-wpestate_property', 'custom-wpep.js', [], '1.0', true );
wp_localize_script('custom-wpestate_property', 'property_vars',
array(
// Variables being localized
)
);
}
This adds it to the same action hook (wp_enqueue_scripts) as the parent function, but the priorty is set to 99 so it runs later (the default priority is 10).
Related
I'm trying to do a plugin that will change the behavior of a theme.
In the theme file I have a get_template_part('libs/templates/user_menu');
I want to make my plugin to "force" the get_template_part return another slug file (a path to a file in plugin folder).
So far this is my code inside the plugin:
function wpse21352_template_part_cb( $slug )
{
if(slug == 'user_menu') {
return WP_PLUGIN_URL.'/'.$slug;
} else {
return $slug;
}
}
do_action( "get_template_part_user_menu", 'user_menu' );
add_action( 'wpse21352_template_part_cb', 'get_template_part_user_menu', 10, 1 );
First of all, get_template_part does not return anything. It loads a file from your theme based on the parameters you pass to it. The function does not support filtering, which means you can not actually overwrite what is outputted by get_template_part.
The only thing the action get_template_part_[slug] allows you to do is output something before the theme file is loaded. For example, using
function myplugin_before_login( $slug, $name ) {
echo 'Example';
}
add_action( 'get_template_part_login', 'myplugin_before_login', 10, 2 );
would output "Example" before the loading the theme file when calling get_template_part( 'login' );.
Actions and filters
In general, however, I believe you might misunderstand how actions and filters work. The WordPress Codex offers extensive information on their use and usage.
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 have a child theme and I am trying to filter the following:
// add the function to the init hook
add_action( 'init', 'options_typography_get_google_fonts' );
// add a font to the $google_fonts variable
function options_typography_get_google_fonts() {
// Google Font Defaults
global $google_faces;
$google_faces = array(
'Great Vibes, cursive' => '*Great Vibes'
);
return $google_faces;
}
What is the best way to filter this so I can add more google fonts?
Your question is a bit vague, so here are some options:
(1) If the parent theme checks if the options_typography_get_google_fonts function exists (with function_exists) you can override the function by redeclaring it in your child theme.
(2) If the parent theme does not, you should be able to remove the action in your childtheme:
remove_action( 'init', 'options_typography_get_google_fonts' );
and build your own (similar but extended) function based on the function you just removed.
(3) If you're building a child theme, and would like users to be able to filter the list of fonts, you should return a filterable array:
return apply_filters( 'my_options_typography_get_google_fonts_filter', $google_faces );
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
I'm developing a WordPress widget following Dave Clements tutorial. It works well. Now I want to add some styles to it. I want the styles to be in an extra css file which will be loaded during runtime. I'm calling this function
function myprefix_add_my_stylesheet() {
wp_register_style( 'myprefix-style', plugins_url('mystyle.css', __FILE__) );
wp_enqueue_style( 'myprefix-style' );
}
right before "// Widget output //" using this statement.
add_action( 'wp_enqueue_scripts', 'myprefix_add_my_stylesheet' );
But nothing seems to happen. What am I doing wrong?
Your wp_enqueue_scripts action do not work because you call it too late, in widget() function (widget output). It's too late because Wordpress already print/send head of page.
For example, you can add this action on widget construct function.