AX - Galerie
Übersicht
AX - Galerie ist eine Experience-Cloud-Komponente, die Bilder und Inhalte auf Experience-Sites-Seiten in vier Layout-Stilen anzeigt: Karussell (Slideshow), Tabs (geordnete Abschnitte), Raster (mehrspaltig) oder Galerie (Bildpräsentation).
Verwenden Sie sie, um Produktfotos, Projektportfolios, Fallstudienbilder, Ressourcensammlungen oder beliebige visuelle Inhalte anzuzeigen, die Portalbenutzer durchsuchen müssen. Konfigurieren Sie den Layout-Stil, die Navigation und die Bildquellen in Experience Builder ohne Code.
Erste Schritte
Verwenden Sie dieses einfache Tutorial, um die Grundlagen der Galerie-Komponente zu lernen und mit dem Aufbau Ihrer Anwendungsfälle zu beginnen.
Mit Salesforce-Daten verbinden
Die Datenquelle ist der Bereich, in dem Sie den Inhalt Ihrer Galerie definieren. AX - Gallery unterstützt zwei Typen von Datenquellen: Manuell und Abfrage.
Manuell
Laden Sie jedes Galerieelement direkt in die Komponente hoch oder geben Sie es ein. Jedes über die Medienquellen-Auswahl hinzugefügte Bild erstellt eine neue Datei in Ihrer Salesforce-Files-Bibliothek.
Einmalige Galerien mit statischem Inhalt, der sich selten ändert (Hero-Bereich der Landingpage, feste Produktpräsentation, Demos).
Abfrage
Rufen Sie Elemente dynamisch aus einem Salesforce-Objekt ab (Produkt, Knowledge, ContentVersion, benutzerdefiniertes Objekt …). Die Galerie wird automatisch aktualisiert, wenn sich die zugrunde liegenden Datensätze ändern.
Alle Inhalte, die mit Salesforce-Daten synchron bleiben, regelmäßig wechseln oder von einem nichttechnischen Team außerhalb von Experience Builder verwaltet werden müssen.
Auswahl zwischen Manuell und Abfrage
Der manuelle Modus erstellt jedes Mal eine brandneue Datei in der Bibliothek, wenn Sie ein Bild hochladen. Er verweist nicht auf Dateien, die bereits in Salesforce Files vorhanden sind. Wenn Sie Ihre Galerieninhalte erneut verwenden oder aktualisieren müssen, ohne das Eigenschaftenfenster erneut zu öffnen, verwenden Sie stattdessen Abfrage stattdessen.
Modellfreigabe mit Avonni AX - Gallery
Einhaltung der Salesforce-Datenfreigaberegeln:
Org-Einstellungen beachten: Avonni-Komponenten entsprechen vollständig den vorhandenen Datenfreigabe-Konfigurationen und Zugriffseinstellungen Ihrer Salesforce-Organisation.
Keine Beeinträchtigung: Diese Komponenten verändern oder beeinflussen Ihre zuvor festgelegten Datenfreigaberegeln in keiner Weise.
Kontrollierte Sichtbarkeit und Zugriff: Die Möglichkeit, Datensätze über Avonni-Komponenten anzuzeigen und mit ihnen zu interagieren, wird durch die von Ihrer Organisation definierten Freigabeeinstellungen und Benutzerberechtigungen gesteuert
Vorhandene Salesforce Files als Ihre Medienquelle verwenden
Die Medienquelle das Feld in AX - Gallery ist flexibel in Bezug darauf, womit Sie es befüllen. Sie können es einer URL, einer ContentDocumentId oder einem vollständigen Salesforce-Files-Downloadpfad zuordnen. Die Komponente erkennt ContentDocumentIds automatisch und löst sie zur Laufzeit in die richtige Vorschau-URL auf.
So verknüpfen Sie eine Galerie mit Dateien in der Salesforce-Files-Bibliothek ohne jemals über die Komponente erneut hochzuladen.
Ein Feld, das eine ContentDocumentId enthält (beginnt mit 069…)
Die neueste Version der Datei wird aufgelöst und angezeigt. Die Komponente erkennt 069… IDs automatisch.
Das Standardfeld VersionDataURL beim Abfragen von ContentVersion
Die Datei wird heruntergeladen und angezeigt. Empfohlen, wenn Ihr Quellobjekt ContentVersion ist.
Eine Shepherd-URL erstellt mit einem Ausdruck wie /sfc/servlet.shepherd/version/download/{{Record.Id}}
Die exakt in der URL referenzierte Version wird angezeigt. Nützlich für die benutzerdefinierte URL-Erstellung.
Eine Öffentliche URL (extern gehostetes Bild)
Das Bild wird aus der externen Quelle geladen.
So richten Sie es im Abfragemodus ein
In der Datenquelle, wählen Sie Abfrage und wählen Sie Ihr Quellobjekt aus (
ContentVersion, ein benutzerdefiniertes Objekt mit Dateiverweisen oder ein beliebiges Objekt mit einem Bildfeld).Wenden Sie einen Filter an, der festlegt, welche Datensätze angezeigt werden sollen (nach Titelnamen, Tag, benutzerdefiniertem Feld, Picklist-Wert usw.).
In Datenzuordnungen, ordnen Sie Medienquelle basierend auf Ihrem Quellobjekt zu:
Abfrage von ContentVersion: Ordnen Sie Medienquelle dem Standard
Version Data URLFeld zu.Abfrage eines benutzerdefinierten Objekts mit einem ContentDocumentId-Feld: Ordnen Sie Medienquelle direkt diesem Feld zu (die Komponente erkennt
069…IDs und löst sie automatisch auf).Abfrage eines beliebigen Objekts mit einem vollständigen Bild-URL-Feld: Ordnen Sie Medienquelle direkt diesem Feld zu.
Sobald konfiguriert, ist das Aktualisieren der Inhalte Ihrer Galerie so einfach wie das Ersetzen der Dateien in der Salesforce-Files-Bibliothek oder das Aktualisieren des Referenzfelds auf Ihren Datensätzen.
Vorschau in Experience Builder
Bilder, die auf Salesforce Files verweisen, werden in der Experience-Builder-Vorschau möglicherweise nicht angezeigt, da sich der Builder nicht als Portalbenutzer authentifiziert. Sie werden korrekt angezeigt, sobald Sie sich auf der veröffentlichten Site als Community-Benutzer anmelden.
Eine Variante festlegen
Karussells
Die Karussell-Variante bietet eine dynamische, ansprechende Möglichkeit, Ihre Inhalte, Bilder oder Karten zu präsentieren. Sie ist darauf ausgelegt, Elemente nacheinander in einem Slideshow-Format anzuzeigen, was sie zu einer ausgezeichneten Wahl für hervorgehobene Inhalte, Produktbilder oder wichtige Ankündigungen macht.
Wann verwenden: Verwenden Sie die Karussell-Variante, wenn Sie:
die Aufmerksamkeit der Benutzer mit einer optisch ansprechenden Präsentation gewinnen möchten.
mehrere Elemente oder Bilder platzsparend anzeigen möchten.
rotierende Banner oder Bereiche mit hervorgehobenen Inhalten auf Ihrer Site erstellen möchten.
Funktionen:
Navigationselemente: Navigieren Sie durch das Karussell mit intuitiven Steuerelementen wie Pfeiltasten oder Seitenpunkten.
Automatische Wiedergabe: Legen Sie fest, dass das Karussell die Elemente automatisch durchläuft, mit der Möglichkeit, zu pausieren und fortzusetzen.
Anpassbares Erscheinungsbild: Passen Sie das Aussehen und Verhalten des Karussells an das Design Ihrer Site an, indem Sie Elemente wie Übergangseffekte und Anzeigedauer anpassen.
Registerkarten
Die Tabs-Variante führt eine organisierte, tabellarische Methode zur Inhaltspräsentation ein. Diese Variante ist ideal für die Kategorisierung von Informationen und bietet ein sauberes, strukturiertes Layout, mit dem Benutzer schnell navigieren und auf verschiedene Inhaltsabschnitte zugreifen können.
Wann verwenden: Erwägen Sie die Tabs-Variante, wenn Sie:
kategorisierte Informationen in einem klaren, segmentierten Format präsentieren müssen.
Benutzern ermöglichen möchten, problemlos zwischen verschiedenen Inhaltsabschnitten zu wechseln, ohne die Seite zu verlassen.
Inhalte wie Produktspezifikationen, Servicekategorien oder Informations-Tabs benutzerfreundlich organisieren möchten.
Funktionen:
Segmentierter Inhalt: Organisieren Sie Ihre Inhalte in klar definierten Tabs, damit Benutzer verschiedene Bereiche leicht finden und anzeigen können.
Benutzerfreundliche Navigation: Ermöglichen Sie Benutzern, nahtlos zwischen Tabs zu wechseln, und sorgen Sie so für ein flüssiges, intuitives Erlebnis.
Anpassbares Design: Passen Sie das Erscheinungsbild der Tabs an Ihr Branding und die Ästhetik Ihrer Site an, indem Sie Elemente wie Tab-Beschriftungen, Layout und Farbschemata ändern.
Raster
Stellt Inhalte in einem strukturierten, mehrspaltigen Layout dar. Jedes Element belegt eine Zelle im Raster.
Wann verwenden: Ideal für die Anzeige einer Sammlung von Elementen, bei denen gleiche Gewichtung gewünscht ist, wie zum Beispiel:
Produktlisten
Profile von Teammitgliedern
Vorschauen von Blogbeiträgen
Funktionen
Anpassbare Anzahl von Spalten
Möglichkeit, den Abstand (Gap) zwischen Elementen festzulegen
Optionen für Bilder, Titel, Beschreibungen und Call-to-Action-Schaltflächen innerhalb jeder Rasterzelle
Galerie
Ein visuell ausgerichtetes Layout, das Bilder prominent präsentiert.
Wann verwenden: Am besten geeignet für bildbasierte Inhalte, wie zum Beispiel:
Fotografie-Portfolios
Produktgalerien
bildzentrierte hervorgehobene Inhalte
Funktionen
Fokus auf große, hochwertige Bilder
Optionen zum Einfügen von Bildunterschriften oder Lightbox-Funktionalität zum Hineinzoomen in Bilder
Potenzial für kreative Layouts und Hover-Effekte
Interaktionen
Der Abschnitt „Link zu“ bestimmt, was passiert, wenn ein Benutzer auf ein Element in Ihrer Avonni-Galerie klickt. Verwenden Sie ihn, um Benutzer auf Detailseiten zu leiten, neue Inhalte zu öffnen oder andere Aktionen auszulösen.
Beispiel:
Präsentieren Sie beispielsweise hervorgehobene Häuser in einer Galerie und ermöglichen Sie Benutzern, auf jedes Bild zu klicken, um auf einer separaten Seite weitere Details anzuzeigen.
Darstellung und Stil
Mit den Stilattributen können Sie das visuelle Erscheinungsbild jedes Elements in der Galerie steuern. Die Einstellungen sind nach ihrer Wirkung gruppiert.
Allgemeine Galerieeinstellungen
Gilt für alle Varianten (Karussell, Tabs, Raster, Galerie).
Größe
Gesamte Breite und Höhe der Galerie.
Rahmen
Rahmenstil, -breite und -farbe um die Galerie.
Beschriftung
Formatierung des Beschriftungstextes, der bei jedem Element angezeigt wird.
Titel
Formatierung des Titels auf jedem Element.
Inhalt
Formatierung des Hauptinhaltsbereichs innerhalb jedes Elements.
Medien
Wie Bilder und Videos angezeigt werden (Anpassung, Ausrichtung, Größe).
Karussell-Variante
Gilt nur, wenn Variante auf Karussells.
Slideshow-Element
Hintergrund, Ausrichtung und Abstand jedes Karussellelements.
Titel des Slideshow-Elements
Schriftart, Größe und Farbe der Elementtitel.
Beschreibung des Slideshow-Elements
Schriftart, Größe und Farbe der Elementbeschreibungen.
Slideshow-Bild
Größe und Rahmen der Bilder innerhalb jedes Elements.
Aktiver Slideshow-Indikator
Stil des Indikators für das aktuell angezeigte Element.
Inaktiver Slideshow-Indikator
Stil der Indikatoren für nicht aktive Elemente.
Slideshow-Navigationsschaltfläche
Stil der Navigationsschaltflächen für vorheriges/nächstes.
Tabs-Variante
Gilt nur, wenn Variante auf Registerkarten.
Tab
Formatierung jedes einzelnen Tabs.
Tab-Rahmen
Rahmen um jeden Tab.
Aktiver/Hover-Tab-Rahmen
Rahmen für den aktiven Tab und den Hover-Zustand.
Tab-Hintergrund
Hintergrundfarbe oder -bild für Tabs.
Tab-Beschriftung
Schriftart, Größe und Farbe der Tab-Beschriftungen.
Tab-Untertitel
Schriftart, Größe und Farbe der Tab-Untertitel.
Fehlerbehebung
Bilder werden in Experience Builder nicht in der Vorschau angezeigt, erscheinen aber auf der veröffentlichten Site korrekt
Experience Builder authentifiziert sich nicht als Portalbenutzer und kann daher in der Vorschau keine Bilder aus Salesforce Files abrufen.
Erwartetes Verhalten. Melden Sie sich auf der veröffentlichten Site als Community-Benutzer an, um zu überprüfen, ob die Bilder korrekt angezeigt werden.
"Keine Vorschau verfügbar" erscheint im manuellen Modus
Das hochgeladene Bild wurde nicht als öffentlicher Link markiert, sodass Portalbenutzer es nicht laden können.
Laden Sie das Bild erneut hoch und aktivieren Sie Öffentlicher Link beim Hochladen oder wechseln Sie in den Abfragemodus, in dem die standardmäßigen Freigaberegeln gelten.
Der manuelle Modus zwingt Sie dazu, jedes Mal neu hochzuladen, wenn Sie ein Bild ändern möchten
Der manuelle Modus ist ein direkter Uploader – er verweist nicht auf vorhandene Salesforce Files.
Verwenden Sie Abfrage den Modus mit ContentVersion oder einem benutzerdefinierten Objekt, das Dateiverweise enthält. Siehe Vorhandene Salesforce Files als Ihre Medienquelle verwenden oben.
Die Galerie ist für Portalbenutzer leer, funktioniert aber in der Experience-Builder-Vorschau
Dem Profil des Portalbenutzers fehlt der Zugriff auf das abgefragte Objekt oder auf die referenzierten Dateien.
Prüfen Sie Objektberechtigungen des Profils, Feldzugriff auf Feldebene und Bibliotheks-/Freigabezugriff auf ContentVersion oder das Quellobjekt.
Bilder werden überhaupt nicht angezeigt (weder in der Vorschau noch auf der veröffentlichten Site)
Medienquelle ist einem Feld zugeordnet, das keinen gültigen Dateiverweis enthält (ContentDocumentId beginnend mit 069…, dem Version Data URL Feld auf ContentVersion oder einer öffentlichen Bild-URL).
Überprüfen Sie, was das zugeordnete Feld tatsächlich enthält. Beim Abfragen von ContentVersion verwenden Sie das Standard Version Data URL Feld. Speichern Sie bei benutzerdefinierten Objekten eine ContentDocumentId (beginnend mit 069…) und ordnen Sie Medienquelle direkt diesem Feld zu.
Die Galerie zeigt die richtigen Titel an, aber alle Bilder sind fehlerhaft
Medienquelle ist einem Feld zugeordnet, das keine ContentDocumentId oder gültige URL enthält.
Bestätigen Sie in den Datenzuordnungen, dass Medienquelle auf ein ContentDocumentId-Feld, eine Shepherd-URL oder eine gültige öffentliche Bild-URL verweist.
Anwendungsbeispiele
Beispiel 1: Kunden-News-Karussell
Halten Sie Ihre Kunden informiert und eingebunden, indem Sie Ihre neuesten Artikel direkt auf Ihrer Experience-Cloud-Startseite präsentieren. Die AX-Galerie-Komponente macht es einfach, ein dynamisches, bildreiches Nachrichtenkarussell anzuzeigen, das sich automatisch aktualisiert, sobald neue Inhalte veröffentlicht werden.
Was Sie erreichen werden
Frische Inhalte auf einen Blick: Stellen Sie Ihre neuesten Knowledge-Artikel samt Bildern auf der Startseite bereit, damit Besucher keine Aktualisierung verpassen.
Müheloses Durchsuchen: Lassen Sie Kunden durch Unternehmensnachrichten in einem sauberen, strukturierten Karussell-Layout blättern.
Gezielte Filterung: Zeigen Sie nur News-Artikel an, indem Sie ein benutzerdefiniertes Picklist-Feld verwenden, damit das Karussell fokussiert und relevant bleibt.
Bevor Sie beginnen
ImageId__cFeld: Erstellen Sie ein Textfeld auf dem Knowledge-Objekt, um die Content-Document-ID des Bildes jedes Artikels zu speichern.Type__cFeld: Erstellen Sie ein Picklist-Feld auf dem Knowledge-Objekt, um Artikel zu kategorisieren, und stellen Sie sicher, dass der Neuigkeiten Wert vorhanden ist und auf Ihre Artikel angewendet wird.
So richten Sie es ein
Richten Sie Ihre Datenquelle ein
Erstellen Sie eine neue Abfrage in der Konfiguration der Datenquelle.
Wählen Sie Knowledge als Objekt (stellen Sie sicher, dass Sie in der Liste die zweite Knowledge-Option auswählen).
Fügen Sie einen Filter hinzu: Type__c gleich
Neuigkeiten.Legen Sie die Sortierreihenfolge fest auf Erstellungsdatum, absteigend sodass Ihre neuesten Artikel immer zuerst erscheinen.
Beispiel 2: Produktgalerie für Kunden
Geben Sie Ihren Kunden eine visuell überzeugende Möglichkeit, Ihren Produktkatalog direkt von Ihrer Startseite aus zu entdecken. Durch die Kombination der AX-Galerie-Komponente mit Ihren Produktdaten können Sie ein auffälliges Karussell erstellen, das hervorgehobene Produkte betont und Besucher direkt zu den Produktdetailseiten führt.
Was Sie erreichen werden
Eine visuelle Produktpräsentation: Zeigen Sie hervorgehobene Kopfhörer in einem reich bebilderten, bildstarken Karussell, das zum Durchstöbern einlädt.
Nahtlose Navigation: Ermöglichen Sie Kunden, mühelos direkt vom Karussell zu einzelnen Produktdetailseiten zu wechseln.
Ein kuratiertes Homepage-Erlebnis: Heben Sie die wichtigsten Produkte hervor, indem Sie auf der Startseite nur Ihren hervorgehobenen Katalog anzeigen.
Bevor Sie beginnen
Type__cFeld: Erstellen Sie ein Picklist-Feld auf dem Product2-Objekt und stellen Sie sicher, dass der Kopfhörer Wert vorhanden ist, damit Sie das Karussell auf die richtigen Produkte filtern können.ContentDocumentId__cFeld: Erstellen Sie ein Textfeld auf dem Product2-Objekt, um die Bild-URL für jedes Produkt zu speichern.
So richten Sie es ein
Zuletzt aktualisiert
War das hilfreich?