EN
Suche ...

Abschnitt Bildliste

Verwenden Sie den Abschnitt Bildliste, wenn Sie eine Reihe von Bildern und relevanten Text anzeigen möchten.

In diesem Abschnitt können Sie ganz einfach verschiedene Seiten innerhalb der Website verlinken oder beliebige Links hinzufügen, bei denen Sie für jeden Link auch ein Bild und eine Beschreibung hinzufügen möchten.

In diesem Artikel:

  1. Was ist eine Bildliste?
  2. Hinzufügen eines Bildlistenabschnitts zur Seite
  3. Listenelemente hinzufügen und bearbeiten
  4. Elemente der Sequenzliste
  5. Listeneinträge löschen
  6. Abschnittslayout ändern
  7. Stiloptionen
  8. Der Karussell-Stil
  9. Live-Beispiel

Bildliste

  • Eine Bilderliste ist eine Sammlung von Bildern, in der Sie eine Beschreibung für das Bild hinzufügen und einen Link oder eine Schaltfläche hinzufügen können, um es mit einer anderen Seite auf der Website oder einem anderen Link zu verbinden.

Abschnitt Bildliste hinzufügen

  • Einer Seite kann ein Abschnitt hinzugefügt werden. Sie können entweder einen Abschnitt zu einer bereits vorhandenen Seite hinzufügen oder eine neue Seite erstellen innerhalb Ihrer Website.
  • Auf deiner Seite, Klicken Sie auf blau + Symbol hinzufügen a Neuer Abschnitt auf Ihre Seite.

  • Sie sehen jetzt die Abschnitt Kategorien auf der linken Seite.
  • Wähle die Liste (1) Kategorie und klicken Sie auf die Bildliste Registerkarte (2), aus der Sie wählen können verschiedene Layouts der Bildliste (3).

  • Wählen Sie ein beliebiges Abschnittslayout und klicken Sie darauf, um es Ihrer Seite hinzuzufügen.
Hinweis:

  1. Sie können die Abschnittsbreite über verwalten Abschnittseinstellungen und die Inhaltsbreite aus der Inhaltsstil.
  2. Die ideale Bildgröße, die Sie in diesem Abschnitt hochladen müssen, hängt von der Anzahl der Spalten ab. WEITERE INFORMATIONEN .
  3. Halten Sie die Titel, Untertitel und Beschreibungen kurz und knackig.
  4. Klicken Sie im Beschreibungsfeld auf die Enter Schaltfläche, um einen Zeilenumbruch zu geben und die Shift + Enter Schaltfläche, um mit der nächsten Zeile zu beginnen.

Listenelemente hinzufügen und bearbeiten

Listenelement hinzufügen

Nachdem Sie den Abschnitt hinzugefügt haben:

  • Klicken Sie auf Bildliste bearbeiten (1) Schaltfläche zum Öffnen des Listenelementfensters.

  • Klicken Sie auf Artikel hinzufügen (2) Schaltfläche, um ein neues Listenelement hinzuzufügen.
  • Sie können wählen, um Dduplizieren oder löschen (3) die Listenelemente.

Listenelement bearbeiten

Klicken Sie auf das Listenelement, das Sie bearbeiten möchten. Dadurch werden die Bearbeitungsoptionen für bestimmte Listenelemente geöffnet.

Von hier aus können Sie:

  • Bild hochladen/entfernen (1) für das Listenelement. Sie können auch die festlegen Bildakzentfarbe von hier aus, das beim Schweben des Bildes angezeigt wird.
  • Hinzufügen Titel (2), Untertitel (3), und Beschreibung (4) des Listenelements.
  • Je nach gewähltem Layout finden Sie möglicherweise die Option für Untertitel und Beschreibung bei bestimmten Listenelementen nicht.
    Überprüfen Sie, bevor Sie die Beschreibung hinzufügen fehlen uns die Worte. Artikel.

  • Klicken Sie auf das Link Builder-Symbol der Titellink (5) um den Link-Builder zu öffnen, um den Titel des Listenelements mit einer beliebigen Seite zu verknüpfen. WEITERE INFORMATIONEN About Link-Builder.
  • Stellen Sie den Link so ein, dass er in a geöffnet wird neuen Tab oder im selben Tab (6).
  • Fügen Sie jede Art von hinzu Link (7) zum Listenelement. Sie können einen Button/Bildlink/Social Icon/Textlink hinzufügen. Mehr erfahren.
  • Speichern (8) Ihre Änderungen.

Sehen Sie sich das Bearbeiten eines Bildlistenelements in Aktion an:

Elemente der Sequenzliste

  • Sie können die Listenelemente einfach ziehen und ablegen, um die Reihenfolge zu ändern.

Sehen Sie sich die Sequenzierung der Bildlistenelemente in Aktion an: 

Löschen Sie ein Listenelement

Nachdem Sie ein Listenelement hinzugefügt haben, können Sie es bearbeiten und löschen.

  • Klicken Sie auf Löschen neben dem Element der Bildliste.
  • Tne, klicken Sie auf die Löschen Schaltfläche im Bestätigungs-Popup.
  • Schließlich Speichern Ihre Änderungen.

Sehen Sie sich das Löschen eines Bildlistenelements in Aktion an: 

Note

Ein einmal gelöschter Listeneintrag kann nicht wiederhergestellt werden.

Abschnittslayout

  • Klicken Sie auf Bildliste verwalten (1) Taste.
  • Wähle die Layout (2) Registerkarte.
  • Auswählen (3) das Layout für Ihren Abschnitt und Speichern (4) die Änderungen.

 

Pro Tipp

Um einen Abschnitt in voller Breite bzw. einen Listenabschnitt mit Registerkarten zu erstellen, wählen Sie ein beliebiges Layout im Bereich von 25 bis 29.

Notizen

  • Sie können Ihrer Seite ganz einfach ein Listenlayout mit Registerkarten hinzufügen.
  • Sie haben die Möglichkeit, zwischen einem horizontalen und einem vertikalen Tab-Layout zu wählen.
  • Es hilft bei der Erstellung eines vergleichsbasierten Abschnitts.

Gestalten Sie Ihren Abschnitt

  • Klicken Sie auf Bildliste verwalten (1) .
  • Wähle die Stil (2) Tab.
  • Ändern Sie den Stil für die Abschnittselemente und Speichern (3) Ihre Änderungen.

Sie haben mehrere Stiloptionen für den Abschnitt: 

Artikel 

  1. Wählen Sie auf Artikel anzeigen in Reihen und Spalten or Karussell 
    • Wenn Sie die gewählt haben Reihen und Spalten Option werden die Listenelemente in Zeilen und Spalten angeordnet. In diesem Fall müssen Sie die Anzahl der Zeilen und Spalten angeben.
    • Wenn Sie die gewählt haben Karussell Option werden die Listenelemente als Diashow präsentiert. WEITERE INFORMATIONEN .
  2. Setze die Anzahl der Spalten für die Bilderliste. Sie können zwischen 1 und 10 Spalten wählen.
  3. Präzisiere das Abstand zwischen Spalten der Listenelemente.
  4. Präzisiere das Abstand zwischen Zeilen der Listenelemente.
  5. Wähle die Inhaltsreihenfolge dh die Bilder der Listenelemente, die zuerst angezeigt werden sollen, oder der zugehörige Text.
  6. Ausrichten den Inhalt horizontal in der Bilderliste. Sie können sie linksbündig, rechtsbündig oder zentriert einstellen.
  7. Ausrichten den Inhalt vertikal in der Bildliste. Sie können sie so einstellen, dass sie oben, in der Mitte und unten ausgerichtet sind.

Wenn in Schritt 1 die Option „Karussell“ ausgewählt ist, werden Ihnen die folgenden zusätzlichen Optionen angezeigt:

  1. Wählen Sie auf Machen Sie eine Runde durch das Karussell oder nicht.
  2. Wählen Sie im Falle des Karussells die Navigationssteuerung. Sie können zwischen „Keine Steuerelemente“, „Pfeile – Unten Mitte/Oben rechts/Unten rechts“, „Chevron“ oder „Punkte“ wählen.

Mobile Anzeige

  1. Stellen Sie die Anzahl der ein Rasterspalten für mobile Geräte. Sie können es auf maximal 3 Spalten einstellen.
  2. Definiere das Abstand zwischen Gittern (in Pixel).

Bilder 

  1. Wähle die IMagier Crop für die Listenelemente. Sie können die Bilder als „Quadrat“, „Kreis“, „Horizontal“, „Hochformat“ und „Original“ festlegen.
  2. Wählen Sie einen gemeinsamen Eckenradius oder einen anderen Eckenradius für jede Seite der Listenelemente und legen Sie eine Zahl (in px) für die fest COrdner Radius der Listenelementbilder. WEITERE INFORMATIONEN .

Tipp

Verwendung der Eckenradius können Sie verschiedene Formen von Listenelementbildern erstellen. Wenn Sie hier 500 px angeben, werden die Bilder kreisförmig angezeigt.

  • Falls Sie geteilte Ecken gewählt haben, können Sie für jede Ecke einen anderen Eckenradius einstellen.

Auf Bild Hover 

  1. Wähle die Bild-Hover-Farbe um als Akzentfarbe oder sein angegeben. Wenn Sie die gewählt haben AkzentfarbeGeben Sie dann die an Opazität.
  2. Wenn Sie die gewählt haben Farbe angeben Option setzen Sie dann die Basis-Hover-Farbe und Deckkraft für die Listenelemente.
  3. Setze die verschiedenste Komponenten Farbe für die Listenelemente des Abschnitts.
  4. Wählen Sie auf Animieren Sie die Bilder der Listenelemente beim Hover durch Klicken auf Ja. Überprüfen Sie diese Funktion auf einer Live-Seite.
  5. Wähle ein Animationsstil für Bilder, wenn der Cursor darüber bewegt wird.

Größe & Platz 

  1. Präzisiere das Bildbreite für Listenelemente.
  2. Präzisiere das Inhaltsbreite für die Listenelemente.
  3. Präzisiere das Leerzeichen unter der Abschnittsüberschrift in px.
  4. Präzisiere das Leerzeichen unter Bildern der Listeneinträge (in %).
  5. Präzisiere das Leerzeichen unter den Titeln der Listeneinträge (in %).
  6. Präzisiere das Leerzeichen unter den Untertiteln der Listeneinträge (in %).

Text 

  1. Klicken Sie auf Textstil ändern Schaltfläche, um die zu besuchen Design Abschnitt und Verwalten Sie Ihre Schriftgrößen und -stile. 
  2. Setze die Titel Schriftart für die Listenelemente des Abschnitts.
  3. Setze die Untertitel Schriftart für die Listenelemente des Abschnitts.
  4. Legen Sie die Standardeinstellung fest Beschreibung Schriftart für die Listenelemente des Abschnitts.

Karten 

  1. Sehen Sie, wie Karten zu verwalten.

Shadow

  1. Display – Wählen Sie, ob der Schatten hinter den Listenelementen immer oder nur beim Hover angezeigt werden soll.
  2. Design – Wählen Sie aus vorhandenen Voreinstellungen oder erstellen Sie einen benutzerdefinierten Schatten.
    Falls Sie die benutzerdefinierte Option gewählt haben, besuchen Sie diese Box-Schatten-Generator um einen benutzerdefinierten Schatten zu erstellen. Zum Schluss kopieren und einfügen Box-Schatten-CSS.
  3. Falls Sie die Option Voreinstellungen gewählt haben, dann Wählen Sie Schattenstile aus dem Dropdown.

  1. Sehen Sie, wie um das Styling zu verwalten Schaltflächen und Links.
  2. Speichern alle Stiländerungen.

Der Karussell-Stil

Der Karussell-Stil zeigt Listenelemente als Diashow, dh die Listenelemente werden nacheinander durchlaufen.

Sehen Sie, wie der Karussellstil funktioniert: 

Hier ist eine Live-Bildliste: 

Sehen Sie sich eine Live-Demo-Site an. 

Sehen Sie, wie der Eckenradius funktioniert: 

Stichwort:

Können Sie nicht finden, wonach Sie suchen?

Wenden Sie sich an einen Pixpa-Experten.

Kontakt