Home » , , , , » Tirar o menu superior e colocar na lateral do site

Tirar o menu superior e colocar na lateral do site


Um dos primeiros desejos de quem começa a personalizar sua loja Magento é tirar o menu de categorias do cabeçalho e jogar na barra lateral, direita ou esquerda.

Claro que para personalizar você vai precisar editar o arquivo css “folhas de estilos“, procure pelo arquivo boxes.css que deve estar no diretório skin -> frontend -> default -> default -> css.

Mas voltando ao foco deste post, vamos retirar o menu categorias do cabeçalho e posicioná-lo em uma das laterais da página.

Abra o arquivo xml responsável por adicionar o bloco menu na página, o page.xml que fica em app -> design -> frontend -> default -> default -> layout e procure o bloco de nomeheader, você deve encontrar o seguinte:

<block type="page/html_header" name="header" as="header">
<block type="page/template_links" name="top.links" as="topLinks"/>
<block type="page/switch" name="store_language" as="store_language" template="page/switch/languages.phtml"/>
<block type="core/text_list" name="top.menu" as="topMenu"/>
</block>

Retire a última linha de dentro deste bloco, responsável pelo topMenu.

<block type="core/text_list" name="top.menu" as="topMenu"/>

Agora abra o arquivo header.phtml que é o responsável por exibir os blocos descritos no xml, encontre o arquivo na pasta app -> design -> frontend -> default -> default -> template -> page -> html e retire a última linha do arquivo, equivalente a:

<?php echo $this->getChildHtml('topMenu') ?>

Na verdade basta apenas uma das duas opções acima descrita para retirar o menu categoria do cabeçalho, mas é melhor executar as duas para manter o código limpo.

Se você pensou rápido já deve ter imaginado que o processo para incluir o menu categorias na barra lateral deve ser o mesmo processo, porém inverso. A diferença é que no exemplo a seguir vamos criar uma página nova para exibir o bloco de categorias ao invés de reutilizar o topMenu que ficou órfão.

Abra o arquivo catalog.xml que deve estar em app -> design -> frontend -> default -> default -> layout, e procure o bloco que fica bem no início do arquivo. Agora você é quem decide, se quizer jogar do lado direito use a referencia right, se quizer do lado esquerdo use a referencia left, aqui usarei o left:

<reference name="left">
<block type="catalog/navigation" name="catalog.menu" template="catalog/navigation/menu.phtml" before="-" />
</reference>



Também
O problema já foi solucionado. 
Fui em: /lojastampa.com.br/html/app/design/frontend/default/hellowired/template/catalog/navigation 
abri leftnav,phtml e comentei tudo. Funcionou.



Share this games :

0 comentários:

Postar um comentário