Das Paket „Accessibility“ enthält diverse Module, mit denen Sie die Zugänglichkeit der Inhalte Ihrer Website für bestimmte Personengruppen erhöhen können. Zu diesen Personen zählen Nutzer, die in ihrer Sinneswahrnehmung bspw. durch Behinderungen eingeschränkt sind.
Zurzeit enthält dieses Paket die Boxmodule „Page Zoom CSS Output“ sowie „Page Zoom Links“, mit denen Nutzer über Links den Schriftgrad dynamisch anpassen können. Sie ermöglichen Nutzern die Schrift zu vergrößern, zu verkleinern oder auf die Standardgröße zurückzustellen.
Die dynamische Schriftgrößenanpassung wird dadurch erreicht, dass speziell angepasster CSS-Code in entsprechende Bereiche des HTML-Headers der Seiten eingebunden wird. Damit also die Schriftgrößenanpassung erfolgreich sein kann, müssen Sie Anpassungen am zentralen XSLT-Stylesheet Ihrer Website durchführen.
| Damit Sie diese Funktionen nutzen können, müssen Sie das Template ändern. Sie benötigen also auch Zugriffsrechte auf die Templatedateien. Zudem ist es notwendig, dass Sie über entsprechende Kenntnisse in XSLT verfügen. |
![[]](images/tip.png)
Das Boxmodul „Page Zoom CSS Output“ gibt dynamisch erstellten CSS-Code aus, der die Schriftgröße auf den Standardwert festlegt. Wenn Nutzer auf die Links zur Schriftgrößenanpassung klicken (das Boxmodul „Page Zoom Links“), wird die Schriftgröße entsprechend vergrößert oder verkleinert.
Damit der CSS-Code an die richtige Stelle in der Seitenausgabe gelangt, sind zwei Schritte notwendig:
Sie müssen im zentralen XSLT-Template einen Bereich im
<head>-Element definieren, in dem die Boxausgabe des Moduls „Page Zoom CSS Output“ eingefügt wird.Sie müssen in der Boxenverwaltung eine Gruppe anlegen, welche genau diesem Bereich im XSLT-Template zugeordnet wird.
Template anpassen
Im folgenden Beispiel soll anhand der zentralen XSLT-Templatedatei aus dem Demotemplate gezeigt werden, wie Sie den Boxbereich für das Modul „Page Zoom CSS Output“ definieren können:
Beispiel 8.1. CSS-Ausgabe der „Page Zoom“-Box in
page_general.xsl einbinden
... <xsl:template match="page"> <html> <head> ... <xsl:call-template name="cssfiles"/> <xsl:for-each select="boxes/box[@group = 'head']"> <xsl:value-of select="." disable-output-escaping="yes"/> </xsl:for-each> ...
In den Zeilen 7 ‒ 9 befindet sich der Bereich, in dem die Ausgabe
der Boxen aus der Gruppe „head“ in den <head>-Bereich
eingebunden werden. Sie müssen darauf achten, dass nach diesem Bereich
keine weiteren CSS-Dateien eingebunden werden. Dadurch verhindern Sie,
dass die Schriftgrößenänderungen der Box durch nachfolgende CSS-Angaben
ggf. überschrieben werden.
Sie brauchen bei der Anbindung der CSS-Box keine <style>-Tags anzulegen, da diese bereits in der Modulausgabe der CSS-Box enthalten sind. Näheres zur Bearbeitung der XSLT-Templates erfahren Sie im Handbuch „papaya CMS: Templates und Themes erstellen“.
Gruppe für die CSS-Box anlegen
Wenn Sie sich an die Vorgabe aus Beispiel 8.1, „CSS-Ausgabe der „Page Zoom“-Box in
page_general.xsl einbinden“ gehalten haben, können Sie in
der Boxenverwaltung eine Gruppe mit folgenden Eigenschaften
anlegen:
Geben Sie in das Feld „Name“ den Wert „head“ ein.
Geben Sie in das Feld „Titel“ einen Titel für die Gruppe an. Der Titel sollte darauf hinweisen, dass in diese Gruppe nur Boxen angelegt werden dürfen, die Ausgaben für den
<head>-Bereich generieren.
Die folgende Abbildung zeigt die Eingabemaske „Eigenschaften“ der Gruppe „Headbereich“, die für die Box mit der CSS-Ausgabe angelegt worden ist:
Ansicht auswählen
Details zur Eingabemaske „Inhalt bearbeiten“
Tabelle 8.14. Eingabefelder des Moduls „Page Zoom Links“
| Feldbeschriftung | Bedeutung |
|---|---|
| Schriftgröße Standard | Schriftgröße, die standardmäßig ausgegeben wird. |
| Schriftgröße Minimum | Minimale Schriftgröße in em. |
| Schriftgröße Maximum | Maximale Schriftgröße in em. |
Suche