A vida de um gerente de loja no mundo do eCommerce nem sempre é glamourosa. Você pode até sonhar com lançamentos de produto épicos e dinheiro entrando, mas na maioria das vezes acaba preso escrevendo descrições de produtos manualmente, preenchendo campos no Magento e tomando uma quantidade excessiva de mate.

Então eu criei uma extensão Magento 2 que automatiza a geração de descrições de produtos usando modelos de IA como OpenAI GPT-4 e Google Gemini.

Por que humanos deveriam gastar horas escrevendo descrições se podemos fazer as máquinas fazerem isso por nós? Vamos ao trabalho!

O problema#

Escrever descrições de produtos deveria ser responsabilidade do fornecedor, mas muitas vezes não é o caso, e os gerentes de loja acabam tendo que assumir essa tarefa tediosa. Ponto final. Mas é essencial para SEO, vendas e para fornecer aos clientes as informações necessárias para comprar.

Escrever manualmente centenas ou milhares de descrições pode ser extremamente demorado. Eu queria uma solução que pudesse:

  • Usar IA para gerar descrições envolventes e concisas.
  • Extrair dados de produtos dinamicamente: nome, categorias, preço, etc.
  • Ser facilmente configurável para que os usuários pudessem escolher entre provedores de IA como OpenAI e Google Gemini.

Planejamento da extensão#

Para começar, eu mapeei os principais recursos que eu queria:

  1. Ativar/desativar o recurso: Os lojistas devem poder ativar ou desativar o recurso.
  2. Seleção do provedor de IA: Permitir a troca entre as APIs do OpenAI e do Gemini.
  3. Entradas de dados dinâmicos: Usar dados de produtos em tempo real, como nome, preço e categorias.
  4. Configurações de administração: Adicionar campos para chaves de API e uma mensagem personalizada para orientar a saída da IA.

Para isso, usei o sistema de configuração de administração existente do Magento e construí um controlador backend para interagir com as APIs de IA.

Codificando a extensão#

Estrutura de arquivos#

O Magento é construído em uma estrutura modular, o que facilita a criação de extensões “plug and play”. Toda extensão deve ter o nome de um fornecedor (como Werules) e o nome de um módulo (como Autofill). Dentro do diretório app/code, você cria a estrutura Vendor/Module.

Veja como a estrutura de arquivos ficou para esta extensão:

shell
app/
└─ code/
    └─ Werules/
        └─ Autofill/
            ├─ Block/
            │   └─ Adminhtml/
            │       └─ AutofillButton.php
            ├─ Controller/
            │   └─ Adminhtml/
            │       └─ Autofill/
            │           └─ Generate.php
            ├─ Model/
            │   └─ Config/
            │       └─ Source/
            │           └─ ApiProvider.php
            ├─ etc/
            │   ├─ adminhtml/
            │   │   ├─ di.xml
            │   │   ├─ routes.xml
            │   │   └─ system.xml
            │   ├─ default.xml
            │   └─ module.xml
            ├─ registration.php
            └─ view/
                └─ adminhtml/
                    ├─ layout/
                    │   └─ catalog_product_edit.xml
                    └─ templates/
                        └─ button.phtml

Configuração do Admin#

Primeiro, adicionei opções de configuração em Lojas > Configuração > Werules Autofill. Aqui está uma rápida visão geral das configurações criadas:

  • Ativar recurso de preenchimento automático (alternar sim/não)
  • Provedor de IA (dropdown: OpenAI ou Gemini)
  • Chave da API OpenAI
  • Chave da API Gemini
  • Mensagem personalizada para LLM (instruções personalizadas para a saída da IA)

Aqui está o trecho XML para adicionar essas configurações:

xml
<field id="api_provider" translate="label" type="select" sortOrder="6" showInDefault="1">
    <label>AI Provider</label>
    <source_model>Werules\Autofill\Model\Config\Source\ApiProvider</source_model>
</field>
<field id="api_key" type="text" sortOrder="10">
    <label>OpenAI API Key</label>
</field>
<field id="gemini_api_key" type="text" sortOrder="15">
    <label>Gemini API Key</label>
</field>
<field id="system_message" type="textarea" sortOrder="20">
    <label>System Message for LLM</label>
</field>

Com isso, criei um dropdown para selecionar o provedor de IA e campos para armazenar as chaves de API com segurança.

Configuração da Extensão

O botão na página de produto#

Em seguida, injetei um botão personalizado na Página de Edição de Produto no admin do Magento. Quando clicado, esse botão envia os dados do produto para o controlador backend e obtém a descrição gerada pela IA.

Aqui está o script do frontend:

javascript
require(['jquery'], function ($) {
    window.fetchAutofillData = function () {
        var productId = '<?= $productId ?>';
        var productName = $('[name="product[name]"]').val() || 'N/A';
        var productPrice = $('[name="product[price]"]').val() || 'N/A';

        $.ajax({
            url: '<?= $ajaxUrl ?>',
            type: 'POST',
            data: { product_id: productId, product_name: productName, product_price: productPrice },
            success: function (response) {
                $('#product_form_short_description').val(response.short_description);
            }
        });
    };
});

Quando o botão é clicado, os dados do produto são enviados para o controlador backend, que então chama a API de IA para gerar a descrição. Assim é como o botão fica na página do produto:

Automatizando a descrição

Conectando com OpenAI e Gemini#

O controlador backend verifica o provedor selecionado e chama a API apropriada. Aqui está a função para interagir com o Google Gemini:

php
private function generateDescriptionFromGemini($prompt, $apiKey)
{
    $ch = curl_init("https://generativelanguage.googleapis.com/v1beta/models/gemini-pro:generateText?key={$apiKey}");
    $data = ['contents' => [['parts' => [['text' => $prompt]]]]];

    curl_setopt($ch, CURLOPT_HTTPHEADER, ['Content-Type: application/json']);
    curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

    $response = curl_exec($ch);
    $decoded = json_decode($response, true);
    return $decoded['candidates'][0]['content'] ?? 'No description generated.';
}

Ao escolher dinamicamente entre OpenAI e Gemini, os lojistas podem usar o serviço de IA que melhor se adapta às suas necessidades.

Testando a extensão#

Depois de configurar tudo, testei o fluxo:

  1. Ative o recurso no painel de administração.
  2. Selecione OpenAI ou Gemini e insira a chave de API correspondente.
  3. Vá para a Página de Edição de Produto e clique no botão “Preencher descrição curta”.

O botão enviou os dados do produto (nome, preço, categorias) para a IA e obteve uma descrição concisa.

Publicando a extensão#

Para tornar a extensão acessível a todos, eu a publiquei no GitHub:
👉 Magento 2 Short Description Autofill

Considerações finais#

Esse foi um projeto divertido, combinando Magento 2 com ferramentas de IA como OpenAI e Gemini. Automatizar tarefas repetitivas, como escrever descrições de produtos, é uma ótima maneira de economizar tempo e energia para os lojistas.

Dá uma conferida na extensão, contribuir com o projeto ou compartilhar suas ideias para novos recursos. Vamos continuar fazendo as máquinas realizarem as tarefas chatas enquanto focamos no crescimento dos nossos negócios 🚀.

Até a próxima!