Vorschau benutzerdefinierte Produktoptionen mit Bildüberlagerung

Question

Ich arbeite derzeit in einem Geschäft, in dem On-Bestell-Produkte verkauft werden. Diese Produkte müssen vom Kunden angepasst werden. Ich möchte die vom Client ausgewählten benutzerdefinierten Optionen vorschauen, indem sie grafisch auf dem Element platziert werden.

Ich stelle mir vor, dass es für jede Option ein separates transparentes Bild erstellt, sodass sie die gleiche Größe wie die gesamte Vorschau -Bildgröße machen und sie dann übereinander legen.

Wenn meine Absichten nicht klar sind, lassen Sie es mich bitte wissen. Ich werde eine grafische Darstellung dessen erstellen, was ich meine.

Gibt es bekannte Erweiterungen? Bezahlt oder kostenlos.

Answer 1

Wenn ich Ihre Frage korrekt verstehe, möchten Sie eine geschichtete Bildanzeige von ausgewählbaren Elementen erstellen?

Wenn ich also Hüte verkaufe, ist das Basisbild der Kopf einer Person, und dann wählt der Benutzer einen Hut aus und das Hutbild ist oben auf dem Kopf geschichtet?

Sehr interessantes Konzept, und ich würde sehr gerne das Endergebnis sehen :)

Wie ich es machen würde:

Das Hauptprodukt müsste entweder ein konfigurierbares oder ein Bündelprodukt sein, wobei Kinderprodukte angeschlossen sind. Dies würde Ihnen die Möglichkeit geben, die anpassbaren Aspekte mithilfe der Core Magento -Funktionalität zu haben, sodass kein zusätzlicher Code erforderlich ist.

Das Hauptproduktbild würde in einem Container -Div platziert, sodass seine ID/Klasse bekannt ist. Nennen wir es 'Image_Container'. Das untergeordnete Bild für das übergeordnete Produkt würde in diesem Behälter absolut positioniert sein.

Jedes der untergeordneten Produkte haben das geplante geschichtete Bild als sein Bild als Basisbild und wieder reine Kernfunktionalität konfiguriert.

Jetzt benötigen Sie einen benutzerdefinierten JS -Code, den Sie an den Änderungsereignissen der ausgewählbaren untergeordneten Eingaben binden (seien Sie ausgewählt/Radios usw.). Dies würde einige AJAX abfeuern, um den Weg zum Bild für dieses Kind zu erhalten. Der resultierende AJAX -Aufruf würde dann ein neues IMG -Element als Kind für das Containerbild 'Image_Container' in das DOM einfügen und absolut auf dem übergeordneten Bild positioniert. Sie können leicht die richtigen X/Y -Koordnungen aus dem bekannten statischen übergeordneten Bild abrufen.

Sie können dann neue Bilder ein-/ausschütten, wenn die Optionen geändert werden.

Sie können das untergeordnete Bild sogar dragabel machen, damit der Kunde es an einem anderen Ort auf dem Elternteil positionieren kann (falls dies erforderlich ist).

Hoffe das hilft.

Answer 2

Dafür gibt es eine Erweiterung. Produktkonfigurator von JustSelling ist derjenige. Es tut genau das, was Sie benötigen.

Überprüfen Sie die Demo hier: http://demo.product-configurator.biz/index.php/functions/demo-6.html