Composite Products – Conditional Images

Free mini-extension for WooCommerce Composite Products that allows you to create dynamic, multi-layer Composite Product images that respond to option changes. The mini-extension leverages Scenarios to conditionally layer additional images over the main Composite Product image.

Dokumentation

Das Plugin führt eine neue Szenario-Aktion „Overlay-Bild“ ein, mit der du Folgendes tun kannst:

• Wähle ein Bild aus deiner Mediathek aus.
• Definiere Bedingungen für die Überlagerung dieses Bildes über das Hauptbild des zusammengesetzten Produkts.

This approach makes it possible to utilize either swapping or compositing techniques to conditionally modify the main product image.

Weitere Informationen und Beispiele findest du im Repository des Plugins auf GitHub.

Important: The code in this plugin is provided „as is“. Support via the WordPress.org forum is provided on a voluntary basis only. If you have an active subscription for WooCommerce Composite Products, please be aware that WooCommerce Support may not be able to assist you with this experimental plugin.

Bildaustausch

Wenn du bereits mit variablen Produkten und Variationsbildern gearbeitet hast, bist du wahrscheinlich bereits mit dieser Technik vertraut. Hier ist die Idee hinter dem Bildaustausch:

Das Hauptproduktbild wird ausgetauscht durch ein Bild, das die ausgewählten Optionen darstellt, sobald die Konfiguration des zusammengesetzten Produkts abgeschlossen ist.

Anstatt die Produktbilder zu ersetzen, kann derselbe Effekt erzielt werden, indem das Hauptproduktbild mit einem vollständig undurchsichtigen (nicht transparenten) Bild überdeckt wird.

Bildkomposition

Compositing is the combination of multiple layers of images into a single image. The final composition creates the illusion that all stacked images are parts of the same scene. For this technique to work, each layered image must include:

• einige transparente Bereiche, durch die die unteren Schichten des Stapels sichtbar sind;
• einige undurchsichtige Bereiche, die neue Elemente in die Szene einführen, indem sie die darunter liegenden Ebenen verdecken; und
• possibly, some semi-trasparent areas that introduce new elements while partially allowing the layers below to be seen.

Note: When multiple Overlay Image Scenarios exist, each adds its own image to the main product image stack. The layering order of these conditional images depends on the relative position of their Scenarios: If Scenario A is positioned higher than Scenario B under Product Data > Scenarios, then the image added by Scenario A will appear higher in the stack than the image added by Scenario B.

Austauschen vs. Zusammenfügen

The Swapping technique is a viable choice if the number of Component Options is relatively low, as it requires you to capture one picture and create one Scenario for every possible configuration. Its main advantage over the Compositing technique is that it allows you to obtain a natural-looking result, even if you don’t have advanced image processing skills.

The Compositing technique is often a better choice if the number of possible configurations is high, as it requires you to create one „compositable“ image for each Component Option. However, specialized knowledge and tools are required to produce a natural-looking result. For this reason, the Compositing technique is often preferred when 3D product models are available, as 3D modelling software can speed up the production of „compositable“ images.

Limitierungen

1. Das Produktbild kann nicht in einer Lightbox geöffnet werden, sobald die Mini-Erweiterung zusätzliche Bilder darüber gestapelt hat.
2. The image zooming feature included with WooCommerce is not compatible with the swapping/compositing techniques introduced by the mini-extension. When a Composite Product includes Scenarios with the Overlay Image Scenario Action, the image zooming feature of the Composite Product is disabled.
3. Das Plugin funktioniert mit Themes, die die Unterstützung für die Funktion wc-product-gallery-slider deklarieren.