Multiple CSS sheets and Absolute Paths

  • gshiga

    (@gshiga)


    16 years, 12 months ago

    I am in the process of integrating a WP blog into an existing website. I have a few questions as to proper directory structure and how to add multiple css sheets to one page. I’ve reviewed the Codex and forum, and I would appreciate any help.

    First Q: My website currently imports multiple css style sheets by linking (<link rel=”stylesheet” type=”text/css” title=”Import Style Sheet” href=”css/import.css”>) to a style sheet that imports multiple css sheets via the @import url(xyz.css). Is it possible to do the same in WordPress? If so, what is the proper way to do that?

    Second Q: My WP blog is installed in a subdirectory of my website (http://www.example.com/blog). Do all of my blog related files (images, css style sheets, java script, etc.) need to be contained in the same subdirectory as my blog, or can I link to them with absolute paths? For example, all of the images for my website are contained at http://www.example.com/images. Can I use the same images in my WordPress blog (via absolute paths) or do I need to make a copy of the folder and move it into a folder within my blog subdirectory? If I can use absolute paths, can you also show me the correct format to do that?

    Thank you in advance for any help.

Viewing 4 replies - 1 through 4 (of 4 total)
  • esmi

    (@esmi)

    16 years, 12 months ago

    1. Use the same approach but replace css/import.css with <?php bloginfo('stylesheet_url'); ?> and import all of your sheets in your theme’s style.css file.

    2. The usual approach is to create an images sub-directory in your theme folder and then call images in CSS using url(images/foobar.jpg). I’d also suggest placing all js scripts in your theme folder and then call them using <script src="<?php bloginfo('template_directory'); ?>/examples.js" type="text/javascript"></script>. Your CSS sheets ideally should all reside in the themes folder itself. It’s mandatory to at least have style.css in this folder.

    Thread Starter gshiga

    (@gshiga)

    16 years, 12 months ago

    Thank you, Esmi!

    I usually like to separate folders for css, images, js, etc. Thus, can I use your suggested method, but place my js in a sub-directory of my theme folder, as follows: <script src=”<?php bloginfo(‘template_directory’); ?>js_folder/examples.js” type=”text/javascript”></script>.

    Or, is it mandatory to place js in main theme folder (and not a sub-directory).

    Thanks again for your help.

    esmi

    (@esmi)

    16 years, 12 months ago

    No – there’s no mandatory placement for js scripts. The only mandatory placement is for the theme template files, functions.php and style.css.

    Thread Starter gshiga

    (@gshiga)

    16 years, 12 months ago

    Thanks for the quick reply. I’m looking forward to giving it a try!

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Multiple CSS sheets and Absolute Paths’ is closed to new replies.