Gestalten Sie Ihre WooCommerce-Produktkategorien mit Elementor

Elementor ist ein hervorragender WordPress-Seitenersteller, um die Funktionalität des Standard-WordPress-Builders durch das Hinzufügen neuer Funktionen zu verbessern.

Wenn Sie sich erinnern, waren die frühen Versionen von WordPress nicht besonders benutzerfreundlich. Neben der eingeschränkten Funktionalität mussten Sie sich auf vorgefertigte WordPress-Themes verlassen, um ein grundlegendes Design für Ihre Website zu erstellen. Für viele Benutzer war jedoch die Grundfunktionalität von WordPress-Themes unzureichend, was die Installation von plugin oder die manuelle Bearbeitung des Theme-Codes erforderlich machte.

• WooCommerce- und Elementor-Kombination
• Kategorieseite in Elementor erstellen
• Layouteinstellungen

Elementor ist ein blockbasierter Builder, ähnlich wie WordPress, aber er ist viel fortschrittlicher als der WordPress-Builder, da er intuitiver, reaktionsschneller und funktionsreicher ist. Am wichtigsten ist, dass Sie eine fantastische Website erstellen können, ohne jemals eine Zeile Code schreiben zu müssen!

WooCommerce- und Elementor-Kombination

WP-WooCommerce und Elementor sind zwei der am häufigsten verwendeten WordPress- plugin die heute verfügbar sind. Die Menge an Flexibilität und die schiere Anzahl an Funktionen, die jeder von ihnen bietet, sind einfach unbezahlbar. Wenn Sie einen E-Commerce-Shop betreiben, ist WooCommerce das beste plugin für fast jeden Bedarf, den Sie haben könnten. Es ist das umfassendste plugin das für praktisch jeden Bedarf verfügbar ist.

Darüber hinaus ist Elementor einer der effektivsten Drag-and-Drop-Website-Builder auf dem Markt. Es gibt Ihnen die Möglichkeit, fast jede Seite Ihrer Website schnell zu entwerfen, anzupassen und bereitzustellen. Darüber hinaus stehen Funktionen zur Verfügung, wie das Erstellen von Megamenüs und der Zugriff auf eine Vielzahl von Add-Ons und Vorlagen, die sehr praktisch sind. Mit Hilfe von WooCommerce und Elementor können Sie Shop- und Business-Seiten in professioneller Qualität mit geringstmöglichem Aufwand und Aufwand entwerfen und erstellen. Mit Hilfe von Elementor können Sie Ihre Shop-Layouts, Produktraster und Karussells vollständig anpassen und aus einer Vielzahl schöner Layouts auswählen. Ebenfalls verfügbar ist die Möglichkeit, Ihre Checkout- und Warenkorbseiten einzurichten und zu personalisieren sowie sie in eine Vielzahl von Zahlungsoptionen und -funktionen zu integrieren, um Ihren Kunden mehr Komfort zu bieten.

Darüber hinaus können Sie unter anderem benutzerdefinierte Seiten und Designs für digitale Güter erstellen, benutzerdefinierte Seitenoptionen für Versand und Zahlungen sowie Post- und Vorkaufseiten einschließen. All dies trägt dazu bei, dass die Website Ihres Unternehmens professionell und benutzerfreundlich erscheint. Zusammen mit den benutzerfreundlichen Call-to-Action-Buttons, parallaxenfertigen Schiebereglern und einer Vielzahl anderer Funktionen können Sie WooCommerce-Funktionen in Ihre Website integrieren. Die schiere Zahl der verfügbaren Möglichkeiten ist nahezu grenzenlos. Wenn Sie nun überzeugt genug sind, lassen Sie sich von uns durch den Prozess der Umsetzung Ihres Plans führen. Sie können eine Vielzahl von Dingen tun, um Ihre Shop-Seite einladender zu gestalten, und das Ziel ist es, dass diese Schritte Ihnen dabei helfen, eine einladendere Shop-Seite für Ihren WooCommerce-Shop zu erstellen.

Erstellen einer WooCommerce-Kategorieseite in Elementor

Wenn Sie mit WooCommerce vertraut sind, wissen Sie, dass Produktkategorien entscheidend sind, um Ihre Produkte für die richtige Anzeige und den richtigen Zugriff durch Kunden zu organisieren – je schneller sie finden, wonach sie suchen, desto besser. Aber was genau sind Produktkategorien?

Kunden verbringen viel Zeit damit, Ihre Produkte auf Ihrer Shop-Seite zu durchsuchen, daher müssen sie eine positive Erfahrung machen. Es gibt nichts Frustrierenderes, als durch Dutzende von Seiten navigieren zu müssen, um sich Produkte auf der Website Ihres Shops anzusehen.

Daher ist die Kategorisierung unerlässlich, um Ihren Kunden ein besseres Einkaufserlebnis zu bieten. Kunden können ihre Vorlieben leichter sortieren und herausfiltern, wenn es einen übersichtlichen und organisierten Bereich für alle Arten von Artikeln wie Kleidung oder Schuhe gibt. Durch das Hinzufügen von Elementen zur Lead-Generierung wie Call-to-Action-Buttons, empfohlenen Produktbereichen, Pop-ups für Verkäufe oder Angebote und anderen ähnlichen Komponenten kann dieser Bereich für Besucher attraktiver werden.

Wenn Sie einen WooCommerce-Shop haben und ihm ein Facelifting verpassen möchten, ist dieses Tutorial genau das Richtige für Sie.

Viele WooCommerce-Themen enthalten ein Standardlayout für Produktkategorien, das möglicherweise am besten zu Ihren Geschäftsanforderungen passt oder nicht. Obwohl diese Standardeinstellungen einige nützliche Funktionen umfassen können, können sie nicht häufig angepasst werden.

Kommen wir zur Sache.
Nachdem Sie Ihr Produkt eingerichtet haben, müssen Sie vor der Veröffentlichung Folgendes tun, damit es in einer Kategorie angezeigt wird:

Sie legen die Bedingungen fest, die bestimmen, wo Ihre Produktvorlage in dieser Phase angezeigt wird. Wenn Sie eine Vorlage verwenden, wird sie automatisch auf alle Produktseiten Ihrer Website angewendet. Sie können Ihre Suche auch auf eine bestimmte Produktkategorie eingrenzen.

Klicken Sie auf Veröffentlichen, und Ihr einzelnes Produkt ist jetzt zum Kauf verfügbar!

Wir sind noch nicht fertig.
Was wir gerade getan haben, reicht nicht aus, um Kategorien auf unserer Seite live zu bringen; Um Kategorien auf allen oder einigen Seiten unserer Website live zu bringen, müssen wir noch einige Dinge einrichten. Um die Aufgabe abzuschließen, erstellen Sie eine Produktkatalogseite, die sich auf alle Produkte auswirkt, oder eine Katalogseite, die sich auf eine bestimmte Produktkategorie auswirkt.
Kehren Sie dazu zunächst zu Elementor > Meine Vorlagen zurück und erstellen Sie eine Produktarchivvorlage. Wählen Sie dann entweder eine vorhandene Vorlage aus oder erstellen Sie eine neue. Passen Sie das Erscheinungsbild des Widgets „Archivprodukte“ und des Widgets „Archivtitel“ an, indem Sie sie zu Ihrer Seite hinzufügen.

Verwenden Sie die Funktion zum Kopieren von Stilen zwischen Seiten, um ihn an das Design anzupassen, das Sie bereits für Ihre einzelne Produktvorlage erstellt haben, und speichern Sie dann Ihre Änderungen.
Kehren Sie zur Produktseite zurück und wählen Sie Kopieren aus dem Dropdown-Menü. Klicken Sie mit der rechten Maustaste auf Stil einfügen, wenn Sie wieder im Archivprodukt sind. Wählen Sie „Neueste Produkte“ aus dem Dropdown-Menü „Abfrage“ > „Quellen“ in den Einstellungen „Produkte archivieren“.
Wählen Sie dann Ringe aus dem Dropdown-Menü Produktkategorie aus. Nur die Ringkategorie wird auf diese Weise angezeigt. Wenn Sie eine lange Produktliste für eine bestimmte Kategorie haben, sollten Sie die Paginierung aktivieren.
Sie können den Abstand zwischen den Spalten und den Zeilen anpassen, indem Sie die Registerkarte „Stil“ auswählen. Ändern Sie die Farben, Schriftarten und andere Aspekte des Designs.

Wählen Sie vor der Veröffentlichung die Bedingungen aus, die bestimmen, wo das Archiv angezeigt wird, genau wie bei der Einzelproduktvorlage, und veröffentlichen Sie dann.

Sobald Sie auf "Veröffentlichen" geklickt haben, ist Ihre Archivseite live.

Elementor pro gibt Ihnen die Möglichkeit, mit seiner Vielzahl von Optionen blitzsaubere Produktkategorien zu entwerfen;

Mit den auf Elementor Pro verfügbaren Optionen können Sie Folgendes ausführen:

Layouteinstellungen für WooCommerce-Produktkategorien

• Spalten: Legen Sie die genaue Anzahl der anzuzeigenden Spalten fest, von 1 bis 12
• Kategorienanzahl: Wählen Sie die Anzahl der anzuzeigenden Kategorien aus

Abfrageeinstellungen

• Quelle: Wählen Sie die Quelle aus, aus der Kategorien angezeigt werden sollen, indem Sie zwischen Alle, Manuelle Auswahl, Nach übergeordneten oder Aktuellen Unterkategorien wählen. Wenn Manuelle Auswahl ausgewählt ist, wählen Sie manuell aus, welche Kategorien angezeigt werden sollen. Wenn „Von Eltern“ ausgewählt ist, wählen Sie aus „Nur oberste Ebene“ oder wählen Sie eine einzelne Kategorie aus der Dropdown-Liste aus.
• Leer ausblenden: Bei Kategorien ohne Produkte auf Ja setzen
• Sortieren nach: Legen Sie die Reihenfolge fest, in der die Kategorien angezeigt werden. Zu den Optionen gehören Name, Slug, Beschreibung oder Anzahl
• Reihenfolge: Wählen Sie diese Option, um Kategorien in ASC- oder DESC-Reihenfolge (aufsteigend oder absteigend) anzuzeigen

Stileinstellungen

• Spaltenabstand: Stellen Sie den genauen Abstand zwischen den Spalten ein
• Zeilenabstand: Stellen Sie den genauen Abstand zwischen den Zeilen ein
• Ausrichtung: Richten Sie die Produktdaten links, rechts oder mittig aus

Bildeinstellungen

• Umrandungstyp : Wählen Sie den Umrandungstyp aus, wählen Sie aus ohne, durchgehend, doppelt, gepunktet, gestrichelt oder gerillt
• Randradius: Legen Sie den Radius fest, um die Eckenrundheit des Rands zu steuern
• Abstand: Passen Sie den Abstand zwischen den Bildern und ihren Daten an

Titeleinstellungen

• Farbe: Wählen Sie die Titelfarbe
• Typografie: Legen Sie die Typografieoptionen für den Titeltext fest

Zähleinstellungen

• Farbe: Wählen Sie die Farbe für den Count
• Typografie: Legen Sie Typografieoptionen für den Count fest

Fazit

Der WooCommerce Builder in Elementor bietet Ihnen die Designflexibilität, die Sie benötigen, um Ihre Produktseiten visuell zu erstellen und zu optimieren. Die Zeit, die es braucht, um von einer Idee zum Leben zu gelangen , und voll Der funktionale Online-WooCommerce-Shop wird durch diese Zeitersparnis erheblich reduziert. Insgesamt hat die Anpassung Ihrer WooCommerce-Shop-Seite mit Elementor das Potenzial, die Gesamtleistung Ihrer Website erheblich zu beeinflussen. Sie können den Verkauf entweder unterstützen oder behindern, indem Sie Ihre Produkte bestmöglich organisieren und präsentieren, damit Kunden sie sehen und kaufen können. Die Einrichtung und Anpassung Ihrer WooCommerce-Shop-Seite in Elementor wird durch die Schritte in diesem Handbuch demonstriert. Beachten Sie jedoch, dass dies nur die Spitze des Eisbergs in Bezug auf den Umfang des Problems ist. Eine Einführung in die Verwendung von Elementor zum Erstellen der idealen Shop-Seite für Ihren Shop wird in dieser einfachen Demonstration gezeigt. Verwenden Sie dies als Ausgangspunkt und spielen Sie damit herum, um das Beste aus diesem fantastischen Seitenersteller herauszuholen