Vollständige Anleitung zum Hinzufügen und Anpassen von Produktinformationen in WooCommerce - OpenByt - Ihre ultimative Quelle für kostenloses WordPress-Wissen

In WooCommerce bieten Produktattribute eine flexible Möglichkeit, verschiedene Merkmale für unterschiedliche Arten von Produkten zu definieren. Die Einrichtung von Produktattributen kann die Benutzerfreundlichkeit verbessern, indem sie Kunden hilft, wichtige Details schnell zu finden, wie z.B. Farbe, Größe, oder Material. Wenn Sie Produktseiten mit detaillierten Informationen anreichern, erhöht sich die Tiefe des Inhalts, was der Suchmaschinenoptimierung (SEO) zugute kommt und die Sichtbarkeit der Produkte verbessert.

Dieser Artikel behandelt mehrere Methoden, um zusätzliche Informationen zu WooCommerce-Produktseiten hinzuzufügen, darunter die Verwendung von WooCommerce's integrierte Funktionen, die Erweiterte benutzerdefinierte Felder (ACF) Plugin, und benutzerdefinierter Code. Wählen Sie die Methode, die Ihren Bedürfnissen am besten entspricht.

Warum das Hinzufügen zusätzlicher Informationen die Benutzerfreundlichkeit und SEO verbessert

Wenn Sie zum Beispiel Kleidung verkaufen, möchten Ihre Kunden vielleicht etwas über Farbe, Größe und Stoff wissen. Wenn Sie diese Attribute festlegen, zeigt WooCommerce sie automatisch unter dem Menüpunkt "Zusätzliche Informationen" auf der Produktseite, so dass Benutzer schnell auf wichtige Details zugreifen können. Diese Funktion ermöglicht den Nutzern einen besseren Produktvergleich und verbessert die SEO-Leistung der Seite durch Hinzufügen relevanter Inhalte.

Methode 1: Hinzufügen zusätzlicher Informationen mit den integrierten Funktionen von WooCommerce

WooCommerce bietet eine unkomplizierte Möglichkeit, Produktattribute direkt in der Produktbearbeitungsmaske hinzuzufügen. Hier sind die Schritte:

Schritt 1: Loggen Sie sich in das WooCommerce Dashboard ein.

Navigieren Sie zum WordPress-Dashboard, klicken Sie auf "Produkte," und wählen Sie das Produkt, zu dem Sie zusätzliche Informationen hinzufügen möchten.

Schritt 2: Suchen Sie den Abschnitt "Produktdaten".

Scrollen Sie im Produkteditor nach unten zum Feld "Produktdaten", und wählen Sie das Feld "AttributeRegisterkarte ".

Schritt 3: Attribute hinzufügen

Klicken Sie auf das "Neu hinzufügen", um neue Attribute zu definieren, wie z.B. "Farbe" oder "Größe.”

Geben Sie den Namen des Attributs ein, zum Beispiel: "Farbe.”
Trennen Sie Attributwerte mit einem senkrechten Strich (|), z.B. "Rot | Blau | Grün".

Schritt 4: Attribut Sichtbarkeit einstellen

Aktivieren Sie die Option "Sichtbar auf der Produktseite", um sicherzustellen, dass diese Attribute unter der Registerkarte "Zusätzliche Informationen" auf der Produktseite erscheinen.

Schritt 5: Speichern und aktualisieren Sie das Produkt

Klicken Sie auf das "Update", um Ihre Änderungen zu speichern. Nach dem Speichern werden diese Attribute automatisch auf der Registerkarte "Zusätzliche Informationen" auf der Produktseite angezeigt.

Beispiel

Wenn Sie ein T-Shirt verkaufen, das es in drei Farben (Rot, Blau, Grün) und drei Größen (S, M, L) gibt, können Sie das Attribut "Farbe" auf "Rot | Blau | Grün" und das Attribut "Größe" auf "S | M | L" setzen. Wenn die Option "Sichtbar auf der Produktseite" aktiviert ist, sehen die Kunden diese Optionen auf der Registerkarte "Zusätzliche Informationen".

Methode 2: Hinzufügen zusätzlicher Informationen mit dem Secure Custom Fields (SCF) Plugin

Die in WooCommerce eingebauten Attribute sind zwar hilfreich, aber für bestimmte Bedürfnisse wird mehr benötigt. Mit dem Sichere benutzerdefinierte Felder (SCF) Plugin können Sie weitere benutzerdefinierte Felder hinzufügen, um zusätzliche Produktdetails anzuzeigen, z. B. Material und Pflegehinweise.

Schritt 1: Installieren Sie das ACF-Plugin

Weiter zu "Plugins" im WordPress Dashboard, suchen Sie nach "Sichere benutzerdefinierte Felder," und klicken Sie auf "Installieren" und "Aktivieren".

Schritt 2: Erstellen Sie eine Feldgruppe

Weiter zu "SCF" auf dem WordPress-Dashboard und wählen Sie "Neue Feldgruppe hinzufügen". Damit können Sie benutzerdefinierte Felder für Ihre Produkte definieren.

Schritt 3: Felder definieren

Fügen Sie innerhalb der Feldgruppe neue Felder hinzu, wie z.B. "Material" oder "Pflegehinweise." Wählen Sie je nach Bedarf Feldtypen wie Text, Textbereich oder Bild.

Hier finden Sie eine Aufschlüsselung einiger gängiger Feldtypen:

Text: Dieses Feld ist ideal für kurze, einzeilige Eingaben. Sie können es zum Beispiel für ein Feld "Material" verwenden, wenn Sie nur ein oder zwei Materialien auflisten müssen, wie z.B. "100% Baumwolle" oder "Rostfreier Stahl".
Textbereich: Dies ist nützlich für längere Beschreibungen. Sie könnten es für "Pflegehinweise" verwenden, wo Sie detaillierte Informationen zum Waschen oder zur Handhabung geben können, wie z.B. "Nur von Hand waschen. Nicht im Trockner trocknen."
Bild: Diese Option ermöglicht es Ihnen, Bilder hinzuzufügen. Sie kann für Felder wie "Produktzertifizierung" verwendet werden, wo Sie ein Zertifizierungslogo oder ein Qualitätssiegel anzeigen möchten.

Beispiel:

Angenommen, Sie verkaufen Holzmöbel und möchten die folgenden benutzerdefinierten Felder hinzufügen:

MaterialDies könnte ein "Text"-Feld sein, um bestimmte Holzarten einzugeben, z.B. "Eiche" oder "Ahorn".

Pflegehinweise - Legen Sie dies als "Textbereich" fest, in dem Sie Pflegetipps angeben können, wie z.B. "Mit einem trockenen Tuch abwischen. Vermeiden Sie direktes Sonnenlicht."

Logo der Zertifizierung - Verwenden Sie ein "Bild"-Feld, um ein Zertifizierungssiegel oder eine umweltfreundliche Plakette hochzuladen.

Nachdem Sie diese Felder definiert haben, werden sie im Produkt-Editor angezeigt, damit Sie die für jedes Produkt spezifischen Informationen eingeben können.

Schritt 4: Anzeigeregeln festlegen

Im Abschnitt "Einstellungen" legen Sie die Bedingungen fest, unter denen diese benutzerdefinierten Felder auf den Produktseiten angezeigt werden sollen. Sie können diese Felder auf alle Produkte oder bestimmte Kategorien, Tags oder sogar einzelne Produkte anwenden.

Schritt 5: Geben Sie Informationen in den Produkteditor ein

Sobald die Felder definiert und die Anzeigeregeln festgelegt sind, gehen Sie zum WooCommerce Produkteditor für jedes Produkt, das die Kriterien erfüllt. Sie sehen nun die benutzerdefinierten Felder, die Sie erstellt haben, und können die entsprechenden Informationen für jedes Feld eingeben.

Schritt 6: Ändern der Produktvorlage (optional)

Um diese benutzerdefinierten Felder im Frontend der Produktseite anzuzeigen, müssen Sie möglicherweise die Vorlagendateien von WooCommerce bearbeiten (z.B. single-product.php). Verwenden Sie die Funktion the_field() von SCF, um die Feldwerte wie folgt auszugeben:

<div class="product-material">

    <h4>Material:</h4>

    <p><?php the_field('material'); ?></p>

</div>

Methode 3: Hinzufügen zusätzlicher Informationen mit benutzerdefiniertem Code

Durch Hinzufügen von Code in die Datei functions.php Ihres Themes können Sie Felder direkt in die WooCommerce-Produktbearbeitungsmaske einfügen und so eine erweiterte Anpassung vornehmen.

Schritt 1: Fügen Sie ein benutzerdefiniertes Feld zum Produkt-Editor hinzu

Verwenden Sie den woocommerce_product_options_general_product_data-Haken, um dem Produktbearbeitungsbildschirm ein benutzerdefiniertes Feld hinzuzufügen.

add_action( 'woocommerce_product_options_general_product_data', 'add_custom_general_fields' );

function add_custom_general_fields() {

    woocommerce_wp_text_input( array(

        'id' => '_custom_product_text_field',

        'label' => __( 'Benutzerdefiniertes Produktfeld', 'woocommerce' ),

        'desc_tip' => 'true',

        'description' => __( 'Inhalt des benutzerdefinierten Feldes eingeben', 'woocommerce' )

    ));

}

Schritt 2: Benutzerdefinierten Feldwert speichern

Verwenden Sie den woocommerce_process_product_meta-Haken, um den Wert des benutzerdefinierten Feldes zu speichern.

add_action( 'woocommerce_process_product_meta', 'save_custom_general_fields' );

function save_custom_general_fields( $post_id ) {

    $custom_field_value = isset( $_POST['_custom_product_text_field'] ) ? sanitize_text_field( $_POST['_custom_product_text_field'] ) : '';

    update_post_meta( $post_id, '_custom_product_text_field', $custom_field_value );

}

Schritt 3: Benutzerdefiniertes Feld auf der Produktseite anzeigen

Um das benutzerdefinierte Feld auf dem Frontend anzuzeigen, verwenden Sie get_post_meta() in der WooCommerce-Produktvorlage.

echo '<div class="custom-field">';

echo '<label>Benutzerdefiniertes Feld: </label> ';

echo get_post_meta( get_the_ID(), '_custom_product_text_field', true );

echo '</div>';

Verwalten der Registerkarte "Zusätzliche Informationen" von WooCommerce

Die Registerkarte "Zusätzliche Informationen" in WooCommerce ist nützlich für die Anzeige detaillierter Produktattribute, aber vielleicht möchten Sie ihren Inhalt anpassen oder sie in einigen Fällen sogar ausblenden.

Benutzerdefinierten Text auf der Registerkarte "Zusätzliche Informationen" hinzufügen

Um der Registerkarte "Zusätzliche Informationen" benutzerdefinierte Inhalte, wie z.B. einen Link, hinzuzufügen, verwenden Sie den folgenden Code:

add_action( 'woocommerce_product_additional_information', 'print_custom_html' );

function print_custom_html() {

    echo '<a href="#">Klicken Sie hier für weitere Details zum Produkt</a>';

}

Ausblenden oder Entfernen der Registerkarte "Zusätzliche Informationen"

Wenn ein Produkt keine zusätzlichen Informationen erfordert (z.B. ein digitales Produkt), können Sie diese Registerkarte mit dem folgenden Code entfernen:

add_filter( 'woocommerce_product_tabs', 'remove_additional_information_tab', 98 );

function remove_additional_information_tab( $tabs ) {

    unset( $tabs['additional_information'] );

    return $tabs;

}

Fazit

Das Hinzufügen zusätzlicher Informationen zu WooCommerce-Produktseiten verbessert die Benutzerfreundlichkeit und die Suchmaschinenoptimierung. Die in WooCommerce integrierten Funktionen, Plugins wie Secure Custom Fields (SCF) und benutzerdefinierte Kodierung bieten flexible Optionen, um Produktseiten mit Details wie Farbe, Größe, Material, Pflegehinweisen und Zertifizierungen anzureichern.

Eingebaute Funktionen verwenden: Fügen Sie im Handumdrehen Attribute direkt in den Produkteditor ein und verbessern Sie die Benutzerfreundlichkeit, indem Sie wichtige Details auf der Registerkarte "Zusätzliche Informationen" anzeigen.
SCF-Plugin verwenden: Gehen Sie über die Grundlagen hinaus und erstellen Sie benutzerdefinierte Felder, um spezifische Produktdetails wie Materialien oder Pflegeanweisungen darzustellen. So können Sie Informationen besser verwalten und für verschiedene Produkttypen anpassen.
Benutzerdefinierten Code verwenden: Für fortgeschrittene Anpassungen bietet das Hinzufügen von benutzerdefinierten Feldern mit Code direkt in der Datei functions.php die vollständige Kontrolle darüber, wie die Informationen auf den Produktseiten dargestellt werden.

Auf der Registerkarte "Zusätzliche Informationen" können Sie je nach Produktanforderungen Inhalte hinzufügen, ändern oder entfernen und so sicherstellen, dass Ihre Kunden ohne unnötige Unordnung auf relevante Informationen zugreifen können. Insgesamt hilft die Anreicherung von WooCommerce-Produktseiten Ihren Kunden, fundierte Kaufentscheidungen zu treffen, die Konversionsrate zu erhöhen und gleichzeitig die SEO Ihrer Website zu verbessern.