Zur WooCommerce-Produktseite hinzufügenBenutzerdefinierte EtikettenSie können Ihnen helfen, Produktinformationen besser zu präsentieren und die Benutzererfahrung zu verbessern. Diese Tags können verwendet werden, um zusätzliche Beschreibungen, Nutzerbewertungen, Spezifikationen oder andere wichtige Informationen bereitzustellen. Mit dem Elementor Plugin können Sie diese Tags ganz einfach anpassen, ohne Code zu schreiben. In diesem Artikel erhalten Sie eine schrittweise Anleitung, wie Sie mit Elementor benutzerdefinierte Tags zu Ihren WooCommerce-Produktseiten hinzufügen können.
Schritt 1: Installieren und aktivieren Sie die erforderlichen Plug-ins
Als erstes müssen Sie sicherstellen, dass die folgenden Plugins installiert sind:
- WooCommercePlugin für die wichtigsten E-Commerce-Funktionen.
- Elementor Pro: ErforderlichMontagePro Versionfür die Anpassung von Seiten mit WooCommerce-bezogenen Widgets.
- WooCommerce Registerkarten-Manager(Optional): Erleichtert die Verwaltung von Registerkarten auf WooCommerce-Produktseiten.
Schritt 2: WooCommerce erstellen oder bearbeitenAngeboteWeb-Seite
- Zur Produktseite gehen: Navigieren Sie im WordPress-Backend zum Ordner
Angebote
>Alle Produkte
Wählen Sie dann das Produkt, das Sie bearbeiten möchten, und klicken Sie aufCompiler
Schaltfläche.
- Editieren mit Elementor: Klicken Sie auf der Produktbearbeitungsseite auf
Editieren mit Elementor
um den Elementor-Editor zu öffnen.
Schritt 3: Benutzerdefinierte Registerkarten hinzufügen
- Struktur der Produktregisterkarten hinzufügen::
- Klicken Sie im Elementor-Editor auf
Hinzufügen eines neuen Containers
wählen Sie eine geeigneteSpaltenLayout. - Die Verwendung der ElementorRegisterkarten WidgetZiehen Sie es in den Bereich, den Sie gerade erstellt haben. Das Registerkarten-Widget fügt automatisch einige Beispielregisterkarten hinzu.
- Klicken Sie im Elementor-Editor auf
- Registerkarten Inhalt bearbeiten::
- Klicken Sie auf den Titelbereich jeder Registerkarte, um den Titel der Registerkarte zu ändern, z.B. "Beschreibung", "Modellnummer", "FAQ", usw.
- Klicken Sie auf den Inhaltsbereich Tab, um frei hinzuzufügenText, Bilder, Listenund mehr, wobei Sie die zahlreichen Widgets von Elementor nutzen können, um den Inhalt der einzelnen Registerkarten individuell zu gestalten.
Schritt 4: Fügen Sie jeder Registerkarte dynamische WooCommerce-Inhalte hinzu.
Elementor kann konvertierenDynamischer WooCommerce InhaltZu Registerkarten hinzufügen. Zeigen Sie zum Beispiel dynamisch generierte Produktbeschreibungen auf der Registerkarte Beschreibung an.
- Einfügen dynamischer Daten: Klicken Sie auf die Widgets in einem beliebigen Inhaltsbereich und wählen Sie das linkeDynamische Etiketten-Symbole. Wählen Sie dann aus dem Dropdown-Menü WooCommerce-bezogene dynamische Inhalte aus, wie z.B.
Beschreibung des Produkts
undProdukttitel
vielleichtProduktbewertungen
.
- Design und Personalisierung: Elementor kann auch angepasst werden, indem Sie dieStile, Abstände, Schriftarten, Farbenusw., um das Aussehen der einzelnen Registerkarten anzupassen. Achten Sie darauf, dass das Design der Registerkarten mit dem Gesamtstil der Website übereinstimmt.
Schritt 5: Speichern und Vorschau
Wenn Sie das Hinzufügen und Anpassen der Registerkarten abgeschlossen haben, klicken Sie unten auf der Seite auf die SchaltflächeUpdate
um die Änderungen zu speichern. Die Produktseite kann dann in der Vorschau angezeigt werden, um sicherzustellen, dass alle Registerkarten richtig angezeigt werden und der Inhalt korrekt geladen wird.
Optionaler Schritt: WooCommerce Tab Manager verwenden
Wenn Sie leistungsfähigere Funktionen für die Verwaltung von Registerkarten wünschen, sollten Sie das ProgrammWooCommerce Registerkarten-ManagerPlugin. Dieses Plugin kann:
- Fügen Sie globale benutzerdefinierte Registerkarten hinzu, die automatisch auf alle Produktseiten angewendet werden.
- Durch einfaches Ziehen und Ablegen können Sie die Registerkarten neu anordnen.
- Richten Sie verschiedene Registerkarten-Layouts für verschiedene Produkte ein.
Schritt 6: Optimieren Sie das Benutzererlebnis
Um sicherzustellen, dass Benutzer leicht durch Ihre Produktinformationen navigieren können, gibt es auchRegisterkartenum Animationseffekte hinzuzufügen. Beispiel:
- Animation ein-/ausblenden: in Elementor's
hohes Niveau
können Sie Ein- und Ausblendeffekte zu den Registerkarten für den Ein- und Ausstieg hinzufügen, um den Seitenwechsel flüssiger zu gestalten.
- reaktionsfähiges DesignÜberprüfen Sie, wie Ihre Registerkarten auf mobilen Geräten angezeigt werden, um sicherzustellen, dass sie auf allen Geräten eine gute Benutzererfahrung bieten.
Zusammenfassungen
passieren (eine Rechnung oder Inspektion etc.)Elementorim Gesang antwortenWooCommerceSie können Ihren Produktseiten ganz einfach benutzerdefinierte Etiketten hinzufügen, um Ihre Produktinformationen übersichtlicher und besser organisiert zu gestalten.
Empfohlene Plug-ins::
- Elementor ProEin umfangreiches Set von Tools für die Gestaltung von Produktseiten.
- WooCommerce Registerkarten-Manager(Optional): Ein fortschrittlicheres Tool zur Verwaltung von Registerkarten für Händler mit mehreren Produkten.
Führen Sie die Schritte in diesem Artikel aus, um Ihrem WooCommerce-Shop benutzerdefinierte Produkt-Tags hinzuzufügen und jedes Tag nach Bedarf mit Inhalt und Design zu personalisieren.