Injizieren zusätzliche stylesheets (oder Skripte) in Facelets-template-client

Habe ich folgende master-template-Datei für meine JSF-basierten Seiten :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
   xmlns:ui="http://java.sun.com/jsf/facelets"
   xmlns:h="http://java.sun.com/jsf/html"
   xmlns:f="http://java.sun.com/jsf/core"
   xmlns:p="http://primefaces.org/ui">
<h:head>
   <title><ui:insert name="title">MyApp</ui:insert></title>
   <h:outputStylesheet name="stylesheet.css" library="styles"/>
</h:head>

<h:body>

   <div id="container">
      <div id="header">
         <ui:insert name="header">
            //header content
         </ui:insert>
      </div>

      <div id="content">
         <ui:insert name="content">
         </ui:insert>
      </div>

      <div id="footer">
         <ui:insert name="footer">
         </ui:insert>
      </div>
   </div>
</h:body>

</html>

In den head-Abschnitt haben wir stylesheet.css. Dieses stylesheet enthält alle meine Globale Stile, die gemeinsam sind zu allen Seiten.

In der template-client, den ich möchte hinzufügen, Seite bestimmte stylesheet. So, ich habe versucht, das hinzufügen der folgenden Zeile in meinem template-client-Seite:

<ui:composition template="/pages/templates/template.xhtml">
   <ui:define name="content">
      <h:outputStylesheet name="indexPage.css" library="styles" target="head"/>

      //body content

</ui:composition>

Diese, jedoch, scheint nicht hinzufügen indexPage.css im generierten HTML-head-Bereich.

Ich bin mit Mojarra 2.1.2. Unterstützt es die target - Attribut? Ich sehe es nicht aufgeführt als einer der in meinem autosuggest-Optionen in Eclipse.

Falls nicht, wie bekomme ich Spritzen die zusätzliche Seite spezifische CSS-während immer noch mit Vorlagen?

  • Funktioniert gut für mich. Das output-stylesheet kann nicht umgeleitet werden können, an anderer Stelle (als nicht Gültiger HTML-Code). Es wird am Ende immer im HTML-Kopf. So target Attribut ist in der Tat überflüssig im output-stylesheet. Der output-script kann umgeleitet werden (entweder Kopf oder inline oder Ende des Körpers).
  • Bitte prüfen Sie Ihren code. Dieses Konstrukt wird nicht die Art und Weise wie du Sie beschrieben hast (also nicht am Ende als <link> überall in der HTML -<head>), wenn die <h:outputStylesheet> ist nicht eingeschlossen in einem gültigen <ui:define>.
InformationsquelleAutor Vrushank | 2012-11-09
  1. 9

    Hinzufügen, um Ihre master-template-Datei in head Abschnitt neue Vorlage Inhalten speziell für css - Dateien verknüpfen von:

    <h:head>
   <title><ui:insert name="title">MyApp</ui:insert></title>
   <h:outputStylesheet name="stylesheet.css" library="styles"/>
   <ui:insert name="css"/>
</h:head>

    In der Vorlage client-Seite hinzufügen-Seite spezifische stylesheet wie dieses:

    <ui:composition template="/pages/templates/template.xhtml">
   <ui:define name="css">
      <h:outputStylesheet name="indexPage.css" library="styles"/>
   </ui:define>
   ...
</ui:composition>

    Statt h:outputStylesheet konnten verwendet werden <link type="text/css" href="relative path to css file">.
    Wichtig ist, dass ui:insert für css im master-template sollte drin sein h:head.

    • Beachten Sie, dass dies im Grunde, was target="head" bereits tut.
    • tag h:outputStylesheet nicht über das Attribut Ziel in jsf 2.1 (noch funktioniert, obwohl angegeben)
    • Es ist die Feste Voreinstellung schon. Siehe auch 1. Kommentar auf die Frage.
    InformationsquelleAutor Oleksandr Tsurika
  2. 0

    Ich hatte gerade ein ähnliches problem und ein Freund hat mir geholfen.
    Die Lösung war der import der css im subheader von ui:composition

    <ui:composition
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui"
    template="/template.xhtml"
>
    <ui:define name="subheader">
        <h:outputStylesheet library="css" name="my-style.css" />
    </ui:define>

    <ui:define name="content">
    </ui:define>
    </ui:composition>
    InformationsquelleAutor Adriano Rapussi
Schreibe einen Kommentar