I'm trying to make a child theme off the html5blank theme. I've managed to get my child theme CSS working using the following:
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'main-css', get_stylesheet_directory_uri() . '/css/main.css' );
}
?>
But the styles from the parent are still inherited. These are style.css and normalize.css. I have no need for these files at all.
So I've been told I need to use wp_dequeue_style(). to "remove parent enqueued files with wp_dequeue_style()" and add your hook with a later priority than the default 10. This is a third, optional parameter for add_action(). Something like 100.
Unfortunately I'm really struggling with this basic task, I've tried but I can't get it working. I tried the following but obviously it's totally wrong!
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'main-css', get_stylesheet_directory_uri() . '/css/main.css' );
wp_dequeue_style( 'parent-style-css', get_template_directory_uri() . '/style.css', 100 );
wp_dequeue_style( 'parent-normalize-css', get_template_directory_uri() . '/normalize.css', 100 );
}
?>
Can anyone help with this? I'm sure it's straight forward but I don't have a clue!
Also, I'm guessing if I don't need the JS from the parent either as I'll use that in my child them, I guess I'd use the methods to enqueue/dequeue them?
EDIT
Is this more like it...
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 100 );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'main-css', get_stylesheet_directory_uri() . '/css/main.css' );
wp_dequeue_style( 'normalize');
wp_dequeue_style( 'html5blank');
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_scripts', 100 );
function my_theme_enqueue_scripts() {
wp_deregister_script( 'conditionizr');
wp_deregister_script( 'modernizr');
wp_deregister_script( 'html5blankscripts');
wp_register_script('jquery', get_template_directory_uri() . '/js/jquery-1.12.0.min.js', array('jquery'), '1.12.0'); // Custom scripts
wp_enqueue_script('jquery'); // Enqueue it!
wp_register_script('responsive-nav', get_template_directory_uri() . '/js/responsive-nav.js', array('jquery'), '1.0.0'); // Custom scripts
wp_enqueue_script('responsive-nav'); // Enqueue it!
wp_register_script('uniform-js', get_template_directory_uri() . '/js/jquery.uniform.min.js', array('jquery'), '1.0.0'); // Custom scripts
wp_enqueue_script('uniform-js'); // Enqueue it!
wp_register_script('main-js', get_template_directory_uri() . '/js/main.js', array('jquery'), '1.0.0'); // Custom scripts
wp_enqueue_script('main-js'); // Enqueue it!
}
?>
The instructions were simply telling you to change this...
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
into this...
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 100 );
The full method call is...
add_action( string $tag, callable $function_to_add, int $priority = 10, int $accepted_args = 1 )
Only the first two are required, the others have defaults they will use in case you leave them blank.
Also, to dequeue, you only need the name of the parent identifier, not all of the file details.
wp_dequeue_style( 'name-of-identifier-in-parent-theme' );
It looks like you put the priority on the wrong function call.
And Yes, you can dequeue javascript files as well using this method.
Related
So I have this Child Theme and when I try to enqueue the styles and the javascript I run into an error:
wp_enqueue_script is working fine
wp_enqueue_style doesn't work at all
wp_head() is included in the header and it worked before, but after updating Avast theme and wordpress the problem started to occurre.
functions.php
function theme_enqueue_styles() {
wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css'); //not working
wp_enqueue_style( 'fancy', get_stylesheet_directory_uri() . '/css/jquery.fancybox.min.css'); //not working
wp_enqueue_script( 'devtools', get_stylesheet_directory_uri() . '/js/main.min.js' ); //working
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
Check out the wordpress child themes documentation.
There you can find this line
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'child-style', get_stylesheet_uri(),
array( 'parenthandle' ),
wp_get_theme()->get('Version') // this only works if you have Version in the style header
);
}
I have been struggling with diagnosing a bug on a project for hours now. I have currently narrowed it down to what is happening, I'm just not sure why:
I have a template partial called "testimonials.php" which enqueues styles at the top of the file:
<?php
add_action("wp_enqueue_scripts", function() {
wp_enqueue_style("testimonials-style", get_stylesheet_directory_uri() . "/partials/testimonials.css");
});
?>
However, when I try to render this as a partial in a parent template, using get_template_part('partials/testimonials') the partial is rendered, but the CSS is not enqueued. Same for enqueueing JS files. I have verified that the pathways are correct, etc.
If I enqueue the style in the parent Template, then the styles show up.
Do I really need to enqueue the styles into every parent template in which I wish to include this partial?? I must be missing something, because this doesn't seem modular at all!
Can someone please help?
Try this
CSS
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
$parent_style = 'parent-style';
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css');
wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css');
}
JS
function wpdocs_scripts_method() {
wp_enqueue_script( 'form-script', get_template_directory_uri() . '/js/form.js', array( 'jquery' ) );
wp_enqueue_script( 'custom-script', get_stylesheet_directory_uri() . '/js/custom.js', array( 'jquery' ) );
}
add_action( 'wp_enqueue_scripts', 'wpdocs_scripts_method' );
<?php
add_action( 'wp_enqueue_scripts', 'my_stylesheet' );
function my_stylesheet() {
wp_enqueue_style( 'my-style', get_stylesheet_directory_uri() . '/partials/testimonials.css', false, '1.0', 'all' );
}
For more understanding you can see following doc
https://developer.wordpress.org/reference/functions/wp_enqueue_style/
function mytheme_scripts_styles() {
wp_enqueue_script( 'app-script', get_template_directory_uri() . '/assets/js/app.6e31112b.js', array('jquery'), 1.0, true);
wp_enqueue_style('app-css', get_stylesheet_directory_uri() . "/assets/css/build.css",false,'','all');
}
add_action( 'wp_enqueue_scripts', 'mytheme_scripts_styles' );
My child-theme stylesheet doesnt seem to be working. I think the script needs to change to load it last but I'm not sure how to change the priority.
Website url
This the functions.php file:
<?php
function thim_child_enqueue_styles() {
// Enqueue parent style
wp_enqueue_style( 'thim-parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'thim_child_enqueue_styles', 100);
You should enqueue also 'parent-style' and set it as a dependency of 'child-style'. It will ensure that the child theme stylesheet loads after it. So rewrite your enqueue function accordingly:
function my_theme_enqueue_styles() {
$parent_style = 'parent-style';
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', 'my_theme_enqueue_styles' );
Take a look at the documentation.
I am using this theme:https://dessign.net/sold-responsive-woocommerce-free/
and I have created a child theme. I set it up by adding
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() .
/style.css' );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
but certain things are not being applied like the sticky headeror mobile menu. Is there anything else I need to include?
Your child theme's stylesheet will usually be loaded automatically. If it is not, you will need to enqueue it as well. Setting 'parent-style' as a dependency will ensure that the child theme stylesheet loads after it. See here a more detailed discussion :
<?php
function theme_enqueue_styles() {
$parent_style = 'parent-style';
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 )
);
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
?>
https://codex.wordpress.org/Child_Themes
I am trying to create a child theme but I think that there is something wrong with my functions.php.
(<?php)add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'sydney', get_template_directory_uri() . '/style.css' );
}function theme_enqueue_styles() {
$parent_style = 'sydney';
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'sydney-child',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style )
);
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
May Be this problem is due to function.php file in your child theme.
Child theme’s functions.php is loaded first implies that you can create the user functions of your theme pluggable - that are replaceable by a child theme - by mentioning them restrictively. E.g.:
if ( ! function_exists( 'theme_special_nav' ) ) {
function theme_special_nav() {
// Do something.
}
}
In that way, a child theme can replace a PHP function of the parent by simply declaring it beforehand.
for further reference please visit : Wordpress Child Theme
If you find my answer helpful please mark it, So others can take the benefits of it.