Problem loading css files in some templates

Question

I´m having problems loading css files in some templates.

Hi have this to load css files:

{% includeCssFile "assets/html/css/reset.css" %}
{% includeCssFile "assets/html/css/general.css" %}
{% includeCssFile "assets/html/css/typography.css" %}
{% includeCssFile "assets/html/css/layout.css" %}
{% includeCssFile "assets/html/css/formStyle.css" %}
{% includeCssFile "assets/html/rs-plugin/css/settings.css" %}
{% includeCssFile "assets/html/css/slidestyle.css" %}
{{ getHeadHtml() }}

This follows this path: http://localhost/craft/assets/html/css/filename.css

It works great , and load the styles for example, in the news section. But, when i go to que news detail section, the styles don´t show.

The news detail template extends the template layout used for the home page and other sections.

The page looks for styles in this path: http://localhost/craft/news/assets/html/css/filename.css and of course don´t find it.

I try with routes ( don´t know exacly how it works , but try and didn´t work ).

Help! :)

Thanks. Sebastian.

Aaron Berkowitz · Accepted Answer · 2015-04-07T19:47:30.637

3

You will want to include the siteUrl variable before the file path to normalize all the resource URLs. That will also help when you move to production. For example:

{% includeCssFile siteUrl~'assets/html/css/slidestyle.css' %}

In your general config file, you can set different site URLs based on the server you are on.

return array(
    '*' => array(),

    'localhost => array(
        'devMode' => true,
        'siteUrl' => 'http://localhost/craft/'
    ),
    'yourProductionDomain.com' => array(
        'devMode' => false,
        'siteUrl' => 'http://www.yourProductionDomain.com'    
    ),
);

edited Apr 07 '15 at 19:47

answered Apr 07 '15 at 19:40

Aaron Berkowitz

3,819
10
20

Thanks for your reply and solution, works like a charm! I´m just starting using craft in a local test site, and i think it´s awesome! I will implement it in my next project. One more question ( excuse me, but at this step all that i have are questions :) ) , is there a good tutorial about making a general site navigation? I mean, list sections, news section, single... Thank you Aaron! – Sebachenko Apr 07 '15 at 22:36
Sure thing, @Sebachenko! Can you go ahead and select the response as the answer? As for navigations, I'm not sure of any tutorials. There are a few plugins that help, like https://github.com/am-impact/amnav. More plugins can be found here: http://straightupcraft.com/craft-plugins – Aaron Berkowitz Apr 07 '15 at 23:50
1

You might have a look at this answer which is one common strategy to generate site nav, integrating singles, channels, and structures. And here is a list of some of various tutorial and resource sites that are available. – Douglas McDonald Apr 07 '15 at 23:52
Done! Thanks Aaron and Douglas for your response! I will check your links. – Sebachenko Apr 14 '15 at 00:28

Problem loading css files in some templates

1 Answers1