Konfigurieren der Rich-Text-Editor-Plug-ins configure-the-rich-text-editor-plug-ins
RTE-Funktionen werden über eine Reihe von Plug-ins mit jeweils einer Eigenschaft „Funktionen“ bereitgestellt. Sie können die features-Eigenschaft so konfigurieren, dass mindestens eine RTE-Funktion aktiviert oder deaktiviert wird. In diesem Artikel wird beschrieben, wie Sie die RTE-Plug-ins spezifisch konfigurieren.
Weitere Informationen zu den anderen RTE-Konfigurationen finden Sie unter Konfigurieren des Rich-Text-Editors.
Aktivieren von Plug-ins und Konfigurieren der Eigenschaft „features“ activateplugin
Gehen Sie wie folgt vor, um ein Plug-in zu aktivieren. Einige Schritte sind nur erforderlich, wenn Sie ein Plug-in zum ersten Mal konfigurieren, da die entsprechenden Knoten noch nicht vorhanden sind.
Standardmäßig sind die Plug-ins format
, link
, list
, justify
und control
sowie alle ihre Funktionen im RTE aktiviert.
rtePlugins
wird als <rtePlugins-node>
bezeichnet, um Dopplungen in diesem Artikel zu vermeiden.-
Suchen Sie mithilfe von CRXDE Lite nach der Textkomponente für Ihr Projekt.
-
Falls noch nicht vorhanden, erstellen Sie den übergeordneten Knoten von
<rtePlugins-node>
, bevor Sie mit dem Konfigurieren von RTE-Plug-ins beginnen:-
Abhängig von Ihrer Komponente sind die übergeordneten Knoten:
config: .../text/cq:editConfig/cq:inplaceEditing/config
- ein alternativer Konfigurationsknoten:
.../text/cq:editConfig/cq:inplaceEditing/inplaceEditingTextConfig
text: .../text/dialog/items/tab1/items/text
-
Sie weisen den folgenden Typ auf: jcr:primaryType
cq:Widget
-
Beide haben die folgenden Eigenschaften:
- Name
name
- Typ
String
- Wert
./text
- Name
-
-
Erstellen Sie je nach Benutzeroberfläche, für die Sie konfigurieren, einen Knoten
<rtePlugins-node>
, falls sie nicht vorhanden ist:- Name
rtePlugins
- Typ
nt:unstructured
- Name
-
Erstellen Sie darunter einen Knoten für jedes Plug-in, das Sie aktivieren möchten:
- Typ
nt:unstructured
- Name: die Plug-in-ID des erforderlichen Plug-ins
- Typ
Halten Sie sich nach der Aktivierung eines Plug-ins an diese Richtlinien, um die Eigenschaft features
zu konfigurieren.
*
(ein Sternchen)Grundlegendes zum findreplace-Plug-in findreplace
Das findreplace
-Plug-in (Suchen und Ersetzen) erfordert keine Konfiguration. Es ist vorkonfiguriert und sofort einsatzfähig.
Bei Verwendung der Funktion zum Ersetzen sollte die Zeichenfolge zum Ersetzen gleichzeitig mit der Suchzeichenfolge eingegeben werden. Sie können jedoch weiterhin auf „Suchen“ klicken, um nach der Zeichenfolge zu suchen, bevor Sie sie ersetzen. Wenn die Zeichenfolge zum Ersetzen eingegeben wird, nachdem auf „Suchen“ geklickt wurde, wird die Suche auf den Anfang des Textes zurückgesetzt.
Das Dialogfeld „Suchen und ersetzen“ wird transparent, wenn auf „Suchen“ geklickt wird, und undurchsichtig, wenn auf „Ersetzen“ geklickt wird. Auf diese Weise kann der Autor den Text überprüfen, den der Autor ersetzt. Wenn der/die Benutzende auf „Alle ersetzen“ klickt, wird das Dialogfeld geschlossen und die Anzahl der vorgenommenen Ersetzungen angezeigt.
Konfigurieren der Einfügemodi paste-modes
Bei Verwendung von RTE können Autorinnen und Autoren Inhalte in einem der folgenden drei Modi einfügen:
-
Browser-Modus: Fügen Sie Text mithilfe der standardmäßigen Implementierung von „Einfügen“ des Browsers ein. Dieses Verfahren wird nicht empfohlen, da es unerwünschte Markups verursachen kann.
-
Klartextmodus: Fügen Sie Inhalte aus der Zwischenablage als Text ein. Dadurch werden alle Stil- und Formatierungselemente vom kopierten Inhalt entfernt, bevor er in eine Komponente von Experience Manager eingefügt wird.
-
MS® Word-Modus: Einfügen des Texts, einschließlich Tabellen, mit Formatierung beim Kopieren aus MS® Word. Das Kopieren und Einfügen von Text aus einer anderen Quelle, z. B. einer Webseite oder MS® Excel, wird nicht unterstützt und behält nur eine teilweise Formatierung bei.
Konfigurieren der in der RTE-Symbolleiste verfügbaren Einfüge-Optionen configure-paste-options-available-on-the-rte-toolbar
Sie können Ihren Autoren in der RTE-Symbolleiste nur einige, alle oder keine dieser drei Symbole zur Verfügung stellen:
-
Einfügen (STRG+V): Kann vorkonfiguriert werden, um einem der drei obigen Einfügemodi zu entsprechen.
-
Als Text einfügen: Bietet Funktionen im Klartextmodus.
-
Aus Word einfügen: Bietet MS® Word-Modus-Funktionalität.
Um die Anzeige der Symbole in RTE zu konfigurieren, führen Sie folgende Schritte aus.
- Navigieren Sie zu Ihrer Komponente, z. B.
/apps/<myProject>/components/text
. - Navigieren Sie zum Knoten
rtePlugins/edit
. Lesen Sie die Informationen unter Aktivieren von Plug-ins, falls noch kein Knoten vorhanden ist. - Erstellen Sie die Eigenschaft
features
im Knotenedit
und fügen Sie eine oder mehrere Funktionen hinzu. Speichern Sie alle Änderungen.
Verhalten des Symbols bzw. der Tastenkombination „Einfügen (STRG+V)“ konfigurieren configure-the-behavior-of-the-paste-ctrl-v-icon-and-shortcut
Sie können das Verhalten des Symbols Einfügen (Strg+V) mit den folgenden Schritten vorkonfigurieren. Diese Konfiguration definiert auch das Verhalten des Tastaturbefehls Strg+V, den Autorinnen und Autoren zum Einfügen von Inhalten verwenden.
Die Konfiguration ermöglicht die folgenden drei Arten von Anwendungsfällen:
-
Fügen Sie Text mithilfe der standardmäßigen Implementierung des Browsers zum Einfügen ein. Dieses Verfahren wird nicht empfohlen, da es unerwünschte Markups verursachen kann. Konfiguriert mithilfe von
browser
, wie unten gezeigt. -
Fügen Sie den Inhalt aus der Zwischenablage als Text ein. Dadurch werden alle Stil- und Formatierungselemente vom kopierten Inhalt entfernt, bevor er in eine AEM-Komponente eingefügt wird. Konfiguriert mithilfe von
plaintext
, wie unten gezeigt. -
Fügen Sie beim Kopieren aus MS® Word den Text einschließlich der Tabellen mit Formatierung ein. Das Kopieren und Einfügen von Text aus einer anderen Quelle, z. B. einer Webseite oder MS® Excel, wird nicht unterstützt und behält nur eine teilweise Formatierung bei. Konfiguriert mithilfe von
wordhtml
, wie unten gezeigt.
-
Navigieren Sie in Ihrer Komponente zum Knoten
<rtePlugins-node>/edit
. Erstellen Sie die Knoten, wenn diese nicht vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
In der
edit
Knoten erstellen Sie eine Eigenschaft mit den folgenden Details:- Name
defaultPasteMode
- Typ
String
- Wert: einer der erforderlichen Einfügemodi
browser
,plaintext
oderwordhtml
.
- Name
Konfigurieren der beim Einfügen von Inhalten zulässigen Formate pasteformats
Paste-as-Microsoft-Word (paste-wordhtml
)-Modus kann weiter konfiguriert werden, sodass Sie explizit definieren können, welche Stile zulässig sind, wenn Sie AEM aus einem anderen Programm wie Microsoft® Word einfügen.
Sollen beim Einfügen von Inhalten in AEM zum Beispiel nur fett gedruckte Formate und Listen zulässig sein, können Sie die anderen Formate herausfiltern. Dieser Vorgang wird als konfigurierbare Filterung beim Einfügen bezeichnet, die für Folgendes verwendet werden kann:
Für Links können Sie zudem die Protokolle definieren, die automatisch akzeptiert werden.
So konfigurieren Sie, welche Formate beim Einfügen von Text in AEM von einem anderen Programm aus zulässig sind:
-
Navigieren Sie in Ihrer Komponente zum Knoten
<rtePlugins-node>/edit
. Erstellen Sie die Knoten, wenn diese nicht vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Erstellen Sie einen Knoten unter dem Knoten .
edit
Knoten, um die Regeln zum Einfügen von HTML beizubehalten:- Name
htmlPasteRules
- Typ
nt:unstructured
- Name
-
Erstellen Sie einen Knoten unter
htmlPasteRules
, damit Sie Details zu den zulässigen grundlegenden Formaten speichern können:- Name
allowBasics
- Typ
nt:unstructured
- Name
-
Erstellen Sie zur Steuerung der einzelnen akzeptierten Formate eine oder mehrere der folgenden Eigenschaften im Knoten
allowBasics
:- Name
bold
- Name
italic
- Name
underline
- Name:
anchor
(sowohl für Links als auch für benannte Anker) - Name
image
Alle Eigenschaften weisen den Typ
Boolean
auf, daher können Sie für den geeigneten Wert das Kontrollkästchen aktivieren oder deaktivieren, um die Funktion entsprechend zu aktivieren oder zu deaktivieren.note note NOTE Ist der Wert nicht explizit festgelegt, wird der Standardwert „true“ verwendet und das Format akzeptiert. - Name
-
Es können mithilfe einer Reihe anderer Eigenschaften oder Knoten auch andere Formate auf den Knoten
htmlPasteRules
angewendet werden. Speichern Sie alle Änderungen.
Sie können die folgenden Eigenschaften für htmlPasteRules
verwenden.
allowBlockTags
Definiert die Liste der zulässigen Block-Tags. Zu den möglichen Block-Tags gehören:
- Überschriften (H1, H2, H3)
- Absätze (p)
- Listen (OL, UL)
- Tabellen (Tabelle)
fallbackBlockTag
allowBlockTags
enthalten ist. p
in der Regel genügt.Definiert das Verhalten beim Einfügen von Tabellen. Dieser Knoten muss über die Eigenschaft allow
(Typ Boolean) verfügen, um festzulegen, ob das Einfügen von Tabellen zulässig ist. Wenn allow auf false
gesetzt ist, müssen Sie den Wert für die Eigenschaft ignoreMode
(Typ String) angeben, um festzulegen, wie eingefügte Tabelleninhalte verarbeitet werden sollen. Gültige Werte für ignoreMode
sind:
remove
: Entfernt Tabelleninhalte.paragraph
: Wandelt Tabellenzellen in Absätze um.
Definiert das Verhalten beim Einfügen von Listen. Muss über die Eigenschaft allow
(Typ: Boolean) verfügen, um festzulegen, ob das Einfügen von Listen zulässig ist. Wenn allow
auf false
gesetzt ist, müssen Sie den Wert für die Eigenschaft ignoreMode
(Typ String) angeben, um festzulegen, wie eingefügte Listeninhalte verarbeitet werden. Gültige Werte für ignoreMode
sind:
remove
: Entfernt Listeninhalte.paragraph
: Wandelt Listenelemente in Absätze um.
Ein Beispiel für eine gültige htmlPasteRules
-Struktur ist unten aufgeführt.
"htmlPasteRules": {
"allowBasics": {
"italic": true,
"link": true
},
"allowBlockTags": [
"p", "h1", "h2", "h3"
],
"list": {
"allow": false,
"ignoreMode": "paragraph"
},
"table": {
"allow": true,
"ignoreMode": "paragraph"
}
}
Konfigurieren von Textstilen textstyles
Autorinnen und Autoren können Stile anwenden, um das Erscheinungsbild eines Textabschnitts zu ändern. Die Stile basieren auf CSS-Klassen, die Sie in Ihrem CSS-Stylesheet vordefinieren. Stilisierter Inhalt wird in span
-Tags eingeschlossen, wobei das Attribut class
zum Verweis auf die CSS-Klasse verwendet wird. Beispiel: <span class=monospaced>Monospaced Text Here</span>
.
Wenn das Plug-in „Stile“ zum ersten Mal aktiviert wird, sind keine Standardstile verfügbar. Die Popup-Liste ist leer. Gehen Sie wie folgt vor, um Stile für Autorinnen und Autoren bereitzustellen:
- Aktivieren Sie die Dropdown-Auswahl „Stil“.
- Geben Sie die Speicherorte der Stylesheets an.
- Geben Sie die einzelnen Stile an, die Sie in der Dropdown-Liste Stil auswählen können.
Für spätere Konfigurationen, beispielsweise um weitere Stile hinzuzufügen, befolgen Sie nur die Anweisungen zum Verweisen auf ein neues Stylesheet und zum Angeben zusätzlicher Stile.
Aktivieren der Dropdown-Auswahlliste „Stil“ styleselectorlist
Aktivieren Sie dazu das Stil-Plug-in .
-
Navigieren Sie in Ihrer Komponente zum Knoten
<rtePlugins-node>/styles
. Erstellen Sie die Knoten, wenn diese nicht vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Erstellen Sie die
features
-Eigenschaft für den Knotenstyles
:- Name
features
- Typ
String
- Wert:
*
(Sternchen)
- Name
-
Speichern Sie alle Änderungen.
Festlegen der Speicherorte für Stylesheets locationofstylesheet
Geben Sie dann die Speicherorte der Stylesheets an, auf die Sie verweisen möchten:
-
Navigieren Sie zum Stammknoten der Textkomponente, beispielsweise
/apps/<myProject>/components/text
. -
Fügen Sie dem übergeordneten Knoten des Knotens
<rtePlugins-node>
die EigenschaftexternalStyleSheets
hinzu:- Name
externalStyleSheets
- Typ:
String[]
(mehrere Zeichenfolgen; klicken Sie in CRXDE auf Multi) - Werte Der Pfad und der Dateiname jedes Stylesheets, das Sie einbeziehen möchten. Verwenden Sie Repository-Pfade.
note note NOTE Sie können jederzeit Verweise auf weitere Stylesheets hinzufügen. - Name
-
Speichern Sie alle Änderungen.
CQrte
, die verwendet werden kann, um verschiedene Stile für die Anzeige und Bearbeitung bereitzustellen:#CQ td {
// defines the style for viewing }
#CQrte td {
// defines the style for editing }
Festlegen von Stilen, die in der Popup-Liste verfügbar sein sollen stylesindropdown
-
Gehen Sie in der Komponentendefinition zum Knoten
<rtePlugins-node>/styles
, den Sie wie unter Aktivieren der Dropdown-Auswahl „Stil“ beschrieben erstellt haben. -
Erstellen Sie unter dem Knoten
styles
einen neuen Knoten (ebenfalls mit dem Namenstyles
), unter dem die zur Verfügung zu stellende Liste gespeichert werden soll:- Name
styles
- Typ
cq:WidgetCollection
- Name
-
Erstellen Sie einen Knoten unter dem Knoten .
styles
Knoten , um einen einzelnen Stil darzustellen:- Name: Sie können einen Namen angeben, dieser sollte jedoch dem Stil entsprechen.
- Typ
nt:unstructured
-
Eigenschaft hinzufügen
cssName
zu diesem Knoten hinzufügen, damit Sie auf die CSS-Klasse verweisen können:- Name
cssName
- Typ
String
- Wert: Der Name der CSS-Klasse (ohne „.“ voranzustellen; beispielsweise
cssClass
anstatt.cssClass
)
- Name
-
Fügen Sie demselben Knoten die Eigenschaft
text
hinzu. Dadurch wird der im Auswahlfeld angezeigte Text definiert:- Name
text
- Typ
String
- Wert: Beschreibung des Stils. Sie wird im Dropdown-Auswahlfeld „Stil“ angezeigt.
- Name
-
Speichern Sie die Änderungen.
Wiederholen Sie die obigen Schritte für jeden benötigten Stil.
RTE für optimale Wortumbrüche auf Japanisch konfigurieren jpwordwrap
Autorinnen und Autoren, die AEM zum Erstellen japanischer Sprachinhalte verwenden, können einen Stil auf Zeichen anwenden, um Zeilenumbrüche zu vermeiden, bei denen kein Zeilenumbruch erforderlich ist. Dadurch können Autorinnen und Autoren die Sätze an der gewünschten Position umbrechen lassen. Der Stil dieser Funktion basiert auf der CSS-Klasse, die im CSS-Stylesheet vordefiniert ist.
Führen Sie folgende Schritte aus, um den Stil zu erstellen, den Autoren auf japanischen Text anwenden können:
-
Erstellen Sie einen neuen Knoten unter dem Stile-Knoten. Siehe Angeben eines neuen Stils.
- Name:
jpn-word-wrap
- Typ:
nt:unstructure
- Name:
-
Eigenschaft hinzufügen
cssName
auf den Knoten , damit Sie auf die CSS-Klasse verweisen können. Dieser Klassenname ist ein reservierter Name für die japanische Wortumbruchfunktion.- Name:
cssName
- Typ:
String
- Wert:
jpn-word-wrap
(ohne.
voranzustellen)
- Name:
-
Fügen Sie den Eigenschaftstext demselben Knoten hinzu. Der Wert ist der Name des Stils, den der Autor sieht, wenn er den Stil auswählt.
- Name:
text
*Typ:String
- Wert:
Japanese word-wrap
- Name:
-
Erstellen Sie ein Stylesheet und geben Sie seinen Pfad an. Siehe Speicherort des Stylesheets angeben. Fügen Sie dem Stylesheet die folgenden Inhalte hinzu. Ändern Sie die Hintergrundfarbe wie gewünscht.
code language-css .text span.jpn-word-wrap { display:inline-block; } .is-edited span.jpn-word-wrap { background-color: #ffddff; }
Konfigurieren der Absatzformate paraformats
Jeglicher im RTE verfasster Text wird in einem Block-Tag platziert, standardmäßig handelt es sich dabei um das Tag <p>
. Durch Aktivierung des paraformat
-Plug-ins können Sie weitere Block-Tags festlegen, die mithilfe einer Dropdown-Auswahlliste Absätzen zugewiesen werden können. Absatzformate bestimmen den Absatztyp durch Zuweisung des richtigen Block-Tags. Die Autorin bzw. der Autor kann sie mithilfe der Selektors „Format“ auswählen und zuweisen. Zu den Beispiel-Block-Tags gehört unter anderem der Standardabsatz <p> und Überschriften <h1>, <h2>und so weiter.
Wenn das Plug-in „Absatzformate“ zum ersten Mal aktiviert wird, sind keine standardmäßigen Absatzformate verfügbar. Die Popup-Liste ist leer. Gehen Sie wie folgt vor, um den Autorinnen und Autoren Absatzformate bereitzustellen:
- Aktivieren Sie die Dropdown-Auswahlliste „Format“.
- Geben Sie die Block-Tags an, die als Absatzformate aus der Dropdown-Liste ausgewählt werden können.
Für spätere Konfigurationen oder Neukonfigurationen, z. B. zum Hinzufügen weiterer Formate, folgen Sie nur dem entsprechenden Teil der Anweisungen.
Aktivieren der Dropdown-Auswahl „Format“. formatselectorlist
Aktivieren Sie zunächst das paraformat-Plug-in:
-
Navigieren Sie in Ihrer Komponente zum Knoten
<rtePlugins-node>/paraformat
. Erstellen Sie die Knoten, wenn diese nicht vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Erstellen Sie die
features
-Eigenschaft für den Knotenparaformat
:- Name
features
- Typ
String
- Wert:
*
(Sternchen)
- Name
- Absatz (
<p>
) - Überschrift 1 (
<h1>
) - Überschrift 2 (
<h2>
) - Überschrift 3 (
<h3>
)
<p>
-Tag entfernt wird, kann der Inhaltsautor das Absatzformate auch dann, wenn zusätzliche Formate konfiguriert sind.Angeben der verfügbaren Absatzformate paraformatsindropdown
Absatzformate werden wie folgt zur Auswahl bereitgestellt:
-
Navigieren Sie in der Komponentendefinition zum Knoten
<rtePlugins-node>/paraformat
, den Sie wie unter Aktivieren der Dropdown-Auswahl „Format“ beschrieben erstellt haben. -
Unter dem
paraformat
Knoten, erstellen Sie einen Knoten, der die Liste der Formate enthält:- Name
formats
- Typ
cq:WidgetCollection
- Name
-
Erstellen Sie einen neuen Knoten unter dem Knoten
formats
, der die Details für ein einzelnes Format beinhaltet:- Name: Sie können einen Namen angeben, dieser sollte jedoch dem Format entsprechen (z. B. myparagraph, myheading1).
- Typ
nt:unstructured
-
Fügen Sie diesem Knoten die Eigenschaft hinzu, um das verwendete Block-Tag zu definieren:
-
Name
tag
-
Typ
String
-
Wert Das Block-Tag für das Format, zum Beispiel: p, h1, h2.
Es ist nicht notwendig, die abgrenzenden spitzen Klammern einzugeben.
-
-
Fügen Sie demselben Knoten eine weitere Eigenschaft hinzu, damit ein beschreibender Text in der Dropdown-Liste angezeigt wird:
- Name
description
- Typ
String
- Wert Der beschreibende Text für dieses Format, z. B. Absatz, Überschrift 1, Überschrift 2. Dieser Text wird in der Auswahlliste „Format“ angezeigt.
- Name
-
Speichern Sie die Änderungen.
Wiederholen Sie die Schritte für jedes erforderliche Format.
<p>
, <h1>
, <h2>
und <h3>
) werden entfernt, wenn Sie benutzerdefinierte Formate definieren. Da <p>
das Standardformat ist, müssen Sie dieses Format neu erstellen.Konfigurieren von Sonderzeichen spchar
Wenn in einer AEM-Standardinstallation das misctools
-Plug-in für Sonderzeichen (specialchars
) aktiviert wird, ist sofort eine Standardauswahl verfügbar, wie beispielsweise Copyright- und Markenzeichensymbole.
Sie können den RTE aber auch so konfigurieren, dass Ihre eigene Auswahl an Zeichen zur Verfügung steht, entweder indem Sie einzelne Zeichen oder eine ganze Sequenz definieren.
Definieren einzelner Zeichen definesinglechar
-
Navigieren Sie in Ihrer Komponente zum Knoten
<rtePlugins-node>/misctools
. Erstellen Sie die Knoten, wenn diese nicht vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Erstellen Sie die
features
-Eigenschaft für den Knotenmisctools
:-
Name
features
-
Typ
String[]
-
Wert
specialchars
(oder
String / *
, wenn alle Funktionen für dieses Plug-in verwendet werden sollen)
-
-
Unter
misctools
Erstellen Sie einen Knoten für die Sonderzeichenkonfigurationen:- Name
specialCharsConfig
- Typ
nt:unstructured
- Name
-
Unter
specialCharsConfig
Erstellen Sie einen weiteren Knoten, der die Liste der Zeichen enthält:- Name
chars
- Typ
nt:unstructured
- Name
-
Unter
chars
Fügen Sie einen Knoten hinzu, der eine einzelne Zeichendefinition enthält:- Name: Sie können einen Namen angeben, dieser sollte jedoch das Zeichen widerspiegeln, wie beispielsweise „half“ (halb).
- Typ
nt:unstructured
-
Fügen Sie diesem Knoten die folgende Eigenschaft hinzu:
- Name
entity
- Typ
String
- Wert: Die HTML-Darstellung des erforderlichen Zeichens, z. B.
&189;
für die Bruchzahl „ein halb“.
- Name
-
Speichern Sie die Änderungen.
Sobald die Eigenschaft gespeichert wurde, wird das entsprechende Zeichen in CRXDE angezeigt. Siehe „half“ im unten aufgeführten Beispiel. Wiederholen Sie die obigen Schritte, um Autorinnen und Autoren weitere Sonderzeichen zur Verfügung zu stellen.
Definieren von Zeichenbereichen definerangechar
-
Führen Sie dazu die Schritte 1 bis 3 aus. Definieren einzelner Zeichen.
-
Unter
chars
Fügen Sie einen Knoten hinzu, der die Definition des Zeichenbereichs enthält:- Name: Sie können einen Namen angeben, dieser sollte jedoch den Zeichenbereich widerspiegeln, wie beispielsweise „pencils“.
- Typ
nt:unstructured
-
Fügen Sie unter diesem Knoten (der entsprechend dem Sonderzeichenbereich benannt wurde) die folgenden beiden Eigenschaften hinzu:
-
Speichern Sie die Änderungen.
Definieren Sie beispielsweise einen Bereich 9998 - stellt Ihnen die folgenden Zeichen zur Verfügung.
Abbildung: Definieren Sie in CRXDE einen Zeichenbereich, um ihn im RTE verfügbar zu machen.
Konfigurieren von Tabellenstilen tablestyles
Stile werden in der Regel auf Text angewendet, es kann jedoch auch ein separater Satz von Stilen auf eine Tabelle oder einige Tabellenzellen angewendet werden. Solche Stile sind für Autorinnen und Autoren entweder im Dialogfeld „Zelleneigenschaften“ oder „Tabelleneigenschaften“ über das Feld „Stilauswahl“ verfügbar. Diese Stile sind nur verfügbar, wenn eine Tabelle in einer Textkomponente (oder einer abgeleiteten Komponente davon) und nicht in der standardmäßigen Tabellenkomponente bearbeitet wird.
-
Navigieren Sie in Ihrer Komponente zum Knoten .
<rtePlugins-node>/table
. Erstellen Sie die Knoten, wenn diese nicht vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Erstellen Sie die
features
-Eigenschaft für den Knotentable
:- Name
features
- Typ
String
- Wert:
*
(Sternchen)
note note NOTE Wenn Sie nicht alle Tabellenfunktionen aktivieren möchten, können Sie den features
Eigenschaft als:-
Typ
String[]
-
Wert eine oder beide der folgenden Möglichkeiten:
-
table
– um die Bearbeitung von Tabelleneigenschaften zuzulassen, einschließlich der Stile. -
cellprops
– um die Bearbeitung von Zelleneigenschaften zuzulassen, einschließlich der Stile.
- Name
-
Definieren Sie den Speicherort von CSS-Stylesheets, damit Sie diese referenzieren können. Siehe Festlegen des Stylesheet-Speicherorts, da dieser derselbe wie bei der Definition der Textstile ist. Der Speicherort wurde möglicherweise bereits beim Definieren anderer Stile definiert.
-
Unter dem
table
-Knoten die folgenden neuen Knoten erstellen (falls erforderlich):-
Definieren der Stile für die komplette Tabelle (verfügbar unter Tabelleneigenschaften):
- Name
tableStyles
- Typ
cq:WidgetCollection
- Name
-
Definieren der Stile für einzelne Tabellenzellen (verfügbar unter Zellen-Eigenschaften):
- Name
cellStyles
- Typ
cq:WidgetCollection
- Name
-
-
Erstellen Sie einen Knoten (unter dem Knoten ).
tableStyles
odercellStyles
Knoten (entsprechend), sodass Sie einen einzelnen Stil darstellen können:- Name: Sie können einen Namen angeben, dieser sollte jedoch den Stil widerspiegeln.
- Typ
nt:unstructured
-
Erstellen Sie auf diesem Knoten die Eigenschaften:
-
Definieren des CSS-Stils, auf den verwiesen werden soll:
- Name
cssName
- Typ
String
- Wert: Der Name der CSS-Klasse (ohne
.
voranzustellen, beispielsweisecssClass
anstatt.cssClass
)
- Name
-
Definieren eines beschreibenden Texts, der in der Dropdown-Auswahl angezeigt werden soll:
- Name
text
- Typ
String
- Wert: Der Text, der in der Auswahlliste angezeigt werden soll
- Name
-
-
Speichern Sie alle Änderungen.
Wiederholen Sie die obigen Schritte für jeden benötigten Stil.
Konfigurieren von ausgeblendeten Kopfzeilen in Tabellen, um die Zugänglichkeit zu verbessern hiddenheader
Manchmal können Sie Datentabellen ohne visuellen Text in einer Spaltenüberschrift erstellen, sofern der Zweck der Kopfzeile durch die visuelle Beziehung der Spalte mit anderen Spalten impliziert wird. In diesem Fall muss in der Kopfzeilenzelle ein ausgeblendeter innerer Text in der Zelle angegeben werden. Dadurch können Bildschirmlesehilfen und andere Hilfstechnologien den Lesern mit verschiedenen Anforderungen helfen, den Zweck der Spalte zu verstehen.
Um die Barrierefreiheit in solchen Szenarien zu verbessern, unterstützt RTE ausgeblendete Kopfzeilenzellen. Darüber hinaus werden Konfigurationseinstellungen für ausgeblendete Kopfzeilen in Tabellen bereitgestellt. Mithilfe dieser Einstellungen können Sie CSS-Stile auf ausgeblendete Kopfzeilen im Bearbeitungs- und im Vorschaumodus anwenden. Damit Autoren ausgeblendete Kopfzeilen im Bearbeitungsmodus besser identifizieren können, fügen Sie die folgenden Parameter in Ihren Code ein:
hiddenHeaderEditingCSS
: Gibt den Namen der CSS-Klasse an, die auf die ausgeblendete Kopfzeilenzelle angewendet wird, wenn der RTE bearbeitet wird.hiddenHeaderEditingStyle
: Gibt eine Stilzeichenfolge an, die auf die ausgeblendete Kopfzeilenzelle angewendet wird, wenn der RTE bearbeitet wird.
Wenn Sie sowohl die CSS- als auch die Stilzeichenfolge im Code angeben, hat die CSS-Klasse Vorrang vor der Stilzeichenfolge. Sie überschreibt möglicherweise Konfigurationsänderungen, die mittels der Stilzeichenfolge vorgenommen werden.
Um Autoren bei der Anwendung von CSS auf ausgeblendete Kopfzeilen im Vorschaumodus zu helfen, können Sie die folgenden Parameter in Ihren Code einfügen:
hiddenHeaderClassName
: Gibt den Namen der CSS-Klasse an, die im Vorschaumodus auf die ausgeblendete Kopfzeilenzelle angewendet wird.hiddenHeaderStyle
: Gibt eine Stilzeichenfolge an, die im Vorschaumodus auf die ausgeblendete Kopfzeilenzelle angewendet wird
Wenn Sie sowohl die CSS- als auch die Stilzeichenfolge im Code angeben, hat die CSS-Klasse Vorrang vor der Stilzeichenfolge. Sie überschreibt möglicherweise Konfigurationsänderungen, die mittels der Stilzeichenfolge vorgenommen werden.
Hinzufügen von Wörterbüchern für die Rechtschreibprüfung adddict
Wenn das Plug-in „Rechtschreibprüfung“ aktiviert haben, verwendet der RTE Wörterbücher für jede entsprechende Sprache. Diese werden dann entsprechend der Sprache der Website ausgewählt, indem entweder die Spracheigenschaft des Unterbaums verwendet oder die Sprache aus der URL extrahiert wird. Beispiel: /en/
Verzweigung wird als Englisch markiert, die /de/
Niederlassung als Deutsch.
Spell checking failed
wird angezeigt, wenn versucht wird, eine Überprüfung für eine Sprache durchzuführen, die nicht installiert ist. Die Standardwörterbücher befinden sich unter /libs/cq/spellchecker/dictionaries
zusammen mit den entsprechenden Readme-Dateien. Diese Dateien sollten nicht geändert werden.Eine standardmäßige AEM-Installation beinhaltet die Wörterbücher für amerikanisches Englisch (en_us
) und britisches Englisch (en_gb
). Gehen Sie wie folgt vor, um ggf. weitere Wörterbücher hinzuzufügen.
-
Navigieren Sie zur Seite https://extensions.openoffice.org/.
-
Führen Sie einen der folgenden Schritte aus, um ein Wörterbuch der Sprache Ihrer Wahl zu finden:
- Suchen Sie nach einem Wörterbuch der Sprache Ihrer Wahl. Suchen Sie auf der Wörterbuchseite den Link zur Originalquelle oder zur Web-Seite des Autors. Suchen Sie die Wörterbuchdateien für v2.x auf einer solchen Seite.
- Suchen Sie unter https://wiki.openoffice.org/wiki/User:Khirano/Dictionaries nach Wörterbuchdateien der Version 2.x.
-
Laden Sie das Archiv mit den Rechtschreibdefinitionen herunter. Entpacken Sie den Inhalt des Archivs in Ihrem Dateisystem.
note caution CAUTION Nur Wörterbücher im MySpell
-Format für OpenOffice.org v2.0.1 bzw. frühere Versionen werden unterstützt. Da es sich bei den Wörterbüchern jetzt um Archivdateien handelt, wird empfohlen, das Archiv nach dem Herunterladen zu überprüfen. -
Suchen Sie das .
.aff
und.dic
-Dateien. Der Dateiname sollte nur Kleinbuchstaben aufweisen. Zum Beispielde_de.aff
undde_de.dic
. -
Laden Sie die
.aff
und.dic
Dateien im Repository unter/apps/cq/spellchecker/dictionaries
.
Konfigurieren der Verlaufsgröße für die Aktionen „Rückgängig“ und „Wiederholen“ undohistory
Mit dem RTE können Autorinnen und Autoren die letzten Bearbeitungen rückgängig machen oder wiederholen. Standardmäßig werden 50 Änderungen im Verlauf gespeichert. Sie können diesen Wert nach Bedarf konfigurieren.
-
Navigieren Sie in Ihrer Komponente zum Knoten .
<rtePlugins-node>/undo
. Erstellen Sie diese Knoten, falls sie nicht bereits vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Auf der
undo
Knoten erstellen Sie die Eigenschaft:- Name
maxUndoSteps
- Typ
Long
- Wert: Die Anzahl an rückgängig zu machenden Schritten, die Sie im Verlauf speichern wollen. Standard: 50. Verwenden Sie
0
, um die Funktionen „Rückgängig“/„Wiederholen“ vollständig zu deaktivieren.
- Name
-
Speichern Sie die Änderungen.
Konfigurieren der Tabulator-Schrittweite tabsize
Wenn das Tabulatorzeichen innerhalb eines Textes gedrückt wird, wird eine vordefinierte Anzahl von Leerzeichen eingefügt. Standardmäßig handelt es sich hierbei um drei geschützte Leerzeichen und ein Leerzeichen.
So definieren Sie die Tabulator-Schrittweite:
-
Navigieren Sie in Ihrer Komponente zum Knoten
<rtePlugins-node>/keys
. Erstellen Sie die Knoten, wenn diese nicht vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Auf der
keys
Knoten erstellen Sie die Eigenschaft:- Name
tabSize
- Typ
String
- Wert: Die Anzahl an für den Tabulator verwendeten Leerzeichen
- Name
-
Speichern Sie die Änderungen.
Festlegen des Einzugsrands indentmargin
Wenn Einzug aktiviert ist (Standard), können Sie die Größe des Einzugs definieren:
-
Navigieren Sie in Ihrer Komponente zum Knoten .
<rtePlugins-node>/lists
. Erstellen Sie diese Knoten, falls sie nicht bereits vorhanden sind. Weitere Informationen finden Sie unter Aktivieren von Plug-ins. -
Auf der
lists
Knoten erstellen, erstellen SieindentSize
Parameter:- Name:
indentSize
- Typ:
Long
- Wert: Die Anzahl der Pixel, die für den Einzugsrand erforderlich sind.
- Name:
Konfigurieren der Höhe des bearbeitbaren Bereichs editablespace
Sie können die Höhe des bearbeitbaren Bereichs definieren, der innerhalb des Komponenten-Dialogfelds angezeigt wird:
-
Auf der
../items/text
Erstellen Sie in der Dialogdefinition für die Komponente eine Eigenschaft:- Name
height
- Typ
Long
- Wert: Die Höhe der Bearbeitungsfläche in Pixeln.
note note NOTE Dies wirkt sich nicht auf die Höhe des Dialogfelds aus. - Name
-
Speichern Sie die Änderungen.
Konfigurieren von Stilen und Protokollen für Links linkstyles
Beim Hinzufügen von Links in AEM können Sie Folgendes definieren:
- Die zu verwendenden CSS-Stile
- Die Protokolle werden automatisch akzeptiert
Um zu konfigurieren, wie Links in AEM von einem anderen Programm aus hinzugefügt werden, müssen Sie HTML-Regeln definieren.
-
Suchen Sie mithilfe von CRXDE Lite nach der Textkomponente für Ihr Projekt.
-
Erstellen Sie auf derselben Ebene wie
<rtePlugins-node>
einen neuen Knoten (d. h. erstellen Sie den Knoten unter dem übergeordneten Knoten von<rtePlugins-node>
):- Name
htmlRules
- Typ
nt:unstructured
note note NOTE Der Knoten ../items/text
hat die Eigenschaft:- Name
xtype
- Typ
String
- Wert
richtext
Der Speicherort des Knotens ../items/text
kann je nach Struktur des Dialogfelds variieren. Nachfolgend sehen Sie zwei Beispiele:/apps/myProject>/components/text/dialog/items/text
und/apps/<myProject>/components/text/dialog/items/panel/items/text
. - Name
-
Erstellen Sie unter
htmlRules
einen neuen Knoten.- Name
links
- Typ
nt:unstructured
- Name
-
Unter dem
links
-Knoten, definieren Sie die Eigenschaften nach Bedarf:-
CSS-Stil für interne Links:
- Name
cssInternal
- Typ
String
- Wert: Der Name der CSS-Klasse (ohne „.“ voranzustellen; beispielsweise
cssClass
anstatt.cssClass
)
- Name
-
CSS-Stil für externe Links
- Name
cssExternal
- Typ
String
- Wert: Der Name der CSS-Klasse (ohne „.“ voranzustellen; beispielsweise
cssClass
anstatt.cssClass
)
- Name
-
Array von gültigen Protokollen. Die unterstützten Protokolle sind
http://
,https://
,file://
undmailto:
.- Name
protocols
- Typ
String[]
- Wert Ein oder mehrere Protokolle
- Name
-
defaultProtocol (Eigenschaft vom Typ Zeichenfolge): Protokoll, das verwendet wird, wenn der Benutzer keines explizit festlegt
- Name
defaultProtocol
- Typ
String
- Wert Ein oder mehrere Standardprotokolle
- Name
-
Definition der Art, wie das Zielattribut eines Links verarbeitet werden soll Erstellen Sie einen Knoten:
- Name
targetConfig
- Typ
nt:unstructured
Auf dem Knoten
targetConfig
Definieren Sie die erforderlichen Eigenschaften:-
Legen Sie den Zielmodus fest:
-
Name
mode
-
Typ
String
) -
Wert
-
auto
: bedeutet, dass ein automatisches Ziel ausgewählt wird(festgelegt über die
targetExternal
-Eigenschaft für externe Links oder dietargetInternal
-Eigenschaft für interne Links). -
manual
: In diesem Kontext unzulässig -
blank
: In diesem Kontext unzulässig
-
-
-
Das Ziel für interne Links:
- Name
targetInternal
- Typ
String
- Wert: Das Ziel für interne Links (nur verwenden, wenn der Modus
auto
aktiv ist)
- Name
-
Das Ziel für externe Links:
- Name
targetExternal
- Typ
String
- Wert: Das Ziel für externe Links (nur verwenden, wenn der Modus
auto
aktiv ist)
- Name
- Name
-
-
Speichern Sie alle Änderungen.