I'm building a wp child theme of ThemeGrill's ColorMag. When I load the page, my child theme css file is loaded, but there is also a file called style.css?ver=5.3.2 loaded after it. When I look at the code under elements in the dev tools, it appears to be a cached version of my style.css file.
I've deleted the child theme folder and reuploaded all of my files but I see the same result. I also have wp-cache level set to 0
Also I should note, I'm new to wp and couldn't figure out how to enqueue the child theme properly, so style.css is loaded via an href in my header.php. my functions.php looks like this:
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
Again, I'm new so any best practices you have would be much appreciated!
Site is here.
Related
I'm creating a child theme for an active template. have this code in functions.php file at child folder.
<?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}
?>
but some of js and css files of a plugin named lightgallery haven't loaded when child theme is active. and has 404 error at console. the url of 404 is like this:
wp-
content/themes/sampletheme-child/assets/plugins/LightGallery/assets/css/lightgalle
ry.css
I haven't such a folder in child theme and it is searching it in child theme.I don't know why it doesn't read it from parent theme.
what should I do to load this files?
--ps: another issue is when the child theme is activated the theme is ltr. and the style is not perfect, although the main styles of the themplate has been loaded and I didn't found any rtl style at parent theme. but in parent style every thing is fine and rtl.
really hoping someone can please help me! I just updated the Divi parent theme on my Wordpress site (www.ellymacdonalddesign.com), and the child CSS theme seems to have stopped working.
I've tried the solutions from this question, but they do not seem to work for me:
Wordpress child theme style.css not working
My child functions.php file is currently:
<?php
function my_theme_enqueue_styles() {
$parent_style = 'divi-style';
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( $child-style, get_stylesheet_uri() );
}
?>
Would really appreciate any guidance please, thank you in advance,
Elly
Is your variable $child-style have any value? According to document, the handle name (first parameter) is required. That's why your child theme still not working.
Try below code to see if it's work:
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
$parent_style = 'divi-style';
$child_style = 'divi-style-child';
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( $child_style, get_stylesheet_uri() );
}
Changing the css child theme version number helped solve the problem on my website.
My child theme was working correctly until I decided to change some css rules in the style.css file from the Wordpress 'Theme Editor' interface. I remarked that no changes appeared on the website, although the css was obviously loaded in the header and also I purged all cache.
I tried solutions of the following question but I think this is for new child theme installation, not an already working one: Wordpress child theme style.css not working
I decided to change the version number of my child theme, and the modifications were finally taken into account.
/*
Theme Name: Chromatic-child
Template: chromatic
Version: 1.1.0
*/
I made a child theme for 'Square Theme' in Wordpress and my 'functions.php' code in my child theme looks like this:
<?php
function square_child_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', 'square_child_enqueue_styles' );
?>
The thing is, I also want to edit another css file, that its path in the parent theme is "/css/owl.carousel.css".
So, should I create an "owl.carousel.css" file in my child theme too? And also, which code should I add to my child-theme's "functions.php"?
Depends whether that owl css is loaded in the child theme too and what you mean by 'edit'. Child theme normally inherits all the parent php template files, and the parent functions.php but not the base css. So normally one has to enqueue the parent css if one wants to use it. I imagine in this case if it's not the main css it might be being loaded anyway? (View source to check)
1) If you don't want it at all, you could use wp_dequeue_style to get rid of it.
or
2) if by 'edit' you mean you just want to make minor modifications, you could add those minor mods to override the owl css in your own stylesheet.
I'm having so much trouble setting up a child theme of the html5blank theme. To the point where I'm doing a fresh install of the parent theme and starting from scratch - and writing this post as I go through it! Basically upon creating the child them I now need to load my custom /css/main.css file - and it's not having it! Description of setup process follows:
I've dropped a freshly downloaded html5blank folder into /themes/ and activated it. After that I have created another folder within /themes/ called "html5blank-child". Within that I've created a new, blank style.css and functions.php.
Within style.css I have the following:
/*
Theme Name: HTML5 Blank Child
Theme URI: http://example.com/twenty-fifteen-child/
Description: HTML5 Blank Child Theme
Author: My Name
Author URI: http://myportfolio.com
Template: html5blank
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: html5blank-child
*/
And within functions.php I have:
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
?>
With all that done, I active my child theme. With all that done, everything still appears to be working. As I've created static templates of the website, I drop my 'img', 'css', 'font' and 'js' folders into the html5blank-child.
Now my 'actual' CSS file has a path of: html5blank-child/css/main.css
I need to load this file in. I was told to adjust my functions.php CSS path to: /css/main.css ...but it won't load the file at all. I've also tried using get_stylesheet_directory_uri() instead of get_template_directory_uri() as was advised by someone else but no luck!
The reason I've documented the process like this is, last time I got to this point if I went to access the Wordpress admin using http://localhost:8888/websitename/admin it won't redirect to wp-admin like it normally does. Also when I went to save a post, I've get a blank page. Thankfully that isn't happening this time so I guess it's a good (better) start but now I need to get my files loaded in.
Hope someone can help! :)
You need to import the style.css from main theme first inside the style.css of the child theme.
Use #import to import the css file first.
Also remove the parent-style from functions.php of child theme and then include your html5blank-child/css/main.css like the following given,
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'child-main', get_stylesheet_directory_uri() . '/css/main.css' );
}
Load the parent themes style.css first, then load your child themes CSS like this:
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-main', get_stylesheet_directory_uri() . '/css/main.css', array('parent-style') );
}
This is probably easy but I just want to make sure I'm doing it correctly. Basically I've been making a bunch of Wordpress sites using child themes and usually the style.css is in the root folder of the theme and I've been using this in my functions.php file
<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
While this file exists in the parent theme I'm using, it's blank and I realized the CSS file being used was a different file name and nested in
\THEME-NAME\framework\css\site\stacks\THEME-CSS.css as opposed to just
THEME-NAME\style.css
So for the child theme do I have to recreate that folder structure and place a same named THEME-CSS.css in the same folder or do I just call it style.css and put it in the child themes root folder like it normally would be? Any other advice would be helpful. Thanks.
To add a stylesheet when in a child theme, these are the two options/behaviors:
// This will point to style.css in child theme
wp_enqueue_style( 'my_child_styles', get_stylesheet_directory_uri().'/style.css' );
// This will point to style.css in the parent theme
wp_enqueue_style( 'my_parent_styles', get_template_directory_uri().'/style.css' );
As you said, when using get_template_directory_uri() the path will always point to the parent theme folder. Use get_stylesheet_directory_uri() to point to the current / child theme folder, if applicable.