I am developing a plugin that needs to overwrite the hook to the parent style.css.
I use the plugin to dequeue the style from the child theme but then I need to enqueue another file into it so that the child theme css works. Not sure if I am making sense.
Basically how would I go about adding this code into the child theme functions.php via my plugin:
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'child-style', plugins_url( '/plugin/css/3.0.31' ) . '/style.min.css' );
}
As it is a plugin it would need to do it automatically without access to the file.
Any ideas?
Thanks
Related
I've added a custom JQuery script to a new JS file "themes\twentytwentyone\js\script_new.js".
And I load this new JS file in theme functions.php file.
function add_custom_script() {
wp_enqueue_script(
'my_script',
get_stylesheet_directory_uri() .'/js/script_new.js',
array( 'jquery' ),
'1.0',
true
);
}
add_action( 'wp_enqueue_scripts', 'add_custom_script' );
This works without any issue. But is there a way to achieve this without updating the theme functions.php file?
I'm not sure if updating the functions.php file is good practice.
Using child's theme functions.php is the best practice .
But if you don't want to use functions.php then you can call js file through footer.php or header.php too.
Please note i recommend and it is the safest to make child theme for any customisation and use Child theme's functions.php.
Utilizing a child theme with the WP 'Apostrophe' theme causes the sample page to display without any of the theme formatting: https://begnbark.com/wp/
'Would appreciate some illumination here.
Thank You!
You need to enqueue theme's parent's style, put this in your functions.php in child theme:
<?php
function enqueue_parent_style() {
wp_enqueue_style( 'apostrophe-parent', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_parent_style' );
I am using the DIVI theme and am trying to enqueue the child theme to override the parent theme. Here is the code in my functions.php:
// Queue parent style followed by child/customized style
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', PHP_INT_MAX);
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( 'parent-style' ) );
}
When I view source, everything is in the correct place. However, code in the child theme is not overriding code in the parent style. I've tried being more specific in my selectors, but no luck.
I've tried various versions of the enqueue code, I can see where my CSS is being called, but being overwritten by Divi's CSS.
While this isn't my favorite theme to work with, I'm stuck with it for this client. If possible, I'd prefer to have my separate stylesheet work vs using the customizer or other workarounds.
Is there a way to do this?
EDIT The enqueue works as is. I wasn't being specific enough in the child theme CSS to override the DIVI default CSS.
Actually my problem is that I already had a functional Child theme with a functions.php and many others filesname.php and also a style.css which work properly, but when I try to add an other stylesheet like for instance modules.min.css The theme is only reading it in the parent folder so I can't change stylesheets in my website and this is annoying
Some data:
File in the parent folder I want to override: \wp-content\themes\startit\assets\css\modules.min.css
File in the child folder I want to be readable: \wp-content\themes\startit-child\assets\css\modules.min.css
I also tryed to put the modules.min.css right here in my child theme next to the styles.css but I can't override the parent folder \wp-content\themes\startit-child\modules.min.css
This is what look like my functions.php :
<?php
function startit_enqueue_styles() {
$parent_style = 'startit-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style ),
wp_get_theme()->get('Version')
);
}
add_action( 'wp_enqueue_scripts', 'startit_enqueue_styles' );
?>
Thank you !
There are couple of ways to do that and the simplest one is:
Remove/Dequeue Parent CSS file
Add/Enqueue new CSS file
function PREFIX_remove_scripts() {
wp_dequeue_style( 'put_modules_file_handler_here' );
wp_deregister_style( 'put_modules_file_handler_here' );
// Now register your child CSS here, using wp_enqueue_style
}
add_action( 'wp_enqueue_scripts', 'PREFIX_remove_scripts', 20 );
Some Common Confusions
Should you enqueue child styles as well as parent styles? Is it necessary? This is where a lot of confusion exists regarding enqueueing stylesheets in child themes. The answer depends on how the parent styles are included in the parent theme. For example, if the parent theme is using get_stylesheet_uri() to enqueue styles,
for example as in Twenty Sixteen:
wp_enqueue_style('twentysixteen-style', get_stylesheet_uri());
then you don't need to enqueue the child styles. This is because get_stylesheet_uri() returns the URL of the current active theme, which in this case is the child theme.
This is how URLs are returned, when working with child themes
get_stylesheet_uri() = http://example.com/wp-content/themes/example-child/style.css
get_template_directory_uri() = http://example.com/wp-content/themes/example-parent
get_stylesheet_directory_uri() = http://example.com/wp-content/themes/example-child
So, I would recommend you to check your parent functions.php and see, how the style is enqueued so you can handle it properly.
// Add css file or js file
function activate_css() {
wp_enqueue_style('min_style_css', get_template_directory_uri() .'assets/css/modules.min.css'));
));
}
//add css
add_action( 'init','activate_css');
I have a child theme setup in wordpress and the style.css and functions.php in the child theme are working correctly. I now want to overwrite other template .php files with the versions in the child theme. I can't seem to make these files overwrite the parent theme however.
child theme functions.php:
<?php
//enqueue styles
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 'overwrite' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
//overwrite template pages
function overwrite() {
wp_enqueue_script( get_template_directory_uri() . '/inc/structure/hooks.php' );
wp_enqueue_script( get_template_directory_uri() . '/inc/structure/header.php' );
}
I have a hooks.php and header.php in /child-theme/inc/structure/
For a child-theme you do not need to enqueue any template (PHP) files, simply add a PHP file to your child-theme with exactly the same name and path as the one you are trying to overwrite in your parent theme and it will naturally replace it.