WordPress.org

Forums

Creating a theme, wp_enqueue_style for second stylesheet problems (6 posts)

  1. smoker450
    Member
    Posted 8 months ago #

    I am trying to create a theme, I can see that the stylesheet is registered when I view source of the page, but it doesn't active when I drag the browser window to be smaller than 1370px. what am I missing?

    http://custom.creativeonlinestrategies.biz/

    function gm_resources() {
    
    	wp_enqueue_style('style', get_stylesheet_uri());
    
    	wp_register_style ('secondary', get_stylesheet_uri(), 'all and (max-width: 1370px)' );
    	wp_enqueue_style ('secondary', get_stylesheet_uri(), 'all and (max-width: 1370px)' );
    
    }
  2. Hey there,

    The first enqueue you fed it a url to the stylesheets, the next two you fed it a url and then some css ($media) rather than an array which is what the function expects as it's third argument.

    Did you read through the pages here:

    http://codex.wordpress.org/Function_Reference/wp_enqueue_style
    http://codex.wordpress.org/Function_Reference/wp_register_style

    They're the two functions you're trying to use there.

    Zac also gives an example you can take a look at:

    http://wp.zacgordon.com/adding-css-to-wordpress-theme-via-functions-php-file/

    And this:

    http://wordpress.org/support/topic/media-query-enqueue-conditional-css-stylesheets

    Hope this helps.

  3. stephencottontail
    Member
    Posted 8 months ago #

    Technically, you don't need to call wp_register_style(), so you can omit that line if desired. You've got the arguments to wp_enqueue_style() in the wrong order; the $media argument is listed as the fifth argument to the function, so it must be the fifth argument when calling the function, even if others are marked as optional. You should call it like this:

    wp_enqueue_style( 'secondary', get_stylesheet_uri(), null, null, 'all and (max-width: 1370px)' );

    However, I'm not sure you're going to get what you want, even if you call the function correctly. Both calls to wp_enqueue_style() are enqueueing the same stylesheet. You could instead write:

    @media screen and (max-width: 1370px) {
       ... CSS rules ...
    }

    in your main stylesheet and save an HTTP request.

  4. WP Sites - Brad Dalton
    Member
    Posted 8 months ago #

    Use get_template_directory_uri() for parent themes.

    function wpsites_custom_style_sheet() {
    wp_enqueue_style( 'custom-styling', get_template_directory_uri() . '/custom.css' );
    }
    add_action('wp_enqueue_scripts', 'wpsites_custom_style_sheet');

    For child themes, use this

  5. smoker450
    Member
    Posted 8 months ago #

    thanks greatly for the help. I apologize for not understanding, but this is my first attempt and creating a theme and I feel like I'm going in circles.

    this is my code now and as stephencottontail predicted, it's not working.

    // Get stylesheets and scripts
    function gm_resources() {
    
    	wp_enqueue_style('style', get_stylesheet_uri());
    	wp_enqueue_style ('secondary', get_stylesheet_uri() . '/styles/secondary.css', null, null, 'screen and (min-width: 1370px)' );
    }
    
    add_action('wp_enqueue_scripts', 'gm_resources');

    so, what do I need to do to make that 'secondary' style sheet work?

  6. stephencottontail
    Member
    Posted 8 months ago #

    You need to use get_template_directory_uri() instead of get_stylesheet_uri():

    wp_enqueue_style ('secondary', get_template_directory_uri() . '/styles/secondary.css', null, null, 'screen and (min-width: 1370px)' );

Reply

You must log in to post.

About this Topic