Debut

Debut ist ein flexibles Theme, das für alle Shops unabhängig von der Größe des Inventars geeignet ist. Mit Debut können Sie schnell einen Shop einrichten und mit dem Verkauf beginnen. Debut sieht auch ohne Theme-Anpassungen edel und ansprechend aus.

Beispiel-Onlineshop mit dem Theme

Debut ist ideal, wenn Sie:

  • sofort mit dem Verkauf beginnen möchten, ohne viele Anpassungen an Ihrem Theme vornehmen zu müssen.
  • sicherstellen möchten, dass Ihr Shop auf Tablets und Smartphones optimal angezeigt wird.
  • das Layout Ihres Shops einfach umgestalten und Ihre Änderungen in Echtzeit verfolgen möchten.

Abschnitte sind anpassbare Inhaltsblöcke, die das Layout der verschiedenen Seiten Ihres Onlineshops bestimmen.

  • Jeder Seitentyp hat seine eigenen Abschnitte. So bestimmt beispielsweise der Abschnitt Produktseiten das Layout jeder Produktseite in Ihrem Onlineshop.

  • Home-Abschnitte enthalten bestimmte Features bzw. Extras, z. B. eine Slideshow oder eine Möglichkeit zur Newsletter-Anmeldung, die Sie hinzufügen, neu anordnen oder entfernen können. Sie können bis zu 25 Abschnitte auf Ihrer Startseite haben.

  • Seitenabschnitte befinden sich immer in bestimmten Bereichen in Ihrem Onlineshop. Sie können Anpassungen daran vornehmen, sie aber nicht neu anordnen oder entfernen.

  • Jedes Theme enthält feste Abschnitte wie Header und Fußzeile, die auf jeder Seite Ihres Onlineshops angezeigt werden.

Erfahren Sie mehr über die einzigartige Auswahl an Abschnitten von und wie Sie diese optimale an Ihr Geschäft anpassen.

Debut enthält die folgenden statischen Abschnitte:

  • Header 

  • Fußzeile
  • Produktseiten
  • Kategorieseiten
  • Listenseite für Kategorien
  • Blog-Seiten
  • Beiträge
  • Warenkorbseite

Dynamische Abschnitte Sie können dynamische Abschnitte hinzufügen, neu anordnen, und entfernen, um das Layout Ihrer Startseite anzupassen. Jedes Theme hat eine einzigartige Auswahl dynamischer Abschnitte zur Auswahl.

Debut enthält die folgenden dynamischen Abschnitte:

  • Blog-Beiträge

  • Kategorieliste
  • Featured Kategorie
  • Galerie
  • Bild mit Text
  • Bild mit Textüberlagerung
  • Logoliste
  • Slideshow
  • Vorgestelltes Produkt
  • Newsletter
  • Karte
  • Rich Text
  • Testimonials
  • Textspalten mit Fotos
  • Personalisierter Content

Im Header-Abschnitt können Sie den Inhalt bearbeiten, der oben auf jeder Seite Ihres Shops angezeigt wird. Sie können ein Logo-Bild hinzufügen, das anzuzeigende Menü auswählen und eine Ankündigungsnachricht erstellen.

Die Header-Leiste auf einer Website namens

So passen Sie den Header-Abschnitt an:

  1. Finden Sie Debut und klicken Sie dann auf Anpassen.

  2. Klicken Sie auf Abschnitte.

  3. Klicken Sie auf Kopfzeile.

  4. Um die Ausrichtung Ihres Logos festzulegen, wählen Sie im Bereich Logo-Ausrichtung die Option Links oder Mittig aus. Wenn Sie kein Logo-Bild hinzufügen, wird stattdessen der Name Ihres Shops als Text angezeigt. Sie können den Namen Ihres Shops auf der Seite Allgemeine Einstellungen im Adminbereich ändern.

  5. Um ein Logo hinzuzufügen, klicken Sie im Bereich Logo-Bild auf Bild auswählen. Um ein Bild von Ihrem Computer hochzuladen, klicken Sie auf Hochladen. Um ein kostenloses Bild aus Burst zu verwenden, klicken Sie auf Kostenlose Bilder.

  6. Um die Größe Ihres Logos zu ändern, stellen Sie den Schieberegler Benutzerdefinierte Logobreite auf die gewünschte Breite ein. Durch das Anpassen der Logobreite wird das Logo nicht verzerrt.

  7. Um auszuwählen, welches Menü im Header angezeigt werden soll, klicken Sie im Bereich Menü auf Ändern. Wählen Sie ein vorhandenes Menü oder erstellen Sie ein neues Menü, indem Sie auf Menü erstellen klicken. Wenn in Ihrem Header kein Menü angezeigt werden soll, klicken Sie auf Entfernen.

  8. Führen Sie die folgenden Schritte aus, um eine Ankündigungsnachricht oben auf der Seite anzuzeigen:

    1. Aktivieren Sie im Bereich Ankündigungsleiste die Option Ankündigung anzeigen.
    2. Um die Ankündigung nur auf der Startseite anzuzeigen, aktivieren Sie Nur Startseite. Andernfalls wird die Ankündigung auf jeder Seite in Ihrem Shop angezeigt.
    3. Geben Sie den Text für die Ankündigung in das Feld Text ein.
    4. Um einen Link zur Ankündigung hinzuzufügen, geben Sie die URL in das Feld Link ein.
    5. Um die Hintergrundfarbe der Ankündigungsleiste zu ändern, klicken Sie auf das Farbfeld Leiste und wählen Sie eine Farbe aus.
    6. Um die Farbe des Ankündigungstexts zu ändern, klicken Sie auf das Farbfeld Text und wählen Sie eine Farbe aus.
  9. Klicken Sie auf Speichern.

Fußzeile

Im Fußzeilenabschnitt können Sie den Inhalt bearbeiten, der oben auf jeder Seite Ihres Shops angezeigt wird. Sie können die folgenden Funktionen zu Ihrer Fußzeile hinzufügen:

  • bis zu zwei Menüs
  • Newsletter-Anmeldung
  • Zahlungssymbole

Fußzeilenbereich einer Website, in dem ein Menü, eine Newsletter-Anmeldung und ein Copyright-Text angezeigt werden.

So passen Sie den Fußzeilenabschnitt an:

  1. Finden Sie Debut und klicken Sie dann auf Anpassen.

  2. Klicken Sie auf Abschnitte.

  3. Klicken Sie dann auf Fußzeile.

  4. Passen Sie das primäre Fußzeilenmenü im Bereich Primäres Menü an. Um das Standardmenü zu bearbeiten, klicken Sie auf Menü bearbeiten. Um zu einem anderen Menü zu wechseln, klicken Sie auf Ändern , und wählen Sie ein vorhandenes Menü, oder klicken Sie auf Menü erstellen.

  5. Fügen Sie ein zusätzliches Menü zu Ihrer Fußzeile im Bereich Zusätzliches Menü hinzu.

  6. So fügen Sie eine Newsletter-Anmeldung zu Ihrer Fußzeile hinzu:

    1. Aktivieren Sie Newsletter-Anmeldung anzeigen.
    2. Geben Sie im Feld Subtext eine Unterüberschrift für Ihre Newsletter-Anmeldung ein.
  7. Fügen Sie Zahlungssymbole, wie Mastercard oder PayPal, zu Ihrer Fußzeile hinzu, indem Sie Zahlungssymbole anzeigen aktivieren.

  8. Klicken Sie auf Speichern.

Produktseiten

Im Abschnitt Produktseiten können Sie die folgenden Elemente hinzufügen oder entfernen:

  • Eine Mengenauswahl
  • Variantenbezeichnungen
  • Die Produktmarke oder den Produktanbieter
  • Bildzoom
  • Einen dynamischen Checkout-Button
  • Social-Sharing-Schaltflächen

Sie können auch die Größe Ihrer Bilder festlegen.

So bearbeiten Sie die Einstellungen für Produktseiten:

  1. Wählen Sie im Dropdown-Menü der oberen Leiste den Eintrag Produktseiten aus.

  2. Klicken Sie auf Abschnitte.

  3. Klicken Sie auf Produktseiten.

  4. Um die Größe Ihrer Bilder festzulegen, wählen Sie im Dropdown-Menü Bildgröße die gewünschte Bildgröße aus.

  5. Um eine Mengenauswahl anzuzeigen, aktivieren Sie die Option Mengenauswahl anzeigen.

  6. Um Variantenbezeichnungen wie "Größe" und "Farbe" anzuzeigen, aktivieren Sie die Option Variantenbezeichnungen anzeigen. Die angezeigten Variantenbezeichnungen basieren auf den Optionennamen der Varianten für das Produkt.

  7. Um die Produktmarke oder den Lieferanten anzuzeigen, aktivieren Sie Lieferanten anzeigen. Damit eine Marke oder der Lieferant angezeigt werden können, müssen Sie dem Produkt einen Lieferanten hinzufügen.

  8. Wenn Sie möchten, dass Kunden Produktbilder vergrößern können, indem Sie mit dem Mauszeiger darüber fahren, aktivieren Sie die Option Bildzoom aktivieren.

  9. Um einen dynamischen Checkout-Button anzuzeigen, aktivieren Sie die Option dynamischen Checkout-Button anzeigen.

  10. Um Social-Sharing-Buttons anzuzeigen, aktivieren Sie das Kontrollkästchen für die Option Schaltflächen für das Teilen in sozialen Netzwerken anzeigen.

  11. Klicken Sie auf Speichern.

Kategorieseiten

Sie können Ihre Kategorieseiten so einrichten, dass Ihre Kunden Produkte in der Kategorie filtern und sortieren können. Sie können ein Kategorielayout (entweder ein Raster oder eine Liste) auswählen und festlegen, wie viele Produkte angezeigt werden sollen.

So legen Sie das Layout Ihrer Kategorieseiten fest:

  1. Gehen Sie im Theme-Editor auf eine Kategorieseite.

  2. Klicken Sie auf den Tab Abschnitte.

  3. Klicken Sie auf Kategorieseiten.

  4. Wählen Sie in der Layout-Liste entweder Raster oder Liste.

  5. Wählen Sie die Anzahl der Produkte pro Zeile und die Anzahl der Zeilen pro Seite (wenn Sie den Rasterstil ausgewählt haben) aus den Listen aus.

  6. Wenn Sie ein Kategoriebild oben auf der Seite anzeigen möchten, aktivieren Sie die Option Kategoriebild anzeigen.

  7. Wenn Sie die Produktmarke oder den Anbieter anzeigen möchten, aktivieren Sie die Option Produktanbieter anzeigen.

  8. Wählen Sie die Option Sortierung aktivieren aus, um ein Sortiermenü anzuzeigen.

  9. Aktivieren Sie die Option Tag-Filter aktivieren , damit Ihre Kunden die Kategorie nach Produkt-Tags filtern können.

  10. Klicken Sie auf Speichern.

Listenseite für Kategorien

Die Listenseite für Kategorien zeigt ein Raster all Ihrer Produktkategorien an. Ihre Kunden können die Listenseite für Kategorien verwenden, um schnell die gewünschte Kategorie zum Durchsuchen zu finden. In Debut ist die Listenseite für Kategorien ein übergeordneter Link im Kopfzeilenmenü:

Debut-Startseite mit dem im oberen Menü hervorgehobenen Kataloglink

Hinweis: Der Name Ihres übergeordneten Listenmenüs für Kategorien kann variieren. In diesem Beispiel heißt das Menü "Katalog".

Sie können Miniaturansichten aller Ihrer Kategorien in einem Raster oder eine ausgewählte Kategorie anzeigen. Sie können auch auswählen, wie Kategorien auf der Seite angeordnet werden sollen.

So legen Sie das Layout Ihrer Listenseite für Kategorien fest:

  1. Gehen Sie auf Ihre Listenseite für Kategorien, indem Sie auf das übergeordnete Element des Kategoriemenüs klicken.

  2. Klicken Sie auf den Tab Abschnitte.

  3. Klicken Sie auf Listenseite für Kategorien.

  4. Führen Sie einen der folgenden Schritte aus:

    1. Um Miniaturansichten aller Ihrer Kategorien in einem Raster anzuzeigen, wählen Sie die Option Alle.
    2. Um eine Kategorie in der Listenseite für Kategorien anzuzeigen, markieren Sie Ausgewählt.
  5. Wenn Sie im vorherigen Schritt Alle ausgewählt haben, führen Sie die folgenden Schritte aus:

    1. Wählen Sie eine Sortieroption aus der Liste Kategorien sortieren nach aus.
    2. Wählen Sie die Anzahl der Kategorien pro Zeile in der Liste Kategorien pro Zeile aus.
  6. Klicken Sie auf Speichern.

Blog-Seiten

Mit Debut können Sie Ihre Blog-Beiträge auflisten oder in einem Raster darstellen. Wenn Sie mehr als einen Autor für Ihre Blog-Beiträge haben, können Sie den Namen des Autors für jeden Beitrag anzeigen lassen. Sie können auch das Datum anzeigen, an dem jeder Blog-Beitrag veröffentlicht wurde.

  1. Navigieren Sie zu Ihrer Blog-Seite im Vorschaubereich des Theme-Editors.

  2. Klicken Sie auf Abschnitte.

  3. Klicken Sie auf Blog-Seiten.

  4. Wählen Sie in der Liste Layout aus, ob Blog-Beiträge in einer Liste oder einem Raster angezeigt werden sollen.

  5. Aktivieren Sie die Option Autor anzeigen , um den Namen des Autoren anzuzeigen.

  6. Aktivieren Sie die Option Datum anzeigen , um das Datum anzuzeigen, an dem der Blog-Beitrag veröffentlicht wurde.

  7. Klicken Sie auf Speichern.

Warenkorbseite

Bei Debut können Sie Ihren Kunden die Möglichkeit geben, auf der Warenkorbseite Hinweise zu ihrer Bestellung hinzuzufügen:

  1. Navigieren Sie im Theme-Editor zu Ihrer Warenkorbseite, indem Sie ein Produkt zum Warenkorb hinzufügen.

  2. Klicken Sie auf den Tab Abschnitte.

  3. Klicken Sie auf die Warenkorbseite.

  4. Aktivieren Sie die Option Einkaufswagennotizen aktivieren.

  5. Klicken Sie auf Speichern.

Sie können eine Kategorie auf Ihrer Startseite vorstellen. Vorgestellte Kategorien können Ihnen dabei helfen, Angebote und neue Kategorien hervorzuheben und bekanntzumachen.

Mit Debut können Sie eine Schaltfläche "Alle anzeigen" hinzufügen, damit Kunden sich die gesamte Kategorie anzeigen lassen können. Außerdem können Sie unter jedem Produktbild den Anbieternamen anzeigen.

So stellen Sie eine Kategorie auf Ihrer Startseite vor:

  1. Klicken Sie auf den Tab Abschnitte.

  2. Klicken Sie auf den Abschnitt Vorgestellte Kategorie.

  3. Wenn Sie den Text ändern möchten, der über der Kategorie angezeigt wird, geben Sie den entsprechenden Text in das Feld Überschrift ein.

  4. Wählen Sie in der Liste Kategorie die Kategorie aus, die Sie anzeigen lassen möchten. Um Produkte aus der ausgewählten Kategorie hinzuzufügen oder zu entfernen, klicken Sie auf den Link Kategorie bearbeiten , um die Seite Kategorien in einer neuen Registerkarte zu öffnen.

  5. Wählen Sie in der Liste Produkte pro Zeile die Anzahl der Produkte aus, die in jeder Zeile angezeigt werden sollen.

  6. Wählen Sie in der Liste Zeilen die Anzahl der Produktzeilen aus, die angezeigt werden sollen.

  7. Wenn Sie den Anbieter- oder Markennamen unter jedem Produktbild anzeigen möchten, aktivieren Sie die Option Produktanbieter anzeigen.

  8. Wenn Sie möchten, dass Kunden alle Produkte in der Kategorie anzeigen können, aktivieren Sie die Option Schaltfläche "Alle anzeigen" bereitstellen.

  9. Klicken Sie auf Speichern.

Bild mit Text

Mit Debut können Sie ein Bild mit Text rechts oder links des Bildes hinzufügen. Sie können auch eine Schaltfläche hinzufügen, die auf eine Seite in Ihrem Shop verweist:

In der Regel verwenden Sie einen Abschnitt Bild mit Text , um für ein Produkt oder eine Kategorie zu werben oder den Website-Traffic auf Ihre Blog-Seite zu bringen.

So fügen Sie Ihrer Startseite einen Bereich mit Bild und Text hinzu:

  1. Klicken Sie auf den Tab Abschnitte.

  2. Klicken Sie auf den Abschnitt Bild mit Text.

  3. Klicken Sie im Bereich Bild auf Bild auswählen und führen Sie dann einen der folgenden Schritte aus:

- Um ein Bild auszuwählen, das Sie bereits in Ihren Shopify-Adminbereich hochgeladen haben, klicken Sie auf den Tab Bibliothek. - Um ein Bild aus der Bildersammlung von Shopify Burst auszuwählen, klicken Sie auf die Registerkarte Kostenlose Bilder. Von hier aus können Sie einen Suchbegriff eingeben oder die verschiedenen Bildkategorien durchsuchen. - Um ein Bild von Ihrem Computer auszuwählen, klicken Sie auf den Tab Bibliothek und dann auf die Schaltfläche +.

  1. Wählen Sie in der Liste Layout aus, ob das Bild rechts oder links vom Text angezeigt werden soll.

  2. Geben Sie einen neuen Titel für diesen Abschnitt in das Feld Überschrift ein.

  3. Geben Sie den Text, der unterhalb der Kopfzeile angezeigt werden soll, in das Feld Text ein.

  4. Geben Sie im Feld Button-Beschriftung den Text ein, der auf der Schaltfläche angezeigt werden soll.

  5. Wählen Sie im Feld Schaltflächenlink eine Seite in Ihrem Shop aus, zu der die Schaltfläche verlinken soll.

  6. Klicken Sie auf Speichern.

Bild mit Textüberlagerung

Mit Debut kann die Startseite Ihres Shops ein großes Bild mit überlagerndem Text enthalten, das einen ersten Eindruck von Ihrer Marke vermittelt:

Sie können eine Schaltfläche auf dem Bild hinzufügen, um Ihre Kunden auf eine beliebige Seite Ihres Shops zu leiten. Sie können auch die Ausrichtung des Bildes innerhalb des Abschnitts ändern, die Abschnittshöhe anpassen und einen größeren oder kleineren Text auswählen.

So erstellen Sie ein Bild mit Textüberlagerung:

  1. Klicken Sie auf den Tab Abschnitte.

  2. Klicken Sie auf Bild mit Textüberlagerung.

  3. Klicken Sie im Bereich Bild auf Bild auswählen und führen Sie dann einen der folgenden Schritte aus:

- Um ein Bild auszuwählen, das Sie bereits in Ihren Shopify-Adminbereich hochgeladen haben, klicken Sie auf den Tab Bibliothek. - Um ein Bild aus der Bildersammlung von Shopify Burst auszuwählen, klicken Sie auf die Registerkarte Kostenlose Bilder. Von hier aus können Sie einen Suchbegriff eingeben oder die verschiedenen Bildkategorien durchsuchen. - Um ein Bild von Ihrem Computer auszuwählen, klicken Sie auf den Tab Bibliothek und dann auf die Schaltfläche +.

  1. Legen Sie fest, wie Sie das Bild im Abschnitt ausrichten möchten, indem Sie Oben , Mitte oder Unten in der Liste Bildausrichtung auswählen.

  2. Geben Sie einen neuen Titel für diesen Abschnitt in das Feld Überschrift ein.

  3. Geben Sie den Text, der unterhalb der Kopfzeile angezeigt werden soll, in das Feld Text ein.

  4. Wählen Sie in der Liste Abschnittshöhe eine Bildhöhe aus.

  1. Wählen Sie in der Liste Textgröße eine Größe für den Slideshow-Text aus.

  2. Geben Sie im Feld Button-Beschriftung den Text ein, der auf der Schaltfläche angezeigt werden soll.

  3. Wählen Sie im Feld Schaltflächenlink eine Seite in Ihrem Shop aus, zu der die Schaltfläche verlinken soll.

  4. Klicken Sie auf Speichern.

Newsletter

Sie können eine Newsletter-Anmeldung zu Ihrer Startseite hinzufügen. Auf diese Weise können Sie E-Mail-Adressen von Kunden für E-Mail-Marketingkampagnen sammeln. Auf dem Shopify-Blog können Sie mehr über E-Mail-Marketing erfahren.

Newsletter-Bereich auf einer Website. Es ist ein Feld vorhanden, in dem Kunden eine E-Mail-Adresse eingeben können, und die Schaltfläche

So fügen Sie eine Newsletter-Anmeldung zu Ihrer Startseite hinzu:

  1. Finden Sie Debut und klicken Sie dann auf Anpassen.

  2. Klicken Sie auf Abschnitte.

  3. Klicken Sie auf Bereich hinzufügen > Newsletter.

  4. Geben Sie im Feld Überschrift eine Überschrift für die Newsletter-Anmeldung ein. Die Standardüberschrift ist "Abonnieren Sie unseren Newsletter".

  5. Geben Sie im Feld Subtext eine Unterüberschrift für Ihre Newsletter-Anmeldung ein.

  6. Klicken Sie auf Speichern.

Slideshow

Sie können eine Slideshow mit Bildern zu Ihrer Startseite hinzufügen. Im Bereich Slideshow können Sie die Höhe der Folien festlegen, Text und Schaltflächen hinzufügen und festlegen, ob Ihre Slideshow automatisch wiedergegeben wird.

Die Startseite eines Onlineshops namens

Weitere Informationen zu abgeschnittenen Bildern in Slideshows und empfohlenen Bildgrößen finden Sie in den unten aufgeführten Richtlinien.

So erstellen Sie eine Slideshow:

  1. Finden Sie Debut und klicken Sie dann auf Anpassen.

  2. Klicken Sie auf Abschnitte.

  3. Klicken Sie auf Slideshow.

  4. Legen Sie die Höhe für Ihre Folien im Dropdown-Menü Folienhöhe fest.

    Erfahren Sie mehr darüber, wie sich die Folienhöhe auf Ihre Slideshow auswirkt.

  5. Legen Sie die Größe Ihrer Überschriften und Unterüberschriften im Dropdown-Menü Textgröße fest.

  6. Legen Sie die Position des Textes auf Ihren Folien im Dropdown-Menü Textausrichtung fest.

  7. Optional: Aktivieren Sie die Option Überlagerung anzeigen. Eine Bildüberlagerung ist eine Farbschicht zwischen einem Bild und einem beliebigen Text, der über dem Bild platziert wird. Überlagerungen verbessern den Farbkontrast und die Lesbarkeit. Sie können die Farbe und Opazität der Überlagerung in den Farbeinstellungen festlegen.

  8. Optional: Aktivieren Sie die Option Folien automatisch wechseln , um die Slideshow automatisch wiederzugeben. Wählen Sie mit dem Schieberegler Anzeige der nächsten Folie alle aus, wie lange jede Folie angezeigt werden soll.

  9. So können Sie eine Folie mit einem Bild hinzufügen:

    1. Klicken Sie im Bereich Inhalt auf Folie mit Bild hinzufügen.
    2. Klicken Sie unter Bild auf Bild auswählen. Um ein Bild von Ihrem Computer hochzuladen, klicken Sie auf Hochladen. Um ein kostenloses Bild aus Burst zu verwenden, klicken Sie auf Kostenlose Bilder.
    3. Um festzulegen, wie das Bild in der Slideshow ausgerichtet werden soll, wählen Sie eine Position aus dem Dropdown-Menü Bildposition aus. Mehr über die Bildposition erfahren Sie in den unten aufgeführten Richtlinien.
    4. Um Text zur Bildfolie hinzuzufügen, geben Sie Text in das Feld Überschrift , das Feld Unterüberschrift oder in beide Felder ein.
    5. Fügen Sie eine Schaltfläche zu Ihrer Bildfolie hinzu, indem Sie Text in das Feld Text für Schaltflächenbezeichnung eingeben. Wählen Sie im Feld Schaltflächenlink einen Bereich Ihres Onlineshops aus, auf den die Schaltfläche verlinken soll:

    Das Feld Schaltflächenlink im Theme-Editor. Wenn Sie auf den Link klicken, wird ein Menü mit Kategorien, Produkten, Seiten, Blogs und Blog-Beiträgen angezeigt. Über dieses Menü können Sie eine Verknüpfung zu einer bestimmten Kategorie, einem Produkt usw. erstellen.

  10. Klicken Sie auf Speichern.

Richtlinien für Slideshows

Sie können die unten aufgeführten Einstellungen und Bildempfehlungen verwenden, um festzulegen, wie Ihre Slideshow in Ihrem Onlineshop dargestellt werden soll. Die folgenden Faktoren bestimmen, wie Ihre Folien dargestellt werden:

  • Die Abmessungen Ihrer Bilder
  • Ihre Einstellungen für die Bildposition
  • Ihre Einstellungen für die Folienhöhe
  • Das Verhältnis von Breite zu Höhe Ihrer Bilder

Aufgrund von Unterschieden in der Bildschirmgröße und -form können Ihre Folien auf Mobilgeräten und Desktopgeräten unterschiedlich aussehen.

Empfehlungen für die Bildgröße

Die empfohlenen Abmessungen für Slideshow-Bilder hängen von Ihren Einstellungen für die Folienhöhe ab:

Die Einstellungen für die Folienhöhe im Theme-Editor. Ein Dropdown-Menü für die Folienhöhe enthält die folgenden Optionen: An erstes Bild anpassen, Klein, Mittel und Groß.

Beachten Sie die folgenden Richtlinien:

Einstellung der Folienhöhe Empfohlene Breite Empfohlene Höhe
An erstes Bild anpassen 1200 Pixel 600 Pixel
Klein 1200 Pixel 475 Pixel
Mittel 1200 Pixel 489 Pixel
Groß 1200 Pixel 775 Pixel

Um Ihre Einstellungen für die Folienhöhe aufzurufen oder zu ändern, lesen Sie bitte Schritt 5 in den Anweisungen zur Erstellung einer Slideshow.

Abgeschnittene Bilder

Sie können Maßnahmen ergreifen, um zu steuern, wie Ihre Bilder abgeschnitten werden, oder um abgeschnittene Bilder ganz zu vermeiden.

Abgeschnittene Bilder steuern

In den folgenden Fällen können Sie bei einigen Bildschirmgrößen mit abgeschnittenen Bildern rechnen:

  • Ihre Bilder haben nicht das gleiche Verhältnis von Breite zu Höhe.
  • Ihre Folienhöhe ist auf Klein , Mittel oder Groß eingestellt.
  • Ihre Folienhöhe ist auf An erstes Bild anpassen eingestellt und Ihre Bilder sind größer als der Gerätebildschirm oder das Browserfenster.

Sie können steuern, wie Ihre Bilder abgeschnitten werden, indem Sie die Einstellung Bildposition verwenden:

Die Einstellung für die Bildposition im Theme-Editor. Ein Dropdown-Menü zeigt neun verschiedene Optionen wie

Sie können für jedes Bild auswählen, welcher Bereich beim Beschneiden angezeigt werden soll. Im folgenden Beispiel können Sie sehen, wie das gleiche Bild für einige Bildschirmgrößen abgeschnitten wird. Bei der linken Folie ist die Bildposition auf Mitte zentriert eingestellt. Bei der rechten Folie ist die Bildposition auf Oben links eingestellt:

Eine Beispielfolie, die je nach Einstellung der Bildposition unterschiedlich beschnitten wird.

Um Ihre Einstellungen für die Bildposition aufzurufen oder zu ändern, lesen Sie bitte Schritt 10 in den Anweisungen zur Erstellung einer Slideshow.

Vermeiden Sie abgeschnittene Bilder

Um abgeschnittene Bilder in Ihrer Slideshow zu vermeiden, können Sie die folgenden Schritte probieren:

  • Stellen Sie Ihre Folienhöhe auf An erstes Bild anpassen ein.
  • Verwenden Sie Bilder, die doppelt so breit wie hoch sind. Solche Bilder haben ein Verhältnis von Breite zu Höhe von 2:1. Die empfohlenen Abmessungen sind 1200 x 600 Pixel.
  • Stellen Sie sicher, dass alle Ihre Folien das gleiche Breite-zu-Höhe-Verhältnis haben. Das Verhältnis Ihrer Folien ist wichtiger als ihre Abmessungen in Pixeln.

Im folgenden Beispiel wird ein Slideshow-Bild mit einem Verhältnis von 2:1 auf einem Desktop- und einem Mobilgerät angezeigt:

Eine Folie wird auf einem Desktop und einem Mobilgerät ohne Zuschneiden angezeigt.

Diahöhe

Die Breite des Slideshow-Bereichs beträgt immer 100 % des Browserfensters. Die Höhe Ihrer Folien ist relativ zur Breite. Aufgrund der Unterschiede in der Bildschirmgröße variieren die Breite und Höhe Ihrer Folien auf unterschiedlichen Geräten. Die Höhe Ihrer Folien wird auch von den Einstellungen für die Folienhöhe beeinflusst.

Sie können die Einstellung An erstes Bild anpassen verwenden, um die Höhe Ihrer Slideshow auf die Höhe Ihres ersten Bildes zu beschränken. Diese Einstellung funktioniert am besten, wenn alle Bilder die gleiche Größe oder das gleiche Breite-zu-Höhe-Verhältnis haben. Wenn Ihre Bilder unterschiedlich groß sind oder unterschiedliche Verhältnisse haben, können Sie die Reihenfolge Ihrer Folien ändern, um zu sehen, wie sie mit verschiedenen Höhen aussehen.

Im folgenden Beispiel befindet sich die kleinste Folie an erster Stelle:

Eine kleinere Folie bestimmt die Höhe der beiden anderen Folien. Da die anderen Folien höher sind, werden sie oben und unten abgeschnitten.

Im nächsten Beispiel befindet sich eine größere Folie an erster Stelle:

Eine Folie mit mittlerer Höhe bestimmt die Höhe der anderen beiden Folien. Die Folie, die größer ist, wird oben und unten abgeschnitten. Die Folie, die kleiner ist, wird an den Seiten abgeschnitten.

Wenn Sie stattdessen die Höheneinstellungen Klein , Mittel oder Groß verwenden, lesen Sie die Empfehlungen zur Bildgröße für Ihre Folien.

Bildverhältnisse

Wenn Sie Abgeschnittene Bilder in Ihrer Slideshow vermeiden möchten, beträgt das empfohlene Verhältnis von Breite zu Höhe für Ihre Bilder 2:1.

Wenn Sie sich keine Gedanken um abgeschnittene Bilder auf Desktopbildschirmen machen und Sie auf Mobilgeräten Eindruck hinterlassen möchten, verwenden Sie quadratische Bilder oder Bilder, die höher als breit sind. Die folgende Beispielfolie zeigt ein quadratisches Bild mit einem Verhältnis von Breite zu Höhe von 1:1:

Eine quadratische Folie wird auf einem Desktop und einem mobilen Gerät angezeigt. Das Bild wird auf dem Desktopgerät abgeschnitten, aber nicht auf dem mobilen Gerät.

Die nächste Beispielfolie zeigt ein Porträtbild mit einem Verhältnis von Breite zu Höhe von 2:3:

Eine große Folie wird auf einem Desktop und einem mobilen Gerät angezeigt. Das Bild wird auf dem Desktopgerät abgeschnitten, aber nicht auf dem mobilen Gerät.

Debut enthält die folgenden Theme-Einstellungen: 


  • Farben
  • Typografie
  • Social Media
  • Favicon
  • Bezahlung

Farben

Sie können die Farben für die verschiedenen Abschnitte Ihres Onlineshops bestimmen.

Schritte:

  1. Klicken Sie neben **** auf Anpassen.

  2. Klicken Sie auf Theme-Einstellungen.

  3. Klicken Sie auf Farben.

  4. Klicken Sie für jeden Inhaltstyp auf das Farbfeld, um die Farbauswahl zu verwenden:

    Die Farbauswahl im Theme-Editor

- Der Bereich Zuletzt ausgewählt zeigt Farben an, die Sie zuletzt für Ihr Theme ausgewählt haben. - Im Bereich Aktuell verwendet werden Farben angezeigt, die Sie derzeit in anderen Abschnitten Ihres Themes verwenden.

Um die Farbe auf transparent festzulegen, klicken Sie auf Keine.

  1. Klicken Sie auf Speichern.

Typografie

Sie können die Typografie für den Text Ihres Onlineshops bestimmen.

Schritte:

  1. Klicken Sie neben **** auf Anpassen.

  2. Klicken Sie auf Theme-Einstellungen.

  3. Klicken Sie auf Typografie.

  4. Klicken Sie für jede Art von Text auf Ändern , um die Schriftartenauswahl zu verwenden:

    Die Schaltfläche

  5. Erkunden Sie die verfügbaren Schriftarten über das Suchfeld oder indem Sie auf Weitere laden klicken.

    Um alle verfügbaren Schriftarten anzuzeigen, sehen Sie sich die Schriftartenbibliothek von Shopify an.

  6. Klicken Sie auf den Namen der Schriftart, die Sie verwenden möchten.

  7. Um den Stil der Schriftart zu ändern (z. B. fett oder kursiv), klicken Sie auf Regulär. Klicken Sie als Nächstes auf den gewünschten Stil und dann auf Auswählen :

    Eine Auswahl an Schriftstärken, die über die Schriftartenauswahl verfügbar sind

  8. Klicken Sie auf Speichern.

Social Media

Sie können Ihren Produkten und Blog-Beiträgen Schaltflächen für das Teilen in sozialen Netzwerken sowie Links zu Social-Media-Konten hinzufügen.

So passen Sie die Social-Media-Einstellungen an:

  1. Finden Sie Debut und klicken Sie dann auf Anpassen.

  2. Klicken Sie auf Theme-Einstellungen.

  3. Klicken Sie auf Soziale Medien.

  4. Um ein Social-Sharing-Bild hochzuladen, klicken Sie im Bereich Social-Sharing-Bild auf Bild auswählen oder auf Kostenlose Bilder entdecken.

  5. Um Ihren Produkten und Blog-Beiträgen Schaltflächen für das Teilen in sozialen Netzwerken hinzuzufügen, aktivieren Sie im Bereich Optionen zum Teilen einige oder alle Kontrollkästchen.

    Sie können die folgenden Sharing-Schaltflächen hinzufügen:

- Auf Facebook teilen - Auf Twitter twittern - Auf Pinterest pinnen (nicht verfügbar für das Teilen von Blog-Beiträgen)

  1. Um Links zu Ihren Social-Media-Konten hinzuzufügen, geben Sie im Bereich Konten die Links zu den Konten in die dafür vorgesehenen Felder ein. Geben Sie vollständige Links ein, z. B. https://instagram.com/shopify oder https://twitter.com/shopify.

    Links zu Ihren Social-Media-Konten werden in der Fußzeile Ihres Onlineshops angezeigt.

  2. Klicken Sie auf Speichern.

Hinweis: Um Schaltflächen für das Teilen in sozialen Netzwerken auf Produktseiten und in Blog-Beiträgen anzuzeigen, müssen Sie die Schaltflächen auch in den Abschnitten für diese Seiten aktivieren.

Favicon

Sie können ein Favoriten-Symbol oder ein "Favicon" hochladen, mit dem Sie Ihren Onlineshop markenspezifisch kennzeichnen können, indem Sie Ihr Logo an folgenden Orten anzeigen lassen:

  • im Tab Ihres Webbrowsers
  • im Verlauf Ihres Webbrowsers
  • Symbole auf Ihrem Desktop
  • neben dem Namen Ihres Onlineshops, wenn er zu den Lesezeichen hinzugefügt wird

Die beste Favicon-Bildgröße für Debut ist 32 x 32 Pixel.

So laden Sie ein Favicon hoch:

  1. Klicken Sie im Abschnitt Debut auf Anpassen.

  2. Klicken Sie auf den Tab Theme-Einstellungen.

  3. Klicken Sie auf Favicon.

  4. Klicken Sie im Bereich Favicon-Bild auf Bild auswählen und führen Sie dann einen der folgenden Schritte aus:

- Um ein Bild auszuwählen, das Sie bereits in Ihren Shopify-Adminbereich hochgeladen haben, klicken Sie auf den Tab Bibliothek. - Um ein Bild von Ihrem Computer auszuwählen, klicken Sie auf den Tab Bibliothek und dann auf die Schaltfläche +.

  1. Klicken Sie auf Speichern.

Bezahlung

Sie können Ihre Checkout-Seite so anpassen, dass sie Folgendes enthält:

  • ein benutzerdefiniertes Bannerbild oben auf der Seite
  • das Logo Ihres Shops
  • ein Hintergrundbild oder eine Hintergrundfarbe im Hauptinhaltsbereich
  • benutzerdefinierte Schriftarten und Farben.

Wenn Sie Ihre Änderungen während des Anwendens sehen möchten, gehen im Theme-Editor auf die Checkout-Seite.

So können Sie auf die Einstellungen Ihrer Checkout-Seite zugreifen:

  1. Klicken Sie im Abschnitt Debut auf Anpassen.

  2. Klicken Sie auf den Tab Theme-Einstellungen.

  3. Klicken Sie auf Checkout.

So fügen Sie ein Bannerbild hinzu:

  1. Aktivieren Sie im Bereich Banner das Kontrollkästchen Benutzerdefinierten Hintergrund verwenden.

  2. Klicken Sie auf Datei auswählen , um eine Bilddatei hochzuladen.

So fügen Sie ein Logo hinzu:

  1. Wählen Sie im Bereich Logo die Option Benutzerdefiniert im Dropdown-Menü Bild aus.

  2. Klicken Sie auf den Link Datei auswählen , um eine Bilddatei hochzuladen.

  3. Wählen Sie im Dropdown-Menü Position aus, wo das Bild angezeigt werden soll: rechts, links oder in der Mitte.

  4. Wählen Sie in der Liste Logogröße eine Logogröße aus.

So passen Sie den Hauptinhaltsbereich an:

  1. Aktivieren Sie im Abschnitt Hauptinhaltsbereich das Kontrollkästchen Benutzerdefinierten Hintergrund verwenden.

  2. Führen Sie einen der folgenden Schritte aus:

- Klicken Sie auf Datei auswählen , um eine Bilddatei hochzuladen. - Klicken Sie auf das Farbfeld Hintergrundfarbe , um eine neue Farbe aus der Palette auszuwählen.

  1. Wählen Sie im Dropdown-Menü Formularfelder aus, ob die Felder weiß oder transparent sein sollen.

So passen Sie die Seite Bestellzusammenfassung an:

  1. Aktivieren Sie im Bereich Bestellübersicht das Kontrollkästchen Benutzerdefinierten Hintergrund verwenden.

  2. Führen Sie einen der folgenden Schritte aus:

  3. Klicken Sie auf Datei auswählen , um eine Bilddatei hochzuladen.

  • Klicken Sie auf das Farbfeld Hintergrundfarbe , um eine neue Farbe aus der Palette auszuwählen.

So legen Sie Optionen für die Schrift fest:

  • Wählen Sie im Bereich Typografie aus den entsprechenden Dropdown-Menüs die Schriftart für die Überschrift und den Text aus.

So legen Sie Farboptionen fest:

  • Klicken Sie im Bereich Farben auf das Farbfeld Akzente , Schaltflächen oder Fehler , um eine neue Farbe auszuwählen.

Theme-Stil ändern

Sie können die allgemeinen Einstellungen Ihres Themes auf die Standardwerte zurücksetzen. Wenn Sie den Stil Ihres Themes zurücksetzen, gehen alle Änderungen, die Sie im Tab Allgemeine Einstellungen vorgenommen haben, verloren. Sie werden jedoch keine Inhalte wie Text und Bilder verlieren.

  1. Klicken Sie auf den Tab Allgemeine Einstellungen.

  2. Klicken Sie auf Theme-Stil ändern.

  3. Klicken Sie auf den Button unter Theme-Stil ändern. Der Name dieses Buttons ist normalerweise der Name des Themes.

  4. Klicken Sie auf Stil ändern.

Sind Sie bereit, mit Shopify zu verkaufen?

Probieren Sie es kostenlos aus