Alterando a Logo (Site e Email)

Então você instalou o Magento e agora quer alterar a logo da sua loja, por consequência a logo do cabeçalho de email também.

Vamos ver qual a melhor maneira de fazer essas modificações e entender um pouco mais como funciona essa estrutura e configurações.

Caminho das imagens

A logo faz parte do seu template, já que cada tema (natal, páscoa, dia dos namorados) você pode customizar seu leiaute (cores, imagens, fontes).

E para cada tema você pode ter uma logo personalizada. Então nada mais natural do que armazenar essa imagem dentro da pasta images do seu tema, que deve ser:

skin > frontend > default > default > images

Esse é o caminho do tema padrão (default). Você deve alterar o default/default pelo nome do seu template/tema. Nesse diretório você encontra:

logo.gif – Usado como logo padrão do sistema, a ser exibido nas páginas de frontend da sua loja, como página inicial, categorias, produtos, etc.

logo_email.gif – Usado nos emails de transação da sua loja, quando o cliente recebe um email de cadastro, confirmação de pedido, senha, etc.

logo_print.gif – Usado nas impressões de telas e documentos, basicamente arquivos pdf’s de fatura, reembolso, envios, etc.

Você pode utilizar qualquer extensão de imagem. Os modelos estão usando .gif apenas para manter a transparência no background das imagens.

Como funciona a alteração

Deve ter muita gente querendo saber o nome do arquivo phtml para alterar a imagem no código. E não é assim que funciona. Ao abrir o arquivo:

app > design > frontend > base > default > template > page > html > header.phtml

Você encontra a linha:

<img src="getLogoSrc() ?>" alt="getLogoAlt() ?>" />

Veja que ele não usa o nome da imagem. Ele recupera uma variável que possui o caminho/nome/extensão da imagem, assim como a descrição. O que significa que isso pode (e deve) ser alterado pelo backend, nas configurações do sistema.

O mesmo acontece para os emails, quando você cria um novo modelo de emails, ou tenta editar os arquivos em:

app > locale > pt_BR > template > email

Na versão 1.7.x (superior), você encontra a linha:

{{var logo_alt}}

Que também recupera uma variável com diretório/nome/extensão da sua logo. Já nas versões anteriores, o código é realmente estático:

{{var store.getFrontendName()}}

Nesse caso, se você alterar o diretório/nome/extensão da logo, deve alterar também nos arquivos de criação de email.

Alterando a logo da loja

Alterar a logo do seu template pelo backend é algo simples de fazer. Porém, incompleto (até a versão 1.7.x). Veja em:

Sistema > Configuração > GERAL > Visual [Cabeçalho]

Nessa tela você pode informar o diretório/nome/extensão da sua logo. Mas não pode enviar a imagem por aqui, ou seja, você precisa enviar a imagem “manualmente” para o diretório (via FTP).

Como você pode ver, também é possível alterar a descrição da imagem. Utilize o nome do site e/ou palavras-chaves para o seu negócio.

E no alto, a esquerda, você pode escolher a visão de loja, antes de efetuar a alteração da logo. Assim pode ter uma logo para cada visão (tema).

Alterando a logo dos emails

A partir da versão 1.7.x do Magento, você tem a opção de configurar as logos dos emails pelo backend também. Para isso vá em:

Sistema > Configuração > GERAL > Visual [Emails de Transação]

Nessa guia você consegue enviar a imagem da logo e alterar sua descrição.

Por ser uma funcionalidade mais recente, você não precisa enviar a imagem manualmente para o diretório images do seu tema – como foi feito para a logo do site.

Nas versões anteriores, você precisa enviar a imagem por FTP e editar os arquivos de template de email (se mudar nome/extensão das imagens).

E a logo de impressão?

Parece que a impressão de telas e arquivos pdf’s no sistema foi deixada de lado. Eles criaram a opção de configuração no backend para os emails, mas não para as impressões, vai entender!? Veja o arquivo:

app > design > frontend > base > default > template > page > print.phtml

Ele possui o nome do arquivo fixo em:

<img src="getPrintLogoUrl() ? $this->getPrintLogoUrl() : $this->getSkinUrl('images/logo_print.gif') ?>" class="logo" alt="" />

Dessa forma, se você alterar o caminho/nome/extensão da imagem, vai precisar editar esse arquivo também. Não exatamente este, mas uma cópia dele para default/default ou seu template/tema. E também precisa enviar a imagem por FTP.

Mas vamos ser honestos… é muito mais fácil e rápido criar as imagens já com os nomes logo.gif, logo_email.gif, e logo_print.gif e enviar pro servidor.

Aproveite e veja também como alterar o favicon da sua loja.

Sucesso!