url("#{resource[...]}") in CSS files do not work in JSF 1.2

Question

I am trying to add font-awesome to a JSF 1.2 project.

I edited all fonts in the font-awesome css files to be like

@font-face {
    font-family: 'FontAwesome';
    src: url("#{resource['fonts/fontawesome-webfont.eot']}?v=4.3.0");
    src: url("#{resource['fonts/fontawesome-webfont.eot']}?#iefix&v=4.3.0")
        format('embedded-opentype'),
        url("#{resource['fonts/fontawesome-webfont.woff2']}?v=4.3.0") format('woff2'),
        url("#{resource['fonts/fontawesome-webfont.woff']}?v=4.3.0") format('woff'),
        url("#{resource['fonts/fontawesome-webfont.ttf']}?v=4.3.0")
        format('truetype'),
        url("#{resource['fonts/fontawesome-webfont.svg']}?v=4.3.0#fontawesomeregular")
        format('svg');
    font-weight: normal;
    font-style: normal
}

But it's not working. I did the same to a JSF 2.2 project and it's working fine. Am I accessing the resources folder correctly, and if yes, what could be the problem?

Answer 1

JSF 1.2 doesn't support <h:outputStylesheet> nor #{resource}. Those are JSF 2.x only.

Use <link> and hardcode the url() paths.

---

Beware: many many things were done differently and awkwardly in the jurassic JSF 1.x. If possible, migrate it to JSF 2.x as soon as possible. See also Migrating from JSF 1.2 to JSF 2.0. If not possible, make sure that you consult specifically JSF 1.x resources and not JSF 2.x ones while looking for answers.