Einsatz von Content Highlighting in Projekten
 |
Die "Content Highlighting"-Funktionalität wird ausschließlich in der integrierten Vorschau im FirstSpirit JavaClient unterstützt. Sie ist weder in der Vorschau - in einem externen Browser (z.B. Mozilla Firefox oder Microsoft Internet Explorer) noch - in einem separaten Fenster des JavaClient (Menü "Ansicht" / "Anzeigebereich der Vorschau" / "in separatem Fenster") verfügbar! |
Für die Content Highlighting-Funktionalität werden spezielle Formatvorlagen verwendet:
Diese sind bereits im Lieferumfang von FirstSpirit enthalten und befinden sich standardmäßig in der Vorlagen-Verwaltung im Ordner „WebClient Formatvorlagen (EasyEdit)“ unterhalb des Formatvorlagen-Knotens. Sie müssen an geeigneter Stelle in die Seiten-, Absatz- und/oder Tabellenvorlagen eingefügt werden, in denen das Content Highlighting verwendet werden soll, und zwar im HTML-Kanal. Dies geschieht über den Aufruf:
$CMS_RENDER(template:"BEZEICHNER_DER_FORMATVORLAGE")$
Die Definition der Umrandung wird mithilfe von 2 CSS-Klassen umgesetzt:
- fsPreview_default
und
- fsPreview_accentuated
Diese müssen in jedem Projekt, in dem Content Hightlighting eingesetzt werden soll, definiert sein. Dazu bieten sich die folgenden 3 Möglichkeiten:
- Einbinden eines Stylesheets: Die erforderlichen Klassen sind im Stylesheet "WE_css", das zum Lieferumfang von FirstSpirit gehört, enthalten. Es befindet sich standardmäßig in der Medien-Verwaltung im Ordner „WebClient Medien (EasyEdit)“ (Referenzname "WEBeditInplace").
Dieses Stylesheet wird in die Seitenvorlagen eingebunden, in denen das Content Highlighting verwendet werden soll:
<link href="$CMS_REF(media:"WE_css")$" rel="stylesheet" type="text/css"/> - Einbinden einer Render-Formatvorlage: Alternativ kann die Render-Formatvorlage WEBeditInplaceIncludeJS eingebunden werden. Soll gleichzeitig Easy-Edit verwendet werden, muss diese Formatvorlage verwendet werden:
$CMS_RENDER(template:"WEBeditInplaceIncludeJS")$ - CSS-Klassen selbst definieren: Bei Bedarf können die Klassen selbst in einem CSS-Stylesheet definiert werden.
Content Highlighting und Easy-Edit
Die für das Content Highlighting eingesetzten Formatvorlagen werden zum Teil auch für Easy-Edit verwendet. Funktion und Konfiguration weichen teilweise jedoch erheblich voneinander ab. Hinweise zur gemeinsamen Verwendung von Easy-Edit und Content Highlighting in Seiten-, Absatz- und Tabellenvorlagen befinden sich in der Beschreibung der einzelnen Formatvorlagen.
|
Die Java-Script-Funktionen von Easy-Edit werden NICHT verwendet. |
|
Bei gleichzeitiger Verwendung von Easy-Edit sollte geprüft werden, dass das Layout der Seiten sowohl in der Integrierten Vorschau als auch in der Easy-Edit-Ansicht einwandfrei ist. |
Auswahl der Vorschauseite
Zu jeder Vorlage kann im Register "Eigenschaften" über das Feld "Vorschau Seite" ausgewählt werden, auf welcher Seitenreferenz eine Vorschau basieren soll.
Für die Hervorhebung von Datensätzen aus der Datenquellen-Verwaltung ist die Wahl einer entsprechenden Vorschauseite in der zugehörigen Tabellenvorlage relevant. Auf diese Weise wird festgelegt, welche Seitenreferenz als Basis für eine Datensatzvorschau aus der Datenquellen-Verwaltung dienen soll. Obwohl ein Datensatz auf mehreren Seiten eines Projekts ausgegeben werden können, kann hier nur eine Seitenreferenz festgelegt werden, in deren Kontext ein Datensatz aus der Datenquellen-Verwaltung ausgegeben werden.
Die Wahl der Vorschauseite muss bei allen Vorlagen, die dieselbe Datenquelle verwenden, berücksichtigt werden.
Allgemeine Hinweise zur Vorlagenentwicklung für das Content Highlighting
Sind in Eingabekomponenten in Seiten, Absätzen oder Datensätzen im Arbeitsbereich noch keine Inhalte vorhanden, kann keine Hervorhebung durchgeführt werden. Daher ist es ratsam, bei der Verwendung der Render-Formatvorlagen
zu prüfen, ob die Ausgabe nicht leer ist.
Dies kann beispielsweise über die Verwendung der Methode .isEmpty in Kombination mit $CMS_IF(...)$ geprüft werden:
$CMS_IF(!BEZEICHNER.isEmpty)$
$CMS_VALUE(BEZEICHNER)$
$CMS_END_IF$