Ein Produkt-Block zeigt ein Element aus dem Shop deiner Website auf anderen Seiten oder Beiträgen an. Sie sind eine gute Möglichkeit, Elemente auf deiner Website zu bewerben oder ein Layout zu erstellen, das sich von der integrierten Landing-Page deines Shops unterscheidet. Du kannst für jeden Artikel die Schaltfläche Zum Warenkorb hinzufügen einbeziehen.
Tipp: Um mehr über die Unterschiede zwischen Produkt-Blöcken und Produkt-Seiten zu erfahren, besuche Produkt-Seiten vs. Produkt-Blöcke. In Version 7.1 werden Produkt-Seiten als Shop-Seiten bezeichnet.
Bevor Sie anfangen
- To use Product Blocks, you need a Products Page containing the product you want to display.
- The Products Page containing the product must be enabled. If you disable it, the product won’t appear in shopping carts when added via Product Blocks.
- The product must be published and visible.
Add the Product Block
So fügst du einen Produkt-Block hinzu:
- Bearbeite eine Seite oder einen Beitrag, klicke auf eine Einfügemarke und wähle Produkt aus dem Menü aus. Weitere Informationen findest du unter Inhalte mithilfe von Blöcken hinzufügen.
- In the Find A Product search bar, search for the product you want to display. Click it in the search results to add it. The search displays up to 15 products.
- Customize what product details display using the checkboxes.
- Klicken Sie auf Apply (Anwenden), um Ihre Änderungen zu speichern.
Add product details
Use the checkboxes in the block editor to customize which product details display. These details are pulled from the Item and Options tabs in the product editor:
- Check Show Image to display the product's thumbnail image.
- Check Show Title to display the product's title.
- Check Show Price to display the product's price.
- Check Show Description to display the description of the product.
- Check Show Add to Cart Button to display an Add to Cart button.
To change any of these details, edit the product.
Style den Produkt-Block
Du kannst den Text und die Schriftart des Produkt-Blocks ändern und den Button Zum Warenkorb hinzufügen anpassen.
Schaltflächentext
By default, the text for the Product Block's button is Add to Cart. You can change this text to something else, like Buy Now.
- Open the Products Page containing the product displayed in your Product Block.
- Double-click the product to open the product editor.
- In the Options tab, enter new button text.
Button-Design
Die Art und Weise, wie du das Button-Design ändern kannst, hängt von der Version deiner Website ab.
- Open a page containing a Product Block.
- Klicke im Hauptmenü auf Design und dann auf Buttons.
Näheres erfährst du hier: Buttons gestalten.
- Open a page containing a Product Block.
- Klicken Sie im Hauptmenü auf Design und anschließend auf Website-Stile.
- Scroll down to the style tweaks for buttons.
Näheres erfährst du hier: Buttons gestalten.
Text und Schriftart von Produkt-Blöcken
Um den angezeigten Text zu ändern, gehe zu deiner Shop-Seite und bearbeite die Artikelinformationen.
Die Schriftart der Produktdetails nimmt ihren Stil von den gesamten Schriftarten deiner Website und folgt den Absatz-Anpassungen.
- Klicken Sie im Hauptmenü auf Design und dann auf Schriftarten.
- Klicke auf die
- Klicke auf Absatz.
Die Farben richten sich nach den Farben deiner gesamten Website oder den Abschnittsfarben.
To change the text that displays, go to your Products Page and edit the item information.
The product details fonts take their style from other text styles on your site. In most templates:
- Titel – Folgt der Schriftart des Textkörpers, aber etwas größer. Die Farbe folgt der Link-Farbe des Textkörpers.
- Pricing - Follows the body text font and color, but slightly larger.
- Description - Follows the body text font and color.
There are some exceptions. In these template families:
| Template-Gruppe | Hinweise |
|
Bedford |
|
|
Brine |
|
|
Farro |
|
|
Skye |
|
| Supply |
|
Product Block search tips
When searching for a product to display in the block, the search results are based on the following information:
- Titel
- Descriptions
- Tags
- Kategorien
- Text Blocks in the product's Additional Information
Die Suche zeigt bis zu 15 Treffer an. Wenn deine Produkte ähnliche Namen haben, suche nach dem genauen Titel. Neue Produkte werden möglicherweise nicht sofort in der Suche angezeigt.
FAQ
Can I display multiple products in a Product Block?
No. Product Blocks display one product at a time. However, you can add multiple Product Blocks to a page. You can also display a collection of products using Summary Blocks.
If I use Product Blocks, can I hide my Products Pages?
Yes. If you're using Product Blocks to arrange your store instead of Products Pages, you can hide your Products Pages by moving them to the Not Linked section of the Pages panel. This removes the Products Page from navigation menus while keeping them enabled.
Can I change the size or shape of Product Blocks?
Ja. Wenn Sie den Block zum ersten Mal hinzufügen, wird er die volle Breite des Inhaltsbereichs ausfüllen, wenn sich keine weiteren Blöcke daneben befinden. Hilfe zur Größenänderung von Blöcken finden Sie unter Ändern der Größe von Blöcken und Verschieben von Blöcken, um Layouts anzupassen.
Für die Form des Blocks entspricht das Seitenverhältnis von Produkt-Blöcken dem ursprünglichen Seitenverhältnis des Vorschaubilds des Produkts. Um sicherzustellen, dass ein Produkt-Block über ein bestimmtes Seitenverhältnis verfügt, schneide das Bild vor dem Hochladen im Produkt-Editor zu oder verwende den Bild-Editor im Produkt-Editor.
Fehlerbehebung
Mein Produkt-Block zeigt das falsche Bild an
Product Blocks display the product's thumbnail image. This image may be different than the first image set in the Item tab of the product editor. To change the image in the Product Block, change the product's thumbnail image.
Das Produkt wird nicht aus dem Produkt-Block in den Warenkorb gelegt
If clicking a Product Block's Add to Cart button doesn't add the product to the shopping cart, the linked Products Page might be disabled. Products from disabled Products Pages can display in Product Blocks, but can't be added to carts. To resolve this issue, enable the Products Page.