0

I have just started using wordpress again, after a long delay and cannot remember if I am putting the css in the child theme correctly. I placed a tiny piece of css code to display. I have put it in the style.css in the child theme, but it will not show. I have created the child theme with the Astra generator, so it must be correct.

/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/



#header { color: blue;
}

the functions.php file is as follows:

<?php
/**
 * Astra Child Theme functions and definitions
 *
 * @link https://developer.wordpress.org/themes/basics/theme-functions/
 *
 * @package Astra Child
 * @since 1.0.0
 */

/**
 * Define Constants
 */
define( 'CHILD_THEME_ASTRA_CHILD_VERSION', '1.0.0' );

/**
 * Enqueue styles
 */
function child_enqueue_styles() {

    wp_enqueue_style( 'astra-child-theme-css', get_stylesheet_directory_uri() . '/style.css', array('astra-theme-css'), CHILD_THEME_ASTRA_CHILD_VERSION, 'all' );

}

add_action( 'wp_enqueue_scripts', 'child_enqueue_styles', 15 );
8
  • 1
    If you use the browser tools to inspect the id="header" element, do you see your rules? They might not be applied because other rules' selectors are more precise than yours.
    – kero
    Dec 14, 2021 at 16:39
  • I tried adding just h1 { color: blue } then <h1> tag in the text heading. That does not work either. Dec 14, 2021 at 18:36
  • If you're sure your styles are specific enough to apply, you may be running into a caching issue. Viewing your page source and searching for your child theme's stylesheet name should tell you whether or not the CSS file is being enqueued as expected, and if you then open that CSS file to check whether your updated styles are there, that will tell you whether they are cached.
    – WebElaine
    Dec 14, 2021 at 19:17
  • I don't see the child theme stylesheet name in the source. Only see <script src=webyardcraft.local/wp-content/themes/astra/assets/js/minified/… id="astra-theme-js-js"></scripts> I have gone to more tools and cleared the browsing data, is that what you mean, when you say cached. The css is output is still not showing. Could it may be because I pasted my content from a text editor like notepad++. Pasted the content into wordpress. It is enqueued correctly as above from the astra generator. Dec 15, 2021 at 4:47
  • @SpencerHalstead Do you see the <link> for astra's main CSS? Can you share (by editing the question) how it looks?
    – kero
    Dec 15, 2021 at 9:47

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Browse other questions tagged or ask your own question.