Sie können bestimmte Text- oder Bildinhalte in einem Layout so konfigurieren, dass Benutzer, die mit Seiten basierend auf dem Layout arbeiten, diese bearbeiten können.
Diese Funktionalität kann in jedem Theme, einschließlich Bootstrap-Themes, verwendet werden. Die Änderungen erhalten automatisch den Stil der ursprünglichen Seite.
Sie können den folgenden HTML-Tags im Layout einfaches Markup hinzufügen: <p>, <h1> über <h6>, <div> und <img>.
Verfügbare Optionen für die Text- und Bildformatierung:
Text: Benutzer können "Fett", "Kursiv", "Unterstrichen" und "Link" angeben.
Bild: Benutzer können einen Link zu einer Bilddatei angeben. Sie können auch Eigenschaften für den Titel ändern (was Benutzer beim Mouseover auf ein Bild sehen) und alternativen Text für die Barrierefreiheit hinzufügen.
Um ein Text- oder Bildelement so zu ändern, dass Benutzer es bearbeiten können, müssen Sie zwei Schritte ausführen:
Fügen Sie scs-editable zu class hinzu.
Fügen Sie ein eindeutiges id-Attribut hinzu.
Nachdem ein Layout geändert wurde, ist die Funktionalität für alle Seiten verfügbar, die auf diesem Layout basieren (selbst neue Seiten).
Beim Kopieren und Einfügen einer Seite werden die Änderungen in die neue Seite kopiert.
Überschriftstag ändern
Synchronisieren Sie die Layoutdatei mit dem lokalen Desktop, oder bearbeiten Sie die HTML-Quelldatei für den <h1>-Header.
Fügen Sie scs-editable zu class und das Attribut id="test-heading" in der Zeile des Codes für die Überschrift hinzu, sodass ein Editor damit verknüpft werden kann. Beispiel:
<h1 class="brand-heading scs-editable" id="test-heading">Sample Heading Value</h1>
Speichern Sie die Datei.
Führen Sie eine Synchronisierung mit Oracle Content Management durch, und laden Sie den Browser neu.
Ein schwarzer Rahmen sollte um die Überschrift herum angezeigt werden, wenn Benutzer mit dem Cursor darauf zeigen, um anzugeben, dass der Inhalt bearbeitet werden kann. Wenn ein Benutzer auf die Überschrift klickt, wird der Rahmen grün. Das heißt, dass der Benutzer den Inhalt der Überschrift jetzt bearbeiten kann.
Veröffentlichen Sie das Theme, wenn noch nicht geschehen. Nach der Veröffentlichung wird die Änderung angezeigt, wenn Sie den Browser aktualisieren.
Sobald das Theme veröffentlicht wurde, können Sitebenutzer auf den Header klicken und ihn im Sitebuilder bearbeiten.
Eine Pseudokomponente wird für das scs-editable-Element erstellt, damit Sie dieses in Sitebuilder ändern und mit den Seitendaten speichern können. Vor dem Rendern der Seite zur Laufzeit ersetzt der Controller die scs-editable-Tags durch die in Sitebuilder festgelegten Werte.
Bildtag ändern
Das Verfahren zum Ändern eines Bildtags in einem Layout, sodass es von Benutzern bearbeitet werden kann, ähnelt dem Verfahren für Textelemente.
Fügen Sie scs-editable zu class hinzu.
Fügen Sie ein eindeutiges id-Attribut für das Bild hinzu.
Benutzer können auf das Bild klicken und dann Eigenschaften ändern, um ein anderes Bild zu verwenden.
Beispielcode für ein Bild, das Benutzer bearbeiten können:
<img class="scs-editable" id="test-image" src="_scs_theme_root_/assets/img/downloads-bg-small.jpg"/>