Como trabalhar com arquivos de template (PHTML) Magento 1.9

magento-arquivo-template-imagem-01

Olá, neste artigo veremos como fica a alteração de conteúdo dos arquivos de template, aqueles com extensão PHTML. Nos temas anteriores a maior necessidade de trabalhar como estes arquivos vinham da necessidade de tornar o tema responsivo, migrar o código para padrão HTML 5 ou limpar o código. No entanto este novo tema já traz o recurso responsivo nativo junto com formato para HTML 5 o que reduz muito a necessidade de editar arquivos de template.

Mesmo assim o método para modificar os arquivos de template continua a mesma, então vou dar um pequeno exemplo de como alterar arquivos de template e sinta-se a vontade para testar em seus projetos.

Modificando o cabeçalho

Eu quero colocar um fundo para destacar o cabeçalho do restante da página, mas não tenho um elemento para me apoiar então vou criar uma div envolvendo todo o header do site para isso faremos o seguinte

Copie o arquivo header.phtml para dentro do tema
de app/design/frontend/rwd/default/template/html/page/header.hhtml
para app/design/frontend/rwd/red/template/html/page/header.hhtml

Abra o arquivo e localize o nó <header id=”header” class=”page-header”> e antes dele insira uma div como esta <div id=”header-container”> e depois de fechar o nó </header> insira o fechamento da div ficando assim:

<div id="header-container">
<header id="header" class="page-header">

...

 </header>
 </div>

Abra o arquivo style.css do seu tema e inclua uma regra próxima às regras do header

#header-container{
 background:url("../images/bkg-header.png") repeat-x 0 100% #FFF;
 border-bottom:1px solid #EE3300;
 }

Este é o arquivo usado no cabeçalho

magento-imagem-01

Pronto veja como ficou

magento-imagem-02

Agora você sabe que modificar os arquivos de template do novo tema não tem mistério, praticamente não mudou, mas é necessário conhecer os novos arquivos deste tema.

Cada alteração nos arquivos de template, os PHTML atende a uma necessidade específica que serão exploradas em artigos futuros, então para se manter atualizado, curta minha página no Facebook e se achar que este artigo possa ser interessante divulgue nas mídias sociais

Um grande abraço

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

RECEBA DICAS VALIOSAS NO SEU EMAIL

x