Video zu Layoutvorlagen und Design
Mit einer Layoutvorlage wird bestimmt, wie Sammlungen auf Durchsuchen-Seiten angezeigt werden. Elemente in einer Sammlung werden im Layout der Durchsuchen-Seite als Karten angezeigt. Wenn Sie eine Layoutvorlage erstellen, führen Sie folgende Schritte durch:
- Definieren Sie die Layouteigenschaften, z. B. die Spaltenanzahl, die Werte für Ränder und Bundstege und die Zellenform.
- Erstellen Sie Karten und definieren Sie das Erscheinungsbild der Karten.
- Legen Sie Zuordnungsregeln auf Grundlage von Metadaten fest, um zu bestimmen, welche Inhalte den Karten zugeordnet werden.
Das Erscheinungsbild der Durchsuchen-Seite wird durch das Design des Layouts und der Karten sowie durch die Metadateneinstellungen der Sammlungselemente bestimmt.

Karten bestimmen das Erscheinungsbild von Inhalten auf der Durchsuchen-Seite. Die Miniaturbilder können auf Karten verschiedener Größe je nach Layouteinstellungen unterschiedlich dargestellt werden. Beispielsweise kann das Miniaturbild einer Karte des Formats 3 x 1 nach Aktualisierung der Metadaten auf einer Karte der Maße 1 x 1 angezeigt werden.

Hinweise:
- Innerhalb einer Layoutvorlage können Sie unterschiedliche Layouts (auch als „Darstellungen“ bezeichnet) für Tablets, Smartphones und das Web definieren.
- Ebenso wird das Anpinnen von Karten an bestimmten Stellen des Rasters erst in einer kommenden Version implementiert.
- Auch Zuordnungsregeln können noch nicht dafür verwendet werden, die Reihenfolge der Inhalte zu bestimmen. Mithilfe von Zuordnungsregeln wird festgelegt, welche Inhalte Karten zugewiesen werden sollen.
Das Authoring-Werkzeug für Durchsuchen-Seiten ist eine neue Möglichkeit zum Erstellen von Karten und Layouts. Vorläufig können Sie entweder das neue Authoring-Werkzeug für Durchsuchen-Seiten oder die vorhandenen Registerkarten für Karten und Layouts verwenden, um Durchsuchen-Seiten zu entwerfen.
Mit dem Authoring-Werkzeug für Durchsuchen-Seiten können Sie über die gleiche Oberfläche Layouts erstellen, Karten entwerfen und den Karten Inhalten zuordnen. Beim Erstellen können Sie eine vorhandene Sammlung angeben, die angezeigt werden soll, während Sie die Einstellungen für die Durchsuchen-Seite anpassen. Sie können die Zielgerätgröße ändern, Raster aktivieren und deaktivieren und auf einen Kartenbereich klicken, um die Einstellungen für den jeweiligen Text- oder Bildbereich zu bearbeiten. Sie können sogar die Elemente in der Sammlung, die Sie importiert haben, neu anordnen.
Wenn Sie eine neue Version eines Layouts erstellen möchten, die auf den Einstellungen eines vorhandenen Layouts beruht, können Sie zuvor erstellte Layouts importieren.
Damit Layoutvorlagen verwendet werden können, muss eine App mit Version 2015.8 (Dezember 2015) oder höher erstellt werden.
-
Klicken Sie im On-Demand-Portal (https://aemmobile.adobe.com) auf Inhalt und Layouts > Layoutvorlagen.
-
Geben Sie rechts im Layoutwerkzeug für Durchsuchen-Seiten einen Layoutnamen an und definieren Sie Layouteinstellungen wie die Anzahl der Spalten sowie Abstände für Ränder und Bundstege.
Sammlung importieren
Klicken Sie auf „Sammlung importieren“ und importieren Sie eine Ihrer Sammlungen, um zu sehen, welche Auswirkungen Ihre Änderungen auf den Zielinhalt haben. Beim Speichern des Layouts können Sie das Layout auf die Sammlung anwenden. Sie können Elemente in den Sammlungen auch neu anordnen. Diese Änderungen an der Sammlung bleiben erhalten, wenn Sie die Layoutvorlage speichern.
Vorschaumenü
Im Vorschaumenü können Sie Querformat oder Hochformat auswählen. Wählen Sie eine Zielgerätgröße aus. Wenn Sie Änderungen an einem Layout vornehmen, wählen Sie verschiedene Gerätegrößen für die Vorschau aus, um sicherzustellen, dass der Inhalt auf allen Zielgeräten verwendet werden kann.
-
Klicken Sie auf das Pluszeichen, um eine Karte zu erstellen. Geben Sie im Bedienfeld ganz rechts einen Kartennamen an und ändern Sie die Einstellungen. Die Optionen, die im rechten Bedienfeld angezeigt werden, hängen davon ab, welcher Kartenbereich gerade ausgewählt ist.
Wenn Sie den Textbereich bearbeiten möchten, erweitern Sie die Karteneigenschaften auf der linken Seite und wählen Sie das gewünschte Element aus, z. B. ein Bild oder einen Textbereich. Wenn keine Kartenmetadaten angezeigt werden sollen, klicken Sie neben den Metadaten auf das Symbol zum Ausblenden.
Sie können auch in den mittleren Vorschaubereich klicken, um die Einstellungen für diesen Bereich zu bearbeiten. Experimentieren Sie mit den Einstellungen über dem Vorschaubereich, um die Zoomeinstellung zu ändern, das Layout oder die Karte anzuzeigen oder Inhalte anzuzeigen bzw. auszublenden.
-
Klicken Sie auf „Zuordnung“ und klicken Sie dann neben der ausgewählten Karte auf „Regel hinzufügen“.
Definieren Sie die Zuordnungseigenschaften. Sie können beispielsweise eine Regel für Banner mit hoher Relevanz festlegen. Beim Festlegen der Zuordnungsregeln können Sie in einer Vorschau anzeigen, welcher Inhalt in Ihrer Sammlung dieser Karte zugewiesen ist.
Ziehen Sie Elemente in der Sammlung, um ihre Reihenfolge zu ändern. Wenn Sie die Layoutvorlage speichern, werden diese Änderungen übernommen.
Ein Layout bestimmt die grundsätzliche Darstellung der Durchsuchen-Seite von Sammlungen.
Wenn Sie unterschiedliche Layouts für Smartphones und Tablets verwenden möchten, definieren Sie mehrere Layouts (als „Layoutdarstellungen“ bezeichnet) in einer Layoutvorlage, wie weiter unten beschrieben.
Geben Sie die folgenden Layouteinstellungen an:
Zellenseitenverhältnis
Mithilfe dieser Option können Sie die Zellenform ändern, die als Verhältnis Breite:Höhe dargestellt wird. Bei einer Zelle mit dem Verhältnis 1:1 handelt es sich um ein Quadrat, bei einer Zelle mit der Größe 4:3 um ein liegendes Rechteck und bei einer Zelle der Maße 3:4 um ein stehendes Rechteck. Wenn Sie eine positive Zahl wie 3,5 angeben, erstellen Sie eine Zelle mit dem Seitenverhältnis 3,5:1.
Spalten
Legen Sie die Spaltenanzahl fest. Beachten Sie, dass eine Karte nicht mehr Spalten als das Layout enthalten kann.
Einheiten für Bundstege und Ränder
Geben Sie an, ob Sie geräteunabhängige Pixel (Device Independent Pixels – DIP) oder Prozentwerte verwenden möchten, um Werte für Bundstege und Ränder festzulegen. Mit Bundstegen wird der Abstand zwischen Karten bestimmt. Ränder bezeichnen den Abstand zwischen der äußeren Kartenkante und dem Ansichtsbereich des Geräts.
Hintergrundfarbe des Layouts
Legen Sie eine Farbe für den Hintergrund der Durchsuchen-Seite fest. Diese Farbe wird von Rändern und Bundstegen angenommen und kann auch durch transparente Karten hindurchscheinen.
Hintergrundbild
Wenn Sie diese Option auswählen, wird das als Hintergrundbild der Sammlung festgelegte Bild auf der Durchsuchen-Seite angezeigt. Wenn sowohl ein Hintergrundbild als auch eine Hintergrundfarbe des Layouts angegeben werden, hat das Hintergrundbild Vorrang. Wenn das Hintergrundbild transparente Bereiche enthält, ist die Hintergrundfarbe sichtbar. Das Hintergrundbild wird auf dem gesamten Bildschirm angezeigt und skaliert, um den Bildschirm auszufüllen. Es ist außerdem statisch. Karten werden vor dem Sammlungshintergrund geblättert.
Nachdem Sie eine Karte erstellt haben, legen Sie die Charakteristiken des Entwurfs fest, definieren die Anzahl an Layoutzellen, die eine Karte einnehmen soll, und bestimmen andere Eigenschaften. Allerdings geben Sie hier noch nicht an, welcher Inhalt mit der Karte verknüpft wird. Dies geschieht erst bei der Einrichtung von Zuordnungsregeln.
Die tatsächliche Kartenform und -größe ist abhängig vom Layout, dem die Karte zugewiesen wird. Eine Karte mit dem Format 3 x 2 wird in einem dreispaltigen Layout anders aussehen als dieselbe Karte in einem Layout mit zwölf Spalten.
Wenn Sie Einstellungen angeben, wird im Vorschaubereich eine ungefähre Darstellung der Karte mit dem Inhalt aus der importierten Sammlung angezeigt.
Wenn Sie Karteneinstellungen vornehmen, sollten Sie bereits mit den zugrunde liegenden Konzepten vertraut sein, z. B. damit, wie sich die verschiedenen Elemente auf einer Karte zueinander verhalten.
Reihenfolge oder Hierarchie
Der Kartenhintergrund befindet sich direkt über dem Layout. Der Kartenbildbereich folgt dem Kartenhintergrund als nächsthöhere Ebene. Der Kartentextbereich wiederum ist über dem Kartenbildbereich angesiedelt.
Kartenbilder
Bilder für Sammlungen, Artikel, Banner und Sammlungshintergründe werden, um den Kartenbildbereich auszufüllen, je nach Bedarf zentriert, skaliert bzw. zugeschnitten.
Karten werden auf der Durchsuchen-Seite einer Sammlung angezeigt. Karten können halbtransparente Bereiche aufweisen, die die Hintergrundfarbe oder das Sammlungsbild durchscheinen lassen. Bestimmte Teile einer Karte selbst können halbtransparent sein, sodass sich die Lesbarkeit des Textes verbessert oder ein Kartenbild eingefärbt wird. Kartenbilder sind jedoch stets deckend.
Kartenformat
Wenn Sie als Kartenformat „Bild links“ oder „Bild rechts“ festlegen, muss das Layout, in das die Karte später gesetzt wird, ausreichend Platz lassen, damit die Metadaten für Bild- und Textbereich nebeneinander angezeigt werden können. Um zu verhindern, dass der Textbereich abgeschnitten wird, ist es möglicherweise nötig, das Zellenseitenverhältnis des Layouts zu ändern oder die Karte zu verbreitern.
Hintergründe, Rahmen und Ränder
Sie können Karten verschiedene Farben und Transparenzwerte zuweisen. Die Kartenfarbe dient als Hintergrund für das Kartenbild und die Textbereiche.
Der Kartenhintergrund kann durch Bilder, Textbereiche und Rahmen überdeckt werden. Bild und Textbereiche befinden sich über dem Kartenhintergrund. Sowohl Bilder als auch Textbereiche verfügen über Ränder.
Durch Ränder werden Bild und Textbereiche von der Kartenkante aus nach innen verschoben. Über Ränder steuern Sie, wie viel vom halbtransparenten Kartenhintergrund sichtbar ist. Ein Bild kann über farbige, transparente Überlagerungen verfügen, durch die es eingefärbt werden kann. Für Textbereiche kann außerdem ein Innenabstand angegeben werden, durch den die Beschriftungen (Metadaten) von der Kante des Textbereichs aus nach innen verschoben werden.
Auch Textbereiche können einen farbigen, transparenten Hintergrund aufweisen. Mithilfe von Hintergrundfarben lässt sich der Kontrast erhöhen oder die Lesbarkeit von Texten verbessern.
Rahmen können nicht transparent sein. Durch sie werden alle Elemente von der Kante der Karte aus nach innen verschoben. Soll der Layouthintergrund durch eine halbtransparente Kartenkante hindurch sichtbar sein, verwenden Sie Ränder bei Bildern oder Textbereichen. Soll zwischen Karten nur etwas Platz frei bleiben, entwerfen Sie ein Layout mit Bundstegen.

Geräteunabhängige Pixel (Device Independent Pixels – DIP)
Geräteunabhängige Pixel sind eine abstraktere Form von Pixeln. Sie kommen in Apps zur Anwendung und werden zur Anzeige in physische Pixel umgewandelt. Ein Rahmen von 10 dip behält dieselbe relative Größe, ob er nun auf einem SD-iPad mit 1024 x 768 Pixel oder einem HD-iPad mit 2048 x 1536 Pixel angezeigt wird.
Metadatenfelder
Ein Metadatenfeld kann Text und bis zu zwei weitere Metadatenelemente enthalten. Wenn Sie ein z. B. Metadatenfeld als {{title}} von {{author}} definieren, werden auf der Karte Artikelmetadaten wie „Angeln in Argentinien von Erika Mustermann“ angezeigt. Es können allerdings auch eigene Felder für {{title}} und {{author}} erstellt werden, sodass die Metadaten in verschiedenen Zeilen der Karte angezeigt werden.
Wenn der der Karte zugeordnete Inhalt keine Metadaten für das angegebene Feld enthält, wird das Feld ignoriert, sofern es keinen zusätzlichen Text enthält, z. B. „von“ in von {{author}}. Standardmäßig enthalten Karten drei Metadatenfelder. Klicken Sie auf das Augensymbol ganz links, um die einzelnen Metadatenfelder ein- oder auszublenden.
Wenn Sie das Metadatenelement {{Published Date (Default)}} auswählen, richtet sich das Format nach dem Gebietsschema und der Sprache des Geräts. Beispielsweise wird das Datum für Englisch (USA) im Format MM/TT/JJJJ und für Deutsch im Format TT/MM/JJJJ angezeigt.
Sie können eine beliebige benutzerdefinierte Schriftart auswählen, die Sie über den Abschnitt Schriftarten und App-Anpassung des Portals hochgeladen haben. Weitere Informationen finden Sie unter AEM Mobile-Apps anpassen: Verwenden von benutzerdefinierten Schriftarten.
Legen Sie Zuordnungsregeln fest, um zu bestimmen, welche Karten auf Grundlage von Metadaten auf Inhalte angewendet werden. Sie können beispielsweise eine Zuordnungsregel erstellen, durch die Artikel mit der Priorität „Hoch“ einer großen Karte zugewiesen werden, und dann eine zweite Zuordnungsregel verwenden, um Artikel mit der Priorität „Normal“ einer kleineren Karte zuzuordnen.
Für jedes Inhaltselement werden die Zuordnungsregeln nacheinander ausgewertet. Die erste Zuordnungsregel, die den Inhaltsmetadaten entspricht, wird angewendet. Der Inhalt muss allen angegebenen Regeleinstellungen entsprechen. Beispiel: Wenn bei einer Zuordnungsregel „Typ“ auf „Banner“ festgelegt und „Relevanz“ als „Hoch“ angegeben wurde, muss es sich bei dem Inhalt um ein Banner mit hoher Wichtigkeit handeln, damit die Regel angewendet wird.
Angenommen, Sie haben eine Karte des Formats 3 x 1 und eine andere Karte der Größe 1 x 1 erstellt. Dann erstellen Sie die erste Zuordnungsregel mit den Einstellungen: „Typ=Artikel“ und „Relevanz=Hoch“. Für die Karte der Größe 1 x 1 erstellen Sie eine zweite Zuordnungsregel, ohne Angaben zu den Metadaten zu machen. In diesem Beispiel sollte die Regel für das Format 3 x 1 Vorrang vor der Regel für das Format 1 x 1 haben. Andernfalls würden Artikel mit hoher Relevanz Karten der Größe 1 x 1 zugeordnet.
Bei den in den Regeleinstellungen eingegebenen Metadaten ist auf Groß- und Kleinschreibung zu achten. Eine Regel mit dem internen Stichwort „blau“ wird nicht auf Inhalte mit dem internen Stichwort „Blau“ angewendet. Verfügt ein Inhalt über verschiedene Stichwörter, muss nur ein Stichwort der Zuordnungsregel entsprechen.
Hinweis: Durch die Kartenzuordnung wird nicht die Reihenfolge der Inhalte auf einer Durchsuchen-Seite bestimmt. Es wird lediglich festgestellt, welche Inhalte Karten zugeordnet werden.
Regel aktiv
Verwenden Sie die Option „Regel aktiv“, um eine Karte nur auf die angegebene Anzahl von Elementen anzuwenden, die den Kriterien entsprechen. Sie können beispielsweise eine Zuordnungsregel erstellen, die eine breite Karte nur auf das erste Element in der Sammlung anwendet. Wählen Sie beim Bearbeiten der Regel „Regel aktiv“ > „Gelegentlich“ und geben Sie dann die Anzahl der Elemente an, auf die die Regel angewendet werden soll.

Elemente zuordnen
Mit der Option „Elemente zuordnen“ können Sie eine Karte bei jeder n-ten Karte anwenden, die die Kriterien erfüllt. Wenn Sie z. B. abwechselnd angezeigte Karten erstellen möchten, erstellen Sie eine Karte, die die Regel auf jede zweite Karte anwendet, beginnend mit dem ersten Element, das der Regel entspricht. In diesem Beispiel würde jedes zweite Element nach dem zweiten Element entsprechend der nächsten zutreffenden Regel formatiert.

Layoutdarstellungen bieten Flexibilität beim Design, da Sie für die gleiche Sammlung verschiedene Darstellungen auf Tablets, Smartphones und im Web Viewer für den Desktop definieren können. Dank dieser neuen Funktion können Sie jetzt den gleichen Inhalt für alle unterstützten Plattformen und Geräte bereitstellen und dabei die Kontrolle über das Design behalten. Wenn Sie eine Layoutvorlage erstellen, können Sie unterschiedliche Layout- und Karteneinstellungen für Tablets, Smartphones und das Web definieren. Die Einstellungen für die Darstellung auf den einzelnen Zielgeräten bestimmen dann je nach Gerät die Darstellung der Durchsuchen-Seite.
Layoutdarstellungen sind insbesondere für Projekte mit einer Sammlung der obersten Ebene hilfreich, können aber auch bei Projekten mit zwei Sammlungen der obersten Ebene effektiv verwendet werden, in denen Sie die gleichen Sammlungen sowohl für Smartphones als auch für Tablets verwenden.
Im folgenden Beispiel werden die Karten in dieser Layoutvorlage auf Tablets und Smartphones unterschiedlich dargestellt.


Wenn Sie eine Layoutvorlage erstellen, wird zunächst nur die Darstellung für Tablets erstellt. Dies ist die Standarddarstellung, die für Tablets, Smartphones und das Web angewendet wird, sofern kein neues Layout für Smartphones oder das Web hinzugefügt wird. Wenn Sie ein Layout (auch als „Darstellung“ bezeichnet) für Smartphones oder das Web hinzufügen, übernimmt die neue Darstellung die Einstellungen aus der Standarddarstellung für Tablets. Danach gelten alle Änderungen, die Sie an den Karten- oder Layouteinstellungen vornehmen, nur für diese Darstellung. (Kartenzuordnungsregeln gelten für alle Darstellungen.)
Hinweis:
Wenn Sie ein Layout in einer frühen Prozessphase erstellen und dann feststellen, dass dies zu früh war, können Sie diese Darstellung löschen, die für alle Darstellungen geltenden Einstellungen ändern und die Darstellung dann erneut erstellen.
-
Erstellen Sie eine Layoutvorlage. Erstellen Sie Karten und wenden Sie Zuordnungsregeln an. Geben Sie die Einstellungen an, die für alle Zielgeräte gelten.
Als bewährtes Verfahren hat sich erwiesen, mit dem Tablet-Layout zu beginnen, die Karten und Zuordnungsregeln hinzuzufügen und die Karten- und Layouteinstellungen zu ändern, die für alle Geräte zutreffen. Erstellen Sie dann ein Smartphone-Layout und ändern Sie die Einstellungen, die nur für Smartphones gelten (wiederholen Sie den Vorgang dann ggf. für das Web). Auf diese Weise vermeiden Sie, die gleichen Einstellungen für jede Darstellung angeben zu müssen.
Wenn Sie ein Layout entfernen möchten, klicken Sie, um das Pulldownmenü für das Layout anzuzeigen, und klicken Sie dann auf das Papierkorbsymbol. Das Standardlayout kann nicht entfernt werden.
Wenn Sie die Zielgröße der Vorschau ändern möchten, wählen Sie im Gerätemenü eine andere Größe.
Wenn Sie das Standardlayout ändern möchten, klicken Sie, um das Pulldownmenü für das Layout anzuzeigen, und wählen Sie dann „Als Standard festlegen“. Das Standardlayout wird dann für jeden Gerätetyp verwendet, der nicht angegeben wurde. Wenn Sie z. B. nur Layouts für Smartphones und Tablets erstellt haben und dann das Smartphone als Standard festlegen, wird das Smartphone-Layout für das Web verwendet.

Im Allgemeinen wird die Reihenfolge der Inhalte in einem Layout durch die Reihenfolge der Inhalte in einer Sammlung bestimmt. Wenn die Anordnung der Karten an einer Seite des Layouts eine Lücke aufweist, kann sich die Reihenfolge der Inhalte auch verändern, da diese Lücken mit kleineren Karten gefüllt werden, die in der Reihenfolge nachgeordnet sind. Beispiel: Der erste Artikel in einem dreispaltigen Raster wird auf einer Karte des Formats 2 x 1 angezeigt, das zweite Element ist einer Karte der Maße 3 x 1 zugeordnet und das dritte Element wurde einer Karte der Größe 1 x 1 zugewiesen. In diesem Fall rückt die Karte der Größe 1 x 1 in die Lücke in der ersten Zeile vor und befindet sich über dem zweiten Element.

Um ein Layout oder eine Layoutvorlage zu löschen, müssen Sie zunächst alle Verweise darauf aus den Sammlungen entfernen. Bearbeiten Sie hierzu die Sammlungen, um ein anderes Layout zuzuweisen. Nachdem Sie ein anderes Layout auf die Sammlungen angewendet haben, müssen Sie diese Sammlungen erneut veröffentlichen, sofern sie bereits einmal veröffentlicht wurden. Sie können dann die Veröffentlichung des Layouts oder der Layoutvorlage zurückziehen und es bzw. sie löschen.
Um eine Karte zu löschen, die nicht Teil einer Layoutvorlage ist, müssen Sie zunächst alle Verweise darauf entfernen. Bearbeiten Sie insbesondere die Layouts, um alle Zuordnungsregeln zu entfernen oder zu ändern, die auf die Karte verweisen. Nachdem Sie die Zuordnungsregeln für das Layout entfernt oder bearbeitet haben, müssen Sie diese Layouts erneut veröffentlichen, sofern sie bereits einmal veröffentlicht wurden. Sie können dann die Veröffentlichung der Karte zurückziehen und sie löschen. (Wenn eine Karte Teil einer Layoutvorlage ist, können Sie sie jederzeit löschen.)
Die Standardkarte und das Standardlayout können nicht gelöscht werden.
Sie können Layoutvorlagen innerhalb eines Kontos aus einem Projekt in ein anderes Projekt kopieren. Wenn das Zielprojekt eine Layoutvorlage mit dem gleichen Namen enthält, können Sie angeben, ob das vorhandene Layout überschrieben oder eine neue Kopie erstellt werden soll.