No WooCommerce, os atributos de produto oferecem uma forma flexível de definir várias caraterísticas para diferentes tipos de produtos. A configuração de atributos de produto pode melhorar a experiência do utilizador, ajudando os clientes a encontrar rapidamente detalhes essenciais, tais como cor, tamanho, ou material. Enriquecer as páginas de produtos com informações detalhadas aumenta a profundidade do conteúdo, beneficiando a otimização dos motores de busca (SEO) e melhorando a visibilidade dos produtos.

Este artigo aborda vários métodos para adicionar informações adicionais às páginas de produtos do WooCommerce, incluindo a utilização de O funcionalidades incorporadas, o Campos personalizados avançados (ACF) plugin, e código personalizado. Escolha o método que melhor se adapta às suas necessidades.

Porque é que a adição de informações adicionais melhora a experiência do utilizador e a SEO

Por exemplo, se vende vestuário, os clientes podem querer saber a cor, o tamanho e o tecido. Ao definir estes atributos, o WooCommerce apresenta-os automaticamente na secção "Informações adicionais" na página do produto, permitindo aos utilizadores aceder rapidamente aos detalhes essenciais. Esta funcionalidade permite uma melhor comparação de produtos para os utilizadores e melhora o desempenho de SEO da página ao adicionar conteúdo relevante.

Método 1: Adicionar informações adicionais utilizando as funcionalidades incorporadas do WooCommerce

O WooCommerce oferece uma forma simples de adicionar atributos de produtos diretamente no ecrã de edição de produtos. Veja os passos a seguir:

Passo 1: Inicie sessão no painel de controlo do WooCommerce

Navegue até ao painel de controlo do WordPress, clique em "Produtos," e selecione o produto para o qual pretende acrescentar informações adicionais.

Passo 2: Localize a secção "Dados do produto

No editor de produtos, desloque-se para baixo até à secção "Dados do produto" e selecione o painel "Atributos".

Passo 3: Adicione atributos

Clique no botão "Adicionar novo" para definir novos atributos, tais como "Cor" ou "Tamanho.”

• Introduza o nome do atributo, por exemplo, "Cor.”
• Separe os valores dos atributos com uma barra vertical (|), como "Vermelho | Azul | Verde".

Passo 4: Defina a visibilidade do atributo

Marque a opção "Visível na página do produto" para garantir que estes atributos aparecem no separador "Informações adicionais" na página do produto.

Passo 5: Guarde e actualize o produto

Clique no botão "Atualização" para guardar as suas alterações. Uma vez guardadas, o separador "Informações adicionais" na página do produto apresentará automaticamente estes atributos.

Exemplo

Se estiver a vender uma T-shirt que está disponível em três cores (Vermelho, Azul, Verde) e três tamanhos (S, M, L), pode definir o atributo "Cor" para "Vermelho | Azul | Verde" e o atributo "Tamanho" para "S | M | L". Quando a opção "Visível na página do produto" estiver selecionada, os clientes verão estas opções no separador "Informações adicionais".

Método 2: Adicionar informações adicionais utilizando o plug-in Secure Custom Fields (SCF)

Embora os atributos integrados do WooCommerce sejam úteis, é necessário mais para determinadas necessidades. Com o Campos personalizados seguros (SCF) No plugin, pode adicionar mais campos personalizados para apresentar detalhes adicionais do produto, como o material e as instruções de manutenção.

Passo 1: Instale o plug-in ACF

Vá para "Plugins" no painel de controlo do WordPress, procure por "Campos personalizados seguros," e clique em "Instalar" e "Ativar".

Passo 2: Crie um grupo de campos

Vá para "SCF" no painel de controlo do WordPress e selecione "Adicionar novo grupo de campos". Isto permite-lhe definir campos personalizados para os seus produtos.

Passo 3: Defina os campos

No grupo de campos, adicione novos campos, como "Material" ou "Instruções de manutenção." Selecione tipos de campo como texto, área de texto ou imagem, conforme necessário.

Eis uma descrição de alguns tipos de campos comuns:

• Texto: Este campo é ideal para entradas curtas e de uma só linha. Por exemplo, pode utilizá-lo para um campo "Material" se só precisar de listar um ou dois materiais, como "Algodão 100%" ou "Aço inoxidável".
• Área de texto: Esta opção é útil para descrições mais longas. Pode utilizá-la para "Instruções de conservação", onde pode fornecer informações pormenorizadas sobre lavagem ou manuseamento, como "Lavar apenas à mão. Não secar na máquina de secar roupa".
• Imagem: Esta opção permite-lhe adicionar imagens. Pode ser utilizada para campos como "Certificação do produto", onde pretende apresentar um logótipo de certificação ou um selo de qualidade.

Exemplo:

Suponha que vende mobiliário de madeira e pretende adicionar os seguintes campos personalizados:

1. Material-Pode ser um campo de "Texto" para introduzir tipos de madeira específicos, como "Carvalho" ou "Ácer".

2. Instruções de manutenção - Defina isto como uma "Área de texto" onde pode detalhar dicas de cuidados, tais como "Limpe com um pano seco. Evite a luz solar direta".

3. Logótipo de certificação - Utilize um campo "Imagem" para carregar um selo de certificação ou um distintivo ecológico.

Depois de definir estes campos, eles aparecerão no editor de produtos, prontos para que possa introduzir informações específicas de cada produto.

Passo 4: Defina as regras de visualização

Na secção "Definições", defina as condições em que estes campos personalizados devem ser apresentados nas páginas dos produtos. Pode aplicar estes campos a todos os produtos ou a categorias específicas, etiquetas ou mesmo a produtos individuais.

Passo 5: Introduza informações no editor de produtos

Depois de definir os campos e as regras de apresentação, aceda ao editor de produtos do WooCommerce para qualquer produto que cumpra os critérios. Verá agora os campos personalizados que criou e poderá introduzir informações relevantes para cada um deles.

Passo 6: Modifique o modelo de produto (opcional)

Para apresentar estes campos personalizados na parte da frente da página do produto, poderá ter de editar os ficheiros de modelo do WooCommerce (por exemplo, single-product.php). Utilize a função the_field() do SCF para apresentar os valores dos campos da seguinte forma:

<div class="product-material">

    <h4>Material:</h4>

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

</div>

Método 3: Adicionar informações adicionais utilizando o código personalizado

Ao adicionar código ao ficheiro functions.php do seu tema, pode adicionar campos diretamente ao ecrã de edição de produtos do WooCommerce para uma personalização mais avançada.

Passo 1: Adicione um campo personalizado ao editor de produtos

Utilize o gancho woocommerce_product_options_general_product_data para adicionar um campo personalizado ao ecrã de edição do produto.

add_action( 'woocommerce_product_options_general_product_data', 'add_custom_general_fields' );

função add_custom_general_fields() {

    woocommerce_wp_text_input( array(

        'id' => '_custom_product_text_field',

        'label' => __( 'Campo de produto personalizado', 'woocommerce' ),

        'desc_tip' => 'true',

        'description' => __( 'Introduza o conteúdo do campo personalizado', 'woocommerce' )

    ));

}

Passo 2: Guarde o valor do campo personalizado

Utilize o gancho woocommerce_process_product_meta para guardar o valor do campo personalizado.

add_action( 'woocommerce_process_product_meta', 'save_custom_general_fields' );

função 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 );

}

Etapa 3: Exibir o campo personalizado na página do produto

Para apresentar o campo personalizado no front end, utilize get_post_meta() no modelo de produto do WooCommerce.

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

ecoe '<label>Campo personalizado: </label> ';

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

echo '</div>';

Gerir o separador "Informações adicionais" do WooCommerce

O separador "Informações adicionais" no WooCommerce é útil para apresentar atributos detalhados do produto, mas pode querer personalizar o seu conteúdo ou até ocultá-lo em alguns casos.

Adicionando texto personalizado ao separador "Informações adicionais

Para adicionar conteúdo personalizado, como uma hiperligação, ao separador "Informações adicionais", utilize o seguinte código:

add_action( 'woocommerce_product_additional_information', 'print_custom_html' );

função print_custom_html() {

    echo '<a href="#">Clique aqui para obter mais informações sobre o produto</a>';

}

Ocultar ou remover o separador "Informações adicionais

Se um produto não requerer informações adicionais (por exemplo, um produto digital), pode remover este separador com o seguinte código:

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

função remove_additional_information_tab( $tabs ) {

    unset( $tabs['additional_information'] );

    return $tabs;

}

Conclusão

Adicionar informações adicionais às páginas de produtos do WooCommerce melhora a experiência do utilizador e a SEO. As funcionalidades integradas do WooCommerce, plug-ins como o Secure Custom Fields (SCF) e a codificação personalizada fornecem opções flexíveis para enriquecer as páginas de produtos com detalhes como cor, tamanho, material, instruções de cuidados e certificações.

• Utilizar funcionalidades incorporadas: Adicione rapidamente atributos diretamente ao editor de produtos, melhorando a experiência do utilizador ao apresentar detalhes essenciais no separador "Informações adicionais".
• Utilizar o plug-in SCF: Vá além do básico e crie campos personalizados para apresentar detalhes específicos do produto, como materiais ou instruções de cuidados, permitindo uma melhor gestão da informação e personalização para diferentes tipos de produtos.
• Utilizar código personalizado: Para uma personalização avançada, a adição de campos personalizados com código diretamente no ficheiro functions.php oferece um controlo total sobre a forma como a informação é apresentada nas páginas de produtos.

Gerir o separador "Informações adicionais" permite-lhe adicionar, modificar ou remover conteúdo, dependendo das necessidades do produto, garantindo que os seus clientes podem aceder a informações relevantes sem desordem desnecessária. Em geral, o enriquecimento das páginas de produtos do WooCommerce ajuda os clientes a tomar decisões de compra informadas, aumentando as conversões e melhorando o SEO do seu site.