Symbolleiste anpassen id172FB00L0V6
Standardmäßig werden im Web Editor die gängigsten redaktionellen Funktionen bereitgestellt, die für jeden DITA-Editor erforderlich sind. Funktionen wie das Einfügen von Elementen des Typs Liste (nummeriert oder mit Aufzählungszeichen), Querverweis, Inhaltsverweis, Tabelle, Absatz und Zeichenformatierung sind im Editor verfügbar. Zusätzlich zu diesen grundlegenden Elementen können Sie den Web-Editor anpassen, um Elemente einzufügen, die in Ihrer Authoring-Umgebung verwendet werden.
Es gibt zwei Möglichkeiten, die Symbolleiste des Web-Editors anzupassen:
-
Hinzufügen neuer Funktionen zur Symbolleiste
-
Entfernen vorhandener Funktionen aus der Symbolleiste
Hinzufügen einer Funktion in der Symbolleiste
Das Hinzufügen einer Funktion zum Webeditor umfasst zwei Hauptaufgaben: das Hinzufügen eines Symbols für die Funktion in der Datei ui_config.json und das Hinzufügen der Hintergrundfunktion in JavaScript.
Führen Sie die folgenden Schritte aus, um der Symbolleiste des Web-Editors eine Funktion hinzuzufügen:
-
Um die Benutzeroberflächenkonfigurationsdatei herunterzuladen, melden Sie sich als Administrator bei Adobe Experience Manager an.
-
Klicken Sie oben auf den Adobe Experience Manager-Link und wählen Sie Tools aus.
-
Wählen Sie Guides aus der Liste der Tools und klicken Sie auf Ordnerprofile.
-
Klicken Sie auf die Kachel Globales Profil .
-
Wählen Sie die Registerkarte XML-Editor-Konfiguration aus und klicken Sie oben auf das Symbol Bearbeiten .
-
Klicken Sie auf das Symbol Download , um die Datei ui_config.json auf Ihr lokales System herunterzuladen. Anschließend können Sie Änderungen an der Datei vornehmen und diese dann hochladen.
-
Fügen Sie in der Datei
ui_config.json
die Definition der neuen Funktion im Abschnitt "Symbolleisten"hinzu. Speichern Sie die Datei und laden Sie sie hoch.In der Regel können Sie eine neue Schaltflächengruppe für Symbolleisten erstellen und eine oder mehrere Schaltflächen der Symbolleiste hinzufügen. Sie können auch eine neue Symbolleistenschaltfläche innerhalb einer vorhandenen Symbolleistengruppe hinzufügen. Die folgenden Details sind erforderlich, um eine neue Symbolleistengruppe zu erstellen:
type: Geben Sie
blockGroup
als den Werttype
an. Dieser Wert gibt an, dass Sie eine Blockgruppe erstellen, die eine oder mehrere Symbolleistengruppen enthalten würde.extraclass: Name der Klasse(n), getrennt durch Leerzeichen.
items: Definieren Sie die Definition aller Gruppen in der Symbolleiste. Jede Gruppe kann ein oder mehrere Symbolleistensymbole enthalten. Um Symbole in einer Symbolleistengruppe zu definieren, müssen Sie das Attribut
type
innerhalb vonitems
erneut definieren und dessen Wert aufbuttonGroup
setzen. Geben Sie einen oder mehrere Klassennamen in der Eigenschaftextraclass
an. Geben Sie den Funktionsnamen in der Eigenschaftlabel
an. Das folgende Codefragment aus der Dateiui_config.json
zeigt die Definition des Haupt-Symbolleistenblocks gefolgt von der DefinitionbuttonGroup
:code language-none " "toolbar": { "type": "blockGroup", "extraclass": "toolbar operations", "items": [ { "type": "buttonGroup", "extraclass": "left-control", "label": "Left Controls", "items": [ "
In der Sammlung
items
müssen Sie die Definition für ein oder mehrere Symbolleistensymbole angeben.Sie müssen die folgenden Eigenschaften definieren, um ein Symbolleistensymbol hinzuzufügen:
type: Geben Sie
button
als den Werttype
an. Dieser Wert gibt an, dass Sie eine Symbolleistenschaltfläche hinzufügen.icon: Geben Sie den Namen des Coral-Symbols an, das Sie in der Symbolleiste verwenden möchten.
variant: Geben Sie
quiet
als den Wertvariant
an.title: Geben Sie die QuickInfo für das Symbol an.
on-click: Geben Sie den für die Funktion definierten Befehlsnamen in der JavaScript-Datei an. Wenn für Ihren Befehl Eingabeparameter erforderlich sind, geben Sie den Befehlsnamen wie folgt an:
code language-none "Javascript "on-click": {"name": "AUTHOR_INSERT_ELEMENT", "args": "simplable"} "
Einblenden oder Ausblenden: Wenn Sie die Eigenschaft
show
definieren, geben Sie die Modi an, in denen das Symbol angezeigt wird. Mögliche Werte sind -@isAuthorMode
,@isSourceMode
,@isPreviewMode
,true
(in allen Modi anzeigen) oderfalse
(in allen Modi ausblenden).Anstelle von
show
können Sie auch die Eigenschafthide
definieren. Die möglichen Werte sind mit denen in der Eigenschaftshow
identisch, mit dem einzigen Unterschied, dass das Symbol für den angegebenen Modus nicht angezeigt wird.Das folgende Beispiel zeigt die AEM Guides-Versionsnummer, wenn der Benutzer in der Symbolleiste auf das Symbol Version anzeigen klickt.
Fügen Sie einer JavaScript-Datei den folgenden Code hinzu:
code language-javascript $(document).ready(setTimeout(function() { fmxml.commandHandler.subscribe({ key: 'user.alert', next: function() { alert("AEM Guides version x.x") } }) }, 1000))
Fügen Sie die Funktion in der Datei ui_config.json wie folgt hinzu:
code language-javascript "type": "button", "icon": "alert","variant": "quiet","title": "About AEM Guides","show": "true","on-click": "user.alert"
-
Erstellen Sie einen Ordner clientlib und fügen Sie Ihren JavaScript in diesen Ordner ein.
-
Aktualisieren Sie die categories-Eigenschaft des Ordners clientlib , indem Sie ihm den Wert apps.fmdita.xml_editor.page_overrides zuweisen.
-
Speichern Sie die Datei ui_config.json und laden Sie den Web Editor neu.
Entfernen einer Funktion aus der Symbolleiste
Manchmal möchten Sie nicht alle derzeit im Web-Editor verfügbaren Funktionen bereitstellen. In diesem Fall können Sie die unerwünschte Funktion aus der Symbolleiste des Web-Editors entfernen.
Führen Sie die folgenden Schritte aus, um unerwünschte Funktionen aus der Symbolleiste zu entfernen:
-
Um die Benutzeroberflächenkonfigurationsdatei herunterzuladen, melden Sie sich als Administrator bei Adobe Experience Manager an.
-
Klicken Sie oben auf den Adobe Experience Manager-Link und wählen Sie Tools aus.
-
Wählen Sie Handbücher aus der Liste der Tools und klicken Sie auf Ordnerprofile.
-
Klicken Sie auf die Kachel Globales Profil .
-
Wählen Sie die Registerkarte XML-Editor-Konfiguration aus und klicken Sie oben auf das Symbol Bearbeiten .
-
Klicken Sie auf das Symbol Download , um die Datei ui_config.json auf Ihr lokales System herunterzuladen. Anschließend können Sie Änderungen an der Datei vornehmen und diese dann hochladen.
Die Datei
ui_config.json
enthält drei Abschnitte:-
toolbars: Dieser Abschnitt enthält die Definition aller in der Symbolleiste des Editors verfügbaren Funktionen wie "Nummerierte Liste einfügen/entfernen", "(Datei) schließen", "Speichern", "Kommentare"und mehr.
-
shortcuts: Dieser Abschnitt enthält die Definition von Tastaturbefehlen, die einer bestimmten Funktion im Editor zugewiesen sind.
-
templates: Dieser Abschnitt enthält die vordefinierte Struktur von DITA-Elementen, die Sie in Ihrem Dokument verwenden können. Standardmäßig enthält der Abschnitt "Vorlagen"Vorlagendefinitionen für Absätze, einfache Tabellen, Tabellen und Textelemente. Sie können eine Vorlagendefinition für jedes Element erstellen, indem Sie eine gültige XML-Struktur für das gewünschte Element hinzufügen. Wenn Sie beispielsweise ein
p
-Element mit jedem neuenli
-Element in einer Liste hinzufügen möchten, können Sie den folgenden Code am Ende des Vorlagenabschnitts hinzufügen, um dies zu erreichen:
code language-css "li": "<li><p></p></li>"
-
-
Entfernen Sie im Abschnitt "Symbolleisten"den Eintrag der Funktion, die Sie Ihren Benutzern nicht zur Verfügung stellen möchten.
-
Speichern Sie die Datei ui_config.json und laden Sie den Web Editor neu.
Übergeordnetes Thema: Web-Editor anpassen