how to add custom stylesheets to storefront child theme

  • Resolved keneso

    (@keneso)


    1 year ago

    Hi

    I’d like to load custom stylesheet to Storefront child theme. I don’t want to customize the css using the dashboard. I know I can add custom css to style.css, I want to be able to add my-custom.css and have it override (where needed) the parent’s styles.

    I have tried

    function afz_add_scripts_styles() {
	// register styles & scripts
	wp_register_style('afz-custom-style', get_theme_file_path('css/my-custom.css'));
	// enqueue our styles & scripts
	wp_enqueue_style('afz-custom-style');

add_action('wp_enqueue_scripts', 'afz_add_scripts_styles');

    also tried

    function afz_add_scripts_styles() {
	// register styles & scripts
	wp_register_style('afz-custom-style', get_template_directory_uri() . '/css/my-custom.css');
	// enqueue our styles & scripts
	wp_enqueue_style('afz-custom-style');

add_action('wp_enqueue_scripts', 'afz_add_scripts_styles');

    but neither work.

    What am I missing, or doing wrong?

    Thank you

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support Shameem R. a11n

    (@shameemreza)

    Hi @keneso

    From your code, it looks like you’re on the right track. However, you might be facing an issue because you’re trying to enqueue the styles in a child theme. When you’re working with a child theme, you should use get_stylesheet_directory_uri() instead of get_template_directory_uri().

    Detailed information can be found here: https://woo.com/document/set-up-and-use-a-child-theme/#section-10

    Although we don’t provide support for coding or customization as per our support policy, here’s how your code should look:

    function afz_add_scripts_styles() {
// Register styles & scripts
wp_register_style('afz-custom-style', get_stylesheet_directory_uri() . '/css/my-custom.css');
// Enqueue our styles & scripts
wp_enqueue_style('afz-custom-style');
}
add_action('wp_enqueue_scripts', 'afz_add_scripts_styles');

    If you still face any issues, we recommend asking development questions on the #developers channel of the WooCommerce Community Slack. Many of our developers hang out there and will be able to offer insights into your question.

    I wish I could help more, but hopefully, this gets you going in the right direction to get the job done.

    Thread Starter keneso

    (@keneso)

    Hi Shameem

    Thank you, got it working.

    I wish I could help more, but hopefully, this gets you going in the right direction to get the job done.

    You helped for as much as requested ??

    Plugin Support Shameem R. a11n

    (@shameemreza)

    Hi @keneso

    I am happy to hear this has helped. ??

    If it isn’t too much to ask for – would you mind leaving us a review here?
    https://www.ads-software.com/support/plugin/woocommerce/reviews/

    It only takes a couple of minutes but helps us tremendously. It would mean so much to us and would go a really long way.

    Feel free to create a new topic if you need further help with WooCommerce core.

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘how to add custom stylesheets to storefront child theme’ is closed to new replies.