Como exibir atributo na página de produto

Salve salve planeta terra, esse é o primeiro post de 2015 e como há tempos não escrevia pra essa categoria, vou abrir o ano com um tutorial de Magento, onde vou ensinar como exibir um atributo na página de produto.

Como você já deve saber o Magento possibilita a criação de atributos de produto personalizados para atender boa parte da demanda de gerentes de e-commerce, então como exemplo eu criei dois atributos de produto sendo um dropdown (select) e um campo de texto (text). Ao final desse tutorial você vai conseguir exibir um selo de Frete Grátis e mostrar qual o fabricante na página de produto.

Veja aqui o exemplo

Como exibir atributo na página de produto do Magento

Passo 1: Criando o atributo

Caso você já tenha o atributo criado, clique aqui pule para o passo 2, caso você ainda necessite criar o atributo, no menu do admin da sua loja, vá em Catálogo – Atributos – Gerenciar Atributos

Passo 1.1: Criando o atributo fabricante

Agora na próxima tela que abrir, clique no botão Adicionar novo atributo, localizado no canto superior direito. Primeiro vamos criar o atributo fabricante, preenchendo os campos conforme a imagem abaixo (os campos importantes são Código do atributo e Catálogo de Tipo de entrada para dono de loja)

magento-atributo-imagem-01

Depois de preencher os campos da primeira tela, no canto inferior esquerdo, tem um menu com duas opções, clique em Gerenciar Etiquetas/opções e os dois campos que vão aparecer pra você preencher equivalem a etiqueta do Atributo que será exibida no admin, nesse nosso exemplo, a etiqueta será Fabricante, como no exemplo abaixo.

magento-atributo-imagem-02

Salve o atributo fabricante e então vamos criar o atributo frete_gratis

Passo 1.2: Criando o atributo frete_gratis

Clique novamente no botão Adicionar novo atributo, localizado no canto superior direito. Vamos criar o atributo frete_grátis, preenchendo os campos conforme exemplo na imagem (os campos importantes são Código do atributo e Catálogo de Tipo de entrada para dono de loja)

magento-atributo-imagem-03

Dessa vez, como o atributo é um dropdown, o processo é um pouco diferente, depois de preencher os campos da primeira tela, no canto inferior esquerdo, tem um menu com duas opções, clique em Gerenciar Etiquetas/opções e os dois campos pra você preencher equivalem a etiqueta do Atributo que será exibida no admin, a etiqueta será Frete Grátis.

Reparem que abaixo tem um novo box chamado Gerenciar opções que como o próprio nome já diz, gerencia as opções do dropdown, então clique em Adicionar Opção e vão ser exibidos 3 campos, sendo eles: dois para a opção do dropdown e um para a posição no Dropdwon, então só criei duas opções sendo elas Não e Sim, com a opção Não em primeiro (valor 0) e como valor padrão para esse select, veja no exemplo abaixo.

magento-atributo-imagem-04

Passo 2: Inserindo os atributos em um Grupo de atributo

Vamos inserir esses atributos criados acima, dentro de um Grupo de Atributos para que eles sejam inseridos no cadastro/edição de produtos, então no menu do admin da sua loja, vá em Catálogo – Atributos – Gerenciar Grupo de Atributos.

No nosso exemplo existe somente um grupo de atributos que é o Default, então vamos clicar em cima dele pra poder editar, conforme imagem. Caso você tenha mais de um grupo de atributo, escolha conforme sua necessidade.

magento-atributo-imagem-05

Na próxima tela que vai abrir, repare que no lado direito da tela existe um box chamado de Atributos não Atribuídos e dentro dele estão os dois exemplos criados por nós (frete_gratis e fabricante), vamos arrastá-los para a parte central da página, no box chamado de Grupos, no exemplo, eu inseri na ultima posição da aba General e o resultado final é esse abaixo, não se esqueça de salvar as alterações.

magento-atributo-imagem-06

Pronto, é só criar/editar um produto e na aba General os últimos campos serão nossos atributos que serão exibidos na página do nosso produto no Magento, veja abaixo

magento-atributo-imagem-07

Passo 2: Exibir atributo na página de produto

No exemplo, vamos Exibir o atributo na loja em Magento, na página de produto, para isso vamos editar o arquivo view.phtml que fica na pasta /app/design/frontend/base/default/template/catalog/product/, abra o arquivo e mais ou menos na linha 53, abaixo do nome do produto, adicione o seguinte código

//PARA EXIBIR CAMPOS DE TEXTO (INPUT TEXT) - NO EXEMPLO, O NOME DO FABRICANTE
echo $_product->getHorario(); // código do atributo (horario)

//PARA EXIBIR DROPDOWN (INPUT SELECT) - NO EXEMPLO, FRETE_GRATIS
echo $_product->getAttributeText('frete_gratis'); // código do atributo (frete_gratis)

Pronto, agora seu Magento está pronto para exibir atributo na página de produto, mas esse código ficou bem simples né? Então vamos dar uma melhorada fazendo o seguinte, quando o atributo frete_gratis estiver marcado como Sim, aparecerá um selo na página de produto, indicando que aquele produto tem Frete Grátis e quando o campo fabricante não for preenchido, a etiqueta Fabricado por também não será exibida, então nosso código final ficou assim

<p>
 <?php
 //cria variavel fabricante com o atributo fabricante
 $fabricante = $_product->getFabricante();
 // verifica se a varivavel fabricante está vazia
 if ($fabricante == "") {
 //se tiver vazia não exibe nada
 }
 // se não estiver vazia exibe a etiqueta e o nome do fabricante
 else {
 echo "<b>Fabricado por:</b>&nbsp;" . $fabricante;
 }; ?>
</p>
<p>
 <?php
 //cria variavel frete_gratis com o atributo frete_gratis
 $frete_gratis = $_product->getAttributeText('frete_gratis');
 // verifica se a varivavel frete_gratis está marcada como Sim
 if ($frete_gratis == "Sim") {
 //se tiver marcada com sim exibe o selo
 ?>
 <img src="<?php echo $this->getSkinUrl('images/frete-gratis.jpg');?>" alt="Frete Grátis">;
 <?php }
 //se tiver outra opção não exibe nada
 else { };?>
</p>

O código acima está todo comentado, então não tem muito o que explicar dele, vamos ao resultado final.

Veja aqui o exemplo

Tutorial finalizado e agora você pode personalizar sua loja Magento de diversas maneiras, com selo de promoções, com logo de fabricante, etc, basta criar e exibir atributo na página de produto.

2017-01-24T20:24:07+00:00

RECEBA DICAS VALIOSAS NO SEU EMAIL

x