O que é o Bloco Estático? O bloco estático é um recurso poderoso no Magento, que permite que o administrador controle “pedaços” de HTML e CSS que podem ser exibidos em todo o seu site.
Qual é a necessidade desses blocos se o desenvolvedor pode fazer isso direto no código?
Sua loja Magento deve ser configurável, tanto quanto possível, para que qualquer customização CSS ou HTML possa ser realizada em diferentes partes do site. Como por exemplo o gerenciamento de banners, imagens e textos. Dessa forma, o desenvolvedor fica livre para se concentrar nas melhorias de sua loja.
Então, vamos começar com a criação de um bloco estático e mostrá-lo na página do CMS:
No painel de administração, navegue até CMS > Bloco Estático. Clique em Adicionar Novo Bloco.
Digite o título do bloco, o ‘Identificador’ e defina o status como Habilitado.
Título do bloco: O título do bloco que você verá.
Identificador: O identificador do bloco que será usado para chamá-lo para a página do CMS.
Clique em show hide editor e adicione qualquer HTML de sua preferência. Você também pode adicionar qualquer imagem, texto ou links que desejar.
Para isso, vamos escrever um texto simples que será vinculado a uma página.
Escreva o seguinte código:
<p style=”color: red;”> Eu sou um bloco vermelho <a href=”http://www.mageup.com” target= “_blank”> Go </a> </ p>
Clique para salvar o bloco.
Agora, no seu servidor, navegue até: \app\design\frontend\theme\template\page
Nota: Em vez de theme, o nome da pasta será relacionado ao seu tema.
Na seguinte pasta, encontre o arquivo 2columns-left.phtml e use seu editor preferido para editá-lo. Para este tutorial estamos usando 2columns-left design. Se você estiver usando algum outro projeto, em seguida, edite o arquivo relacionado.
Abra o arquivo e encontre a classe div desejada na qual você deve anexar o bloco. A melhor maneira de verificar o nome da classe é:
Vá para sua página. Clique com o botão direito do mouse em qualquer lugar que você deseja mostrar o bloco estático. Selecione Inspecionar elemento.
Uma janela de código será aberta. Veja a div desejada na qual você deseja anexar o bloco.
Agora volte para o arquivo e encontre a div necessária. Neste exemplo, usamos a <div class=”main”>.
Adicione a seguinte linha à direita abaixo da div:
<?php echo $this->getLayout()->createBlock(‘cms/block’)->setBlockId(‘myblock’)->toHtml(); ?>
Incluímos o bloco em <div class=”main”>. Você pode colocá-lo em qualquer lugar de acordo com sua necessidade.
Abra sua página. Você pode ver o novo bloco listado. Agora você pode criar seus blocos da personalização com imagens, textos e muito mais.