Wir bereiten die neuesten Anleitungen, Releases und Feature-Updates vor.
Anleitungen werden geladen
Wir bereiten die passenden Inhalte der Wissensdatenbank für diese Plattform vor.
Elementeigenschaften außerhalb des Customizers steuern | Chamevo Support Center
Elementeigenschaften außerhalb des Customizers steuern
Verwenden Sie den Shortcode [chamevo_property_control], um Füllfarbe, Schriftart, Schriftgröße oder Textsteuerelemente an beliebiger Stelle auf der Produktseite zu platzieren – außerhalb des Customizer-Canvas.
Aktualisiert am 30. April 20265 Min. Lesezeit
Der Shortcode [chamevo_property_control] ermöglicht es Ihnen, einen interaktiven Eigenschaftseditor – für Füllfarbe, Schriftfamilie, Schriftgröße oder Text – an beliebiger Stelle auf der WooCommerce-Produktseite zu platzieren. Statt Kunden die Steuerelemente im Customizer-Canvas suchen zu lassen, platzieren Sie sie direkt in der Produktzusammenfassung oder Seitenleiste.
Dies ist ein Nur V2-Shortcode. Er erfordert, dass die chamevo-js V2-Engine aktiv ist.
Bevor Sie beginnen
Die V2-Engine muss aktiviert sein. Gehen Sie zu Chamevo → Settings → Advanced und bestätigen Sie, dass V2 eingeschaltet ist. Wenn V2 nicht aktiv ist, ist dieser Shortcode nicht registriert und rendert nichts.
Das zu steuernde Element muss in Ihrem Chamevo-Produkt mit einem spezifischen Titel im Product Builder vorhanden sein. Der Shortcode adressiert Elemente über ihren Titel – das Element benötigt also einen aussagekräftigen, eindeutigen Titel.
Der Produkt-Customizer muss auf derselben Seite vorhanden sein. Der Shortcode [chamevo_property_control] verbindet sich mit dem laufenden Customizer – er funktioniert nicht auf eigenständigen Seiten ohne [chamevo] oder einer WooCommerce-Produktseite ohne aktiviertes Chamevo.
Funktionsweise
Beim Laden der Seite gibt der Shortcode ein Container-Div mit Datenattributen aus. Das V2-Frontend-JavaScript erkennt den Container und montiert darin eine Live-Eigenschaftssteuerung.
Die Steuerung bleibt mit dem Canvas synchron. Wenn ein Kunde einen Wert ändert – zum Beispiel eine andere Füllfarbe auswählt – aktualisiert sich das entsprechende Element auf dem Canvas sofort. Wenn der Kunde ein anderes Element auf dem Canvas auswählt, aktualisiert sich die Steuerung, um den aktuellen Wert dieses Elements anzuzeigen.
Das Element wird über seinen im Product Builder festgelegten Titel zugeordnet. Die Titelübereinstimmung ist exakt und Groß-/Kleinschreibung-sensitiv.
Die Füllfarbe eines Bild-, Form- oder SVG-Elements
neonColor
Die Neon-Leuchtfarbe eines Neon-Textelements
fontFamily
Die Schriftart eines Textelements
fontSize
Die Schriftgröße eines Textelements (in Punkt)
text
Der Textinhalt eines Textelements
Shortcode-Attribute
Attribut
Erforderlich
Beschreibung
target
Ja
Der Elementtitel wie im Product Builder festgelegt. Muss exakt übereinstimmen, einschließlich Groß-/Kleinschreibung.
property
Ja
Welche Eigenschaft gesteuert werden soll. Siehe Tabelle der Eigenschaftstypen.
label
Nein
Eine Beschriftung über der Steuerung. Leer lassen, um keine Beschriftung anzuzeigen.
options
Nein
Kommagetrennte Liste erlaubter Werte. Für fill: Hex-Farben zur Einschränkung der Farbfelder. Für fontFamily: Schriftnamen zur Begrenzung der verfügbaren Auswahl.
min
Nein
Mindestwert. Gilt nur für fontSize.
max
Nein
Höchstwert. Gilt nur für fontSize.
step
Nein
Schrittweite zwischen Werten. Gilt nur für fontSize.
columns
Nein
Anzahl der Spalten für Farbfeld-Layouts (verwendet mit fill-Farbfeldern).
css
Nein
Inline-CSS für den Steuerelement-Wrapper. Verwenden Sie es für Breiten-, Abstands- oder Positionierungsanpassungen.
Sowohl target als auch property sind erforderlich. Fehlt eines davon oder ist property kein gültiger Typ, gibt der Shortcode nichts aus.
Beispiele
Füllfarbe eines Hemden-Elements ändern
Einen Farbauswähler unterhalb der kurzen Produktbeschreibung platzieren:
Fügen Sie den Shortcode der kurzen WooCommerce-Produktbeschreibung hinzu oder verwenden Sie einen Page Builder zur Platzierung.
Für WooCommerce-Produkte akzeptieren die Produktbeschreibungsfelder Shortcodes – fügen Sie den Shortcode direkt in das Feld Short description ein:
Öffnen Sie das Produkt unter WooCommerce → Products → Edit product.
Fügen Sie den Shortcode in das Feld Product short description ein.
Aktualisieren Sie das Produkt.
Die Steuerung rendert im Bereich der Kurzbeschreibung, typischerweise oberhalb des „In den Warenkorb"-Buttons.
Für präzisere Kontrolle über die Platzierung verwenden Sie Elementor oder einen anderen Page Builder, oder nutzen Sie einen WooCommerce-Hook mit einem benutzerdefinierten Snippet, um den Shortcode an einer bestimmten Position einzufügen.
Elementor-Äquivalent
Wenn Sie Produktseiten mit Elementor erstellen, verwenden Sie statt des Shortcodes das Widget Chamevo Property Control. Es bietet dieselben Einstellungen über eine visuelle Oberfläche, einschließlich aller Attribute aus der obigen Tabelle.
Das Widget ist in der Kategorie Chamevo im Elementor-Widget-Panel verfügbar. Es ist ein Nur-V2-Widget – es erscheint nur, wenn V2 aktiv ist.
Im Elementor-Editor zeigt das Widget einen Platzhalter mit dem Eigenschaftstyp-Label. Die Live-Steuerung wird im Frontend gerendert.
Überprüfen Sie, ob die Eigenschaftssteuerung an der Shortcode-Position erscheint.
Wenn die Steuerung ein Füllfarben-Farbfeld anzeigt: Klicken Sie auf eine Farbe – bestätigen Sie, dass das entsprechende Element auf dem Canvas auf diese Farbe aktualisiert wird.
Wenn die Steuerung eine Texteingabe anzeigt: Tippen Sie in die Eingabe – bestätigen Sie, dass der Elementtext in Echtzeit auf dem Canvas aktualisiert wird.
Legen Sie das Produkt in den Warenkorb und überprüfen Sie, ob der personalisierte Wert in der Bestellung erfasst wird.
Fehlerbehebung
An der Shortcode-Position wird nichts gerendert
V2 ist nicht aktiv. Gehen Sie zu Chamevo → Settings → Advanced und überprüfen Sie, ob V2 aktiviert ist. Dieser Shortcode ist nur registriert, wenn V2 aktiv ist.
target oder property fehlt. Beide Attribute sind erforderlich. Prüfen Sie den Shortcode auf Tippfehler.
property ist kein gültiger Wert. Nur fill, neonColor, fontFamily, fontSize und text werden akzeptiert. Jeder andere Wert erzeugt keine Ausgabe.
Caching. Wenn Sie V2 gerade aktiviert oder den Shortcode geändert haben, leeren Sie den Seiten-Cache und laden Sie die Seite neu.
Die Steuerung rendert, aber ändert nichts auf dem Canvas
Falscher Zielname. Der target-Wert muss exakt mit dem Elementtitel im Product Builder übereinstimmen, einschließlich Leerzeichen und Groß-/Kleinschreibung. Öffnen Sie den Product Builder, wählen Sie das Element aus und bestätigen Sie den Titel.
Produkt noch nicht geladen. Die Steuerung verbindet sich nach der Initialisierung des Customizers. Wenn die Seite langsam lädt, kann die Steuerung erscheinen, bevor der Customizer bereit ist. Dies löst sich, sobald der Customizer fertig geladen ist.
Element befindet sich nicht in der aktuellen Ansicht. Die Eigenschaftssteuerung adressiert ein Element über seinen Titel. Wenn das Element in einer anderen Produktansicht als der aktuell angezeigten vorhanden ist, synchronisiert sich die Steuerung möglicherweise erst, wenn diese Ansicht aktiv ist.
Die Steuerung erscheint, aber options werden nicht berücksichtigt
Für fill mit einer kommagetrennten Liste von Hex-Farben: Stellen Sie sicher, dass jede Farbe mit # beginnt und das korrekte Hex-Format verwendet (z. B. #ff0000).
Für fontFamily: Die Schriftnamen müssen exakt mit den Schrifttiteln in Chamevo → Fonts übereinstimmen.
F: Benötige ich Elementor, um den Eigenschaftssteuerungs-Shortcode zu verwenden?
A: Nein. Der Shortcode [chamevo_property_control] funktioniert in jedem WordPress-Seiten- oder Beitragsinhalt, einschließlich der kurzen WooCommerce-Produktbeschreibung. Elementor wird nur benötigt, wenn Sie das Steuerelement per Drag-and-Drop-Widget platzieren möchten.
F: Kann ich mehrere Eigenschaftssteuerungen für verschiedene Elemente auf derselben Seite hinzufügen?
A: Ja. Platzieren Sie mehrere Shortcodes mit unterschiedlichen target-Werten. Jede Steuerung verbindet sich unabhängig mit ihrem benannten Element. Vermeiden Sie zwei Steuerungen mit demselben target- und property-Wert – dies kann zu unvorhersehbarem Synchronisierungsverhalten führen.
F: Was passiert, wenn der Ziel-Elementtitel mit keinem Element übereinstimmt?
A: Die Steuerung rendert auf der Seite, tut aber nichts. Es wird kein Fehler ausgeworfen. Wenn Sie eine Steuerung sehen, die keine Wirkung hat, überprüfen Sie den target-Wert anhand des Elementtitels im Product Builder.
F: Ist dieser Shortcode ohne aktiviertes V2 verfügbar?
A: Nein. Der Shortcode ist nur registriert, wenn die V2-Engine aktiv ist. Gehen Sie zu Chamevo → Settings → Advanced, um V2 zu aktivieren.
