Webseiten prüfen

Die Website-Anwendung des Café Supremo-Marketings verfügt über drei Seiten: HOME, MENU und BLOG.

HOME-Seite

Auf der Homepage werden Marketingkampagnen wie Werbeanzeigen und Werbeaktionen angezeigt.

Die auf der Website verfügbaren Elemente werden mit Details und Links auf der Homepage beworben. Oben befindet sich eine Promotion mit einer Schaltfläche Mehr, die beim Klicken eine Seite mit einer Beschreibung des Elements öffnet. Unter der Promotion befinden sich drei Werbeanzeigen mit Schaltflächen für Jetzt kaufen. Am Ende der Homepage wird der neueste Blog angezeigt und beim Klicken auf die entsprechende Blogdetailseite geöffnet.

Beschreibung der Abbildung home_page.png

Im Folgenden wird erläutert, wie die Oracle Content Management-Komponenten aus dem Komponentenaustausch in der Cafe-Supremo-Anwendung in Oracle Visual Builder verwendet werden.

Beschreibung der Abbildung home-start_page.png

Mit den Inhaltslistenkomponenten mit den entsprechenden Einstellungen wird der Inhalt auf der Homepage angezeigt.

Beispiel: Die Konfiguration der Inhaltslistenkomponente wird oben auf der Seite verwendet.

Beschreibung der Abbildung home_page_component.png

Die folgenden Schlüsseleinstellungen werden im Eigenschaftenbereich dieser Komponente angegeben, um die Promotion oben anzuzeigen.

Registerkarte "Allgemein":

• ID – Die eindeutige API-ID des Assets.
• Content Server - Standardwert
• Kanaltoken - Standardwert
• Inhaltstyp - Promo
• Layout - Promotionstandard
• Maximale Anzahl Objekte - 1
• Starten bei Element - 1

Der Promo-Inhaltstyp wird in dieser Komponente verwendet. Die Anzahl der anzuzeigenden Elemente ist auf eins beschränkt. Die Schaltfläche Mehr ist so konfiguriert, dass sie auf die entsprechende Detailseite verweist. Ein Event Handler ist eingerichtet, um diese Schaltfläche mehr zu konfigurieren, um die entsprechende Seite mit den Promotiondetails zu öffnen. In den Eigenschaften der Komponente werden auf der Registerkarte Ereignisse die Ereigniseinstellungen für die Definition eines Ereignisses und einer Aktionskette (eine Folge von Aktionen) konfiguriert, die angibt, was geschieht, wenn das angegebene Ereignis eintritt, d.h. was geschieht, wenn auf der Seite auf ein Element geklickt wird (z.B. die Schaltfläche Mehr). Ereignis-Listener werden für diese Seite auf der Registerkarte Ereignis-Listener definiert, um auf Ereignisse zu horchen und die auf der Registerkarte Aktionen definierten Aktionsketten zu starten.

Beschreibung der Abbildung component_event.png

Auf der Registerkarte Aktionen werden Aktionen, die den auf der Registerkarte Ereignisse für ein Inhaltslistenelement definierten Ereignissen zugeordnet sind, zusammen mit Aktionsketten definiert. Die Aktionen sind Teil einer Aktionskette. Beispiel: Wenn Sie auf der Registerkarte Aktionen auf die erste für die erste Inhaltsliste definierte Aktion klicken, können Sie deren Konfiguration anzeigen. Wenn Sie im Abschnitt "Diagramm" auf Promo-Details navigieren (eine Navigationsaktion) klicken, wird angezeigt, dass das Feld Ziel im Eigenschaftsbereich auf Promo-Details gesetzt ist, sodass es zur Detailseite navigiert, wenn ein Benutzer auf die Schaltfläche Mehr in der Promotion klickt.

Beschreibung der Abbildung action_tab.png

Für die Seite "Promo-Details" ist eine Inhaltsplatzhalterkomponente konfiguriert, um Inhaltselemente dynamisch anzuzeigen. Wenn ein Benutzer also auf die Schaltfläche Mehr klickt, lädt die Komponente "Inhaltsplatzhalter" auf der Seite "Promo-Details" automatisch die Details des zugehörigen Inhaltselements.

Beschreibung der Abbildung promo_details.png

Ebenso gibt es eine Blog-Detail-Seite, auf der der entsprechende Blogartikel angezeigt wird, wenn ein Benutzer auf den am Ende der Homepage angezeigten Blog klickt.

Diese Oracle Content Management-Komponenten können aus dem Komponentenaustausch gezogen und auf den Seiten der Websiteanwendung abgelegt werden. Anschließend können Sie entsprechend Ihren Anforderungen mit entsprechenden Einstellungen konfigurieren.

Beschreibung der Abbildung component_exchange.png

Beispiel: Informationen zum Hinzufügen eines Inhaltselements zur Homepage finden Sie im Abschnitt "Anpassen" dieses Lösungs-Playbooks.

Ebenso werden zwei weitere Inhaltslistenkomponenten verwendet, um die Anzeigen und Blog unter der Promotion anzuzeigen.

Diese Komponenten rufen den Inhalt basierend auf ihren Einstellungen dynamisch aus dem Repository ab, das Sie zuvor in Oracle Content Management erstellt haben, und zeigen diesen Inhalt dann auf der Homepage an.

MENU-Seite

Auf der Seite "MENU" werden alle Menüoptionen in einem Katalog aufgeführt.

Beschreibung der Abbildung menu_page.png

Auf dieser Seite werden drei Registerkarten angezeigt: COFFEE, TEA und TREATS. In jedem dieser Register werden verschiedene Arten von Artikeln angezeigt, die unter dieser Kategorie verfügbar sind. Beispiel: Auf der Registerkarte COFFEE werden Sorten wie CLASSIC ESPRESSO, SUPREMO CAPPUCCINO, COLD PRESS COFFEE und BLACK SUPREMO mit Informationen zu jeder Sorte angezeigt. Einige der Artikel haben auch Videos. Unter diesen Registerkarten werden die verschiedenen Kombos des Café Supremo mit Details angezeigt, darunter Bilder, die die in jedem Kamm verfügbaren Elemente beschreiben.

Auf der Menüseite werden unter anderem die Registerkartenleiste und die Inhaltsliste verwendet. Diese Komponenten wurden mit den entsprechenden Einstellungen zur Anzeige des Inhalts auf der Menüseite verwendet. Die Komponente "Inhaltsliste" stammt aus dem Komponentenaustausch.

Beispiel: Die Konfiguration einer Inhaltslistenkomponente wird oben auf der Seite verwendet.

Beschreibung der Abbildung menu_page_component.png

Die folgenden Schlüsseleinstellungen werden im Eigenschaftenbereich dieser Komponente angegeben, um die Inhaltselemente (Menüelemente) anzuzeigen.

Registerkarte "Allgemein":

• ID – Die eindeutige API-ID des Assets.
• Content Server - Standardwert
• Kanaltoken - Standardwert
• Inhaltstyp - MenuItem
• Layout - MenuItem-Standard
• Maximale Anzahl Objekte - 10
• Starten bei Element – 1
• Zusätzliche Abfragezeichenfolge - fields.menuitem_category eq "COFFEE"

Der Inhaltstyp MenuItem wird in dieser Komponente verwendet. Die Anzahl der anzuzeigenden Elemente ist auf zehn beschränkt. In der ersten Registerkarte (Registerkarte "COFFEE") ist das Feld "Zusätzliche Abfragezeichenfolge" auf fields.menuitem_category eq "COFFEE" gesetzt. Sie wird auch für die anderen Registerkarten festgelegt. Im Feld "Zusätzliche Abfragezeichenfolge" werden zusätzliche Abfrageparameter angegeben, um die Liste der angezeigten Menüelemente weiter zu verfeinern.

Ebenso wird eine weitere Inhaltslistenkomponente mit den entsprechenden Einstellungen zur Anzeige der Kombinationsmenüoptionen verwendet, die in Café Supremo verfügbar sind.

Die Komponenten des Komponentenaustauschs ermöglichen diesen Seiten umfangreiche Inhalte, indem sie Inhalt dynamisch aus dem Repository in Oracle Content Management abrufen und in der Anwendung in Oracle Visual Builder anzeigen.

BLOG-Seite

Auf der Seite BLOG werden Blogartikel verschiedener Kategorien angezeigt.

Beschreibung der Abbildung blog_page.png

Diese Seite enthält vier Registerkarten für die verschiedenen Blogkategorien, wie OW TO, DRINKS, PEOPLE und RECIPES. Auf jeder Registerkarte werden die für diese bestimmte Kategorie verfügbaren Blog-Elemente mit Details wie Bild, Blog-Titel und veröffentlichtem Datum angezeigt. Wenn ein Benutzer auf ein Blogelement klickt, wird die Seite für Blogartikel im selben Fenster geöffnet.

Komponenten wie Registerkartenleiste und Inhaltsliste mit entsprechenden Einstellungen werden verwendet, um den Inhalt auf der Blogseite anzuzeigen. Die Komponente "Inhaltsliste" stammt aus dem Komponentenaustausch.

Die Komponente "Registerkartenleiste" ist mit entsprechenden Einstellungen konfiguriert, um die vier Kategorien als Registerkarten auf der Blogseite anzuzeigen. Die folgenden Schlüsseleinstellungen werden im Eigenschaftenbereich dieser Komponente angegeben, um die vier Blogkategorien als Registerkarten anzuzeigen.

Registerkarte "Allgemein":

• ID – Die eindeutige API-ID des Assets.
• Auswahl - Der Schlüssel des ausgewählten Elements wird angegeben.
• Tabs (Registerkarten) – Die Registerkarteninformationen für die vier Kategorien werden angegeben, und die erste Registerkarte wird als Standardregisterkarte festgelegt.
• Edge - Oben

Die Eigenschaften der für diese Registerkarten erforderlichen Variablen werden auf der Registerkarte Variablen festgelegt.

Sehen wir uns die Konfiguration der Inhaltslistenkomponente an. Die folgenden Schlüsseleinstellungen werden im Eigenschaftenbereich dieser Komponente angegeben, um die Blog-Elemente anzuzeigen.

Registerkarte "Allgemein":

• ID – Die eindeutige API-ID des Assets.
• Content Server - Standardwert
• Kanaltoken - Standardwert
• Inhaltstyp - Blog
• Layout - Blog-Standard
• Listenansicht - threeColumns
• Maximale Anzahl Objekte - 10
• Starten bei Element – 1
• Zusätzliche Abfragezeichenfolge - fields.blog_category eq "HOW TO"

Der Blog-Inhaltstyp wird in dieser Komponente verwendet. Die Anzahl der anzuzeigenden Elemente ist auf zehn beschränkt. In der ersten Registerkarte (Registerkarte "OW TO") ist das Feld "Zusätzliche Abfragezeichenfolge" auf fields.menuitem_category eq "HOW TO" gesetzt. Sie wird auch für die anderen Registerkarten festgelegt. Ein Event Handler ist eingerichtet, um die Aktionen und Ereignisse zu definieren, die mit den Inhaltslistenelementen verknüpft sind, um festzulegen, was geschieht, wenn ein Benutzer auf ein Blogelement klickt. In den Eigenschaften der Komponente werden die Ereigniseinstellungen auf der Registerkarte Ereignisse so konfiguriert, dass ein Ereignis und eine Aktionskette definiert werden, die angibt, was geschieht, wenn das angegebene Ereignis eintritt, das heißt, was geschieht, wenn auf der Seite auf ein Element geklickt wird. Ereignis-Listener werden für diese Seite auf der Registerkarte Ereignis-Listener definiert, um auf Ereignisse zu horchen und die auf der Registerkarte Aktionen definierten Aktionsketten zu starten.

Beschreibung der Abbildung blog-start_page.png

Auf der Registerkarte Aktionen werden Aktionen, die den auf der Registerkarte Ereignisse für ein Inhaltslistenelement definierten Ereignissen zugeordnet sind, zusammen mit Aktionsketten definiert. Die Aktionen sind Teil einer Aktionskette (eine Folge von Aktionen). Beispiel: Wenn Sie auf die erste Aktion klicken, können Sie auf der Registerkarte Aktionen ihre Konfiguration anzeigen. Wenn Sie im Abschnitt "Diagramm" auf Blogdetail navigieren (bei dem es sich um eine Navigationsaktion handelt) klicken, wird angezeigt, dass das Feld Ziel im Eigenschaftsbereich auf blog-detail gesetzt ist, sodass es zur entsprechenden Blogartikelseite (Blogdetails) navigiert, wenn ein Benutzer auf ein Blogelement auf der Blogseite klickt.

Beschreibung der Abbildung target_setting.png

Für die Seite "Blogdetails" ist eine Inhaltsplatzhalterkomponente konfiguriert, um Inhaltselemente dynamisch anzuzeigen. Wenn ein Benutzer also auf ein Blogelement klickt, lädt die Komponente "Inhaltsplatzhalter" auf der Blogdetailseite automatisch die Details des zugehörigen Inhaltselements.

Beschreibung der Abbildung blog-details_page.png

Sobald die Websiteanwendung veröffentlicht wurde und neue Blogartikel (Bloginhaltselemente) hinzugefügt und veröffentlicht werden (in der Oracle Content Management-Webbenutzeroberfläche), werden diese Blogartikel dynamisch in die Blogseite der Websiteanwendung (in Oracle Visual Builder) übernommen und sofort den Benutzern zur Verfügung gestellt.