Changes in .php files within a child theme are not applied on my front-end site.
I've activated a WordPress Child Theme called "Grow Child" from parent "Grow".
I want to change the footer text and links on my site, so, following the instructions, I've copied footer.php file (actually named 04.footer.php) from parent directory to the child-theme folder. I made the corrections but they are not applied to my site.
What is wrong?
When I've made the same corrections directly in the parent directory, they were well applied to my site.
I use the following code in the functions.php of the child theme:
<?php
add_action( 'wp_enqueue_scripts', 'grow_child_enqueue_styles' );
function grow_child_enqueue_styles() {
$parent_style = 'grow'; // This is 'grow-style' for the grow theme.
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'grow-child',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style ),
wp_get_theme()->get('Version')
);
}
?>
I'd like to make changes of parent theme files in my child theme folder so that when the theme is updated not to lose the changes.
Related
I am optimizing performance of my WordPress website
The style.css of my child theme is coming under render blocking resources I need to move it from header to footer
Code inside Child theme's function.php is
function softek_child_enqueue_styles() {
wp_enqueue_style( 'softek-child-style',
get_stylesheet_directory_uri() . '/style.css',
array( 'softek-style' ),
1.0
);
}
add_action( 'wp_enqueue_scripts', 'softek_child_enqueue_styles', 99 );
I have commented this code but the file is still loading
I have a /lib/extends_script/extends-style.min.css file in my child theme that I'm trying to have override the version in the parent theme. I have the following code in place, but it still seems to be loading the parent version of the .css file. What am I doing wrong?
Child theme: functions.php
function PREFIX_remove_scripts() {
// enqueue parent styles
wp_enqueue_style('maple', get_template_directory_uri() .'/style.css');
// enqueue child styles
wp_enqueue_style('maple-child', get_stylesheet_directory_uri() .'/style.css', array('maple'), 99999);
wp_enqueue_style('tn-extends-lib-style', get_stylesheet_directory_uri() .'/lib/extends_script/extends-style.min.css');
}
add_action( 'wp_enqueue_scripts', 'PREFIX_remove_scripts', 20 );
The parent theme functions.php is enqueueing it in the following way:
if ( ! function_exists( 'tn_register_frontend_script' ) ) {
function tn_register_frontend_script() {
// load css code
wp_enqueue_style( 'tn-extends-lib-style', get_template_directory_uri() . '/lib/extends_script/extends-style.min.css', array(), TN_THEME_VERSION, 'all' );
etc.
Copy file that including scripts or style from parent-theme to child-theme,
with the same nesting levels of folders, for example:
parent-theme/inc/theme_styles.php
to
child-theme/inc/theme_styles.php
and inside the same file but in child-theme replace
get_template_directory_uri()
to
get_theme_file_uri()
and now wordpress check style path in child-theme first.
The stylesheet's file with the same path as in your parent-theme must be inside of your child-theme too
I am fairly new to Wordpress but I do understand child themes.
This is the first time I came across a theme with a plugin that has its own style sheet enqueued. Is the following code adding the stylesheet of the booking plugin into the main parent style sheet already (so I do not need to include this in the child theme), or is this an additional enqueued style sheet and I will have to also include that separately in my child's theme.
Any explanation as to what exactly and how this code is working with the parent style would be appreciated. Wordpress codex is practically useless in this area.
{
wp_enqueue_style( 'villagio-style', get_stylesheet_uri(), array(),
villagio_get_theme_version() );
if ( is_plugin_active( 'motopress-hotel-booking/motopress-hotel-
booking.php' ) ) {
wp_enqueue_style( 'villagio-motopress-hotel-booking',
get_template_directory_uri() . '/css/motopress-hotel-booking.css',
array('villagio-style'), villagio_get_theme_version(), 'all' );
}
Yes, you can put that code into your child theme functions.php file. It'll call motopress-hotel-booking.css file, when the plugin motopress-hotel-booking.php will be active. Here is full code:
function custom_add_css_for_theme()
{
wp_enqueue_style('villagio-style', get_stylesheet_uri(), array(), villagio_get_theme_version());
if (is_plugin_active('motopress-hotel-booking/motopress-hotel-booking.php')) {
wp_enqueue_style('villagio-motopress-hotel-booking', get_template_directory_uri() . '/css/motopress-hotel-booking.css', array('villagio-style'), villagio_get_theme_version(), 'all');
}
}
add_action( 'wp_enqueue_scripts', 'custom_add_css_for_theme' );
It's don't matter, from where you called your function( from child theme, or from parent theme ). The function get_template_directory_uri() returns directory of your parent theme, even if you called it from child theme.
If I understand correctly you want to enqueue CSS only in parent theme, try following:
if (is_plugin_activate( 'plugin-name' ) && ! is_child_theme() ) {
//the code will show only in parent theme
}
Reference here
I am pretty new to WordPress development. I read that it's better to use wp_enqueue_style and do_action inside the functions.php file rather than linking CSS files directly as I would when not using WordPress.
Why this is a best practice? What are its advantages?
If you have activated child theme then use get_template_directory_uri() functions.
If you have activated parent theme then use get_stylesheet_directory_uri() functions.
get_template_directory_uri will always refer to the parent theme folder for assets.
get_stylesheet_directory_uri will refer to the "current" theme folder for assets (which could be the parent or the child, depending on where it is called).
Child theme example:
wp_enqueue_style( 'my_child_styles', get_stylesheet_directory_uri().'/style.css' );
Parent theme Example
wp_enqueue_style( 'my_parent_styles', get_template_directory_uri().'/style.css' );
Method-1
// load css into the website's front-end
function mytheme_enqueue_style() {
wp_enqueue_style( 'mytheme-style', get_stylesheet_directory_uri().'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_style' );
Method-2
// Add this code in your functions.php
function add_stylesheet_to_head() {
echo "<link href='".get_stylesheet_directory_uri()."/style.css' rel='stylesheet' type='text/css'>";
}
add_action( 'wp_head', 'add_stylesheet_to_head' );
Because wp-enqueue-style adds scripts/styles to the queue.
Registers the style if source provided (does NOT overwrite) and enqueues.
I have a main.css file in a css folder in a wordpress theme, it's called in functions.php the way below
wp_enqueue_style( 'td-main', THEME_WEB_ROOT . '/css/main.css' );
In my child theme I recreate a css folder at the same location than the parent, but it's not overwritten, here is my child theme functions.php
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));
}
add_action('wp_enqueue_scripts', 'theme_enqueue_styles');
I thaught it was enough to recreate the file in the child theme, but can't figure why it's not working.
Do I do something wrong ?