O PrestaShop, com sua estrutura poderosa e flexível, permite que os desenvolvedores personalizem vários aspectos da plataforma para atender a requisitos comerciais específicos. Uma dessas personalizações é adicionar uma guia personalizada na página de produto do back office. Neste blog, percorreremos o processo passo a passo para atingir isso criando um módulo de amostra chamado kbcustommodule.
Podemos criar a guia personalizada na página do produto do back office de duas maneiras:
- Usando componentes do Symfony.
- Usando o gancho displayAdminProductsExtra
Método 1:
Este tutorial é aplicável ao PrestaShop versão 8.1 e superiores, utilizando componentes Symfony.
Etapa 1: Crie seu módulo
kbcustommodule/ |– composer.json |– config/ | |– services.yml |– src/ | |– Form/ | | |– Modifier/ | | | |– ProductFormModifier.php | | |– Type/ | | | |– CustomTabType.php |– kbcustommodule.php Comece criando uma pasta chamada kbcustommodule no diretório de módulos da sua instalação do PrestaShop. Dentro dessa pasta, crie o arquivo kbcustommodule.php, que conterá a classe principal do seu módulo. A classe do módulo inicializa o módulo e registra os ganchos necessários. Aqui está um exemplo do arquivo kdcustommodule.php:
Execute o comando composer dump-autoload no diretório raiz do seu módulo para habilitar o carregamento automático do namespace.
Etapa 2: Definir serviços
Crie um arquivo services.yml sob o diretório config do seu módulo (kbcustommodule/config/services.yml). Este arquivo define os serviços Symfony necessários para a personalização do formulário.
Etapa 3: Crie o tipo de formulário de guia personalizado
Crie uma classe CustomTabType na pasta src/Form/Type do seu módulo. Essa classe define os campos que aparecerão na guia personalizada.
Etapa 4: Crie a classe ProductFormModifier
A classe ProductFormModifier define como a guia personalizada se integra ao formulário de produto existente.
Etapa final: instalar e testar
- Instale o módulo através do back office ou coloque-o manualmente no diretório de módulos e habilite-o.
- Navegue até a página do produto back office. Você deve ver uma nova aba chamada “Custom Tab” com um campo chamado “Custom Field”.
- Teste a funcionalidade adicionando dados ao campo personalizado e garantindo que ele seja salvo corretamente.
Após a instalação bem-sucedida do módulo acima. Você obterá o resultado como segue.
Integrar o Google Tag Manager com o Prestashop
Método 2:
O hook displayAdminProductsExtra permite que você adicione conteúdo personalizado ou abas à página de edição do produto no Back Office. Esse método evita a complexidade de definir serviços Symfony e é mais fácil para desenvolvedores não familiarizados com Symfony.
Etapa 1: Crie o módulo
Comece criando uma estrutura básica de módulo. Por exemplo: Kbcustommodule/ |– config/ |– translations/ |– views/ | |– templates/ | |– admin/ | |– products/ | |– custom_tab.tpl |– Kbcustommodule.php
Etapa 2: Defina a classe do módulo
No arquivo Kbcustommodule.php, defina seu módulo e registre o hook displayAdminProductsExtra.
Etapa 3: Crie o arquivo de modelo
No arquivo views/templates/admin/products/custom_tab.tpl, defina o HTML e o conteúdo da sua guia personalizada.
Etapa 4: Salve os dados
Para salvar os dados personalizados, use o hook actionAdminControllerSetMedia junto com JavaScript ou PHP. Como alternativa, você pode usar o hook actionProductUpdate em PHP. Exemplo em Kbcustommodule.php:
Etapa 5: Adicione o campo ao banco de dados
Modifique o banco de dados para armazenar seus dados personalizados. Por exemplo: ———————————————————————— ALTER TABLE ps_product ADD custom_field TEXT NULL; ———————————————————————— Após a instalação bem-sucedida do módulo acima. Você obterá o seguinte resultado Para obter mais assistência, sinta-se à vontade para entrar em contato ou deixar um comentário abaixo. Ou você também pode entrar em contato conosco em Helpdesk da banda de conhecimento.