X

Como deixar o Slideshow padrão do Opencart responsivo?

Published on: abr 13 2014 by Daniel Assad

Na galeria de extensões do Opencart existem diversas opções de slideshow, algumas com muitos recursos e animações novos e você pode usar como alternativa ao slideshow padrão do Opencart. Mas se seu site pode dispensar todos esses recursos e continuar com a simples transição de imagem do já existente slideshow, basta fazer algumas pequenas alterações para torná-lo responsivo.

 

O slideshow padrão do Opencart (até a versão 1.5.6) usa o Nivoslider na versão 2.7. A boa notícia é que já existe um Nivoslider responsivo, logo, basta atualizar o JS para o Nivoslider 3.2.

 

1. Download Nivoslider atualizado

Faça o download do Nivoslider atualizado.

2. Alterações no FTP

Abra o caminho: “catalog/view/javascript/jquery/nivo-slider” e substitua o arquivo jquery.nivo.slider.pack.js pelo arquivo da versão recém baixada.

3. Alterações no CSS

Crie no seu arquivo de CSS a seguinte entrada:
.slideshow{position: relative;}

Faça a atualização do CSS referente ao CSS do slideshow com o arquivo baixado: nivo-slider.css

4. Alterações no TPL

Se seu slideshow não ocupará toda a tela do navegador, ou seja, o slideshow tem uma largura máxima definida, esta alteração não será necessária. Mas se seu site ocupa 100% da tela do navegador e o slideshow também, provavelmente será necessário alterar o TPL do slideshow.

- Abra o arquivo slideshow.tpl no “catalog/view/theme/modello/template/module”
- Na segunda linha, apague: style=”width: <?php echo $width; ?>px; height: <?php echo $height; ?>px;”

 

Filed under: Blog e Dicas, Comércio Eletrônico, Opencart

Deixe um comentário

*

*