Módulo para exibir uma página “descascando” no canto direito superior da loja.
Trata-se de uma contribuição da comunidade francesa do PrestaShop, em especial o Fórum PSFRANCE através de seu membro JOLVIL. Como mostrado na imagem ao lado, é adicionado um Peel, que nada mais é que uma imagem, com um link e um efeito de estar se ‘descascando’.
Pode-se ativá-lo ou desativá-lo a partir do Back Office. Existem duas imagens para alterar o resultado pretendido: cornersmall.png e cornerbig.png, sendo que o link pode ser modificado no arquivo JavaScript.
Uma demontração temporária pode ser vista em ZZ-SHOP
Instalação
A instalação faz-se como qualquer outro módulo PrestaShop. Basta (1) descompactar o conteúdo do arquivo toppagepeel.zip no diretório /modules da loja e (2) na aba (guia) >Módulos do admin da sua loja, ativar o módulo Top Page Peel.
Realizado isso, o Peel já aparecerá na página principal da loja.
Basta passar o mouse na figura no canto superior direito para que ela se expanda.
Caso, após a instalação o Peel não seja visível, verifique no arquivo pagepeel-jquery.js se todos as URL’s iniciam e terminam com aspas simples, por exemplo (‘./modules/toppagepeel/cornersmall.png‘) e de que todas as linhas possuem um ponto e vírgula final (;).
O resultado final deve ser algo parecido com isto:
jaaspeel.ad_url = escape(‘http://www.prestashop.com’); // Change URL to be redirected to when clicking Peel Away Ad
jaaspeel.small_path = ‘./modules/toppagepeel/small.swf’;
jaaspeel.small_image = escape(‘./modules/toppagepeel/cornersmall.png’);
jaaspeel.small_width = ‘100′;
jaaspeel.small_height = ‘100′;
jaaspeel.small_params = ‘ico=’ + jaaspeel.small_image;jaaspeel.big_path = escape(‘./modules/toppagepeel/large.swf’);
jaaspeel.big_image = ‘./modules/toppagepeel/cornerbig.png’;
Configuração
- Para editar imagens, basta alterar as imagens cornersmall.png e cornerbig.png.
- Para mudar o link da página Peel, abra “pagepeel-jquery.js” e substituir a seguinte linha pela URL desejada:
jaaspeel.ad_url = escape(‘http://www.prestashop.com/’);
- Para abrir o link na página Peel na mesma janela, é necessário fazer um target = “_self” no arquivo large.fla e, em seguida, criar um novo arquivo large.swf conforme mostrado aabaixo:
In Scene 1, frame 44, I changed the actionScript, line 10, from "getURL(_root.ad_url, "_blank");" to "getURL(_root.ad_url, "_self");"
No entanto, o autor adverte que há alguns problemas a serem resolvidos, como uma certa incompatibilidade com a imagem no Bloco Editorial e outra com as camadas, a qual torna o Peel muito feio. Desta forma, ele disponibiliza acesso direto à esses arquivos a fim de que quem possa colaborar, solucione os problemas.
Pode-se descarregar os arquivos originais do Peel Aqui.
E há um outro arquivo com correções ao large.fla Aqui, este é o que não possui problemas com a imagem do Bloco Editorial, mas no alinhamento das camadas.
As imagens estão no formato .png, mas é aceito .jpg também. Basta modificar as linhas correspondentes às imagens no arquivo pagepeel-jquery.js.
O tamanho do Peel é ajustado na linha 12, onde mostra:
jaaspeel.big_width = '650';
jaaspeel.big_height = '650';
Desta forma pode-se adequá-lo melhor ao tema utilizado de forma a ficar mais elegante. Em todos os temas por mim utilizados, o módulo funcionou perfeitamente.
Conclusão
O Top Page Peel é uma solução possível para marketing e propaganda muito criativo. Em que pese alguns pequenos problemas de configuração, é uma ferramenta muito útil para atrair a atenção do cliente em opção ao banner. Poderia haver uma maneira mais dinâmica e interativa de substituir as imagens via Back Office, como também das URL’s. Mas é tão simples que basta um pouco de paciência para poder personalizá-lo de acordo com as necessidades de sua loja.
Para mais informações, suporte e descarga, visite o sitio do Fórum PrestaShop.
