Popular Articles

  1. Como carrego uma folha de estilos (CSS)?

    A folha de estilos deve ser colocada dentro da pasta static e utilizada da seguinte forma: {{ "css/style.css" | static_url | css_tag }} As folhas de estilos também podem ser arquivos .sass ou .tpl. Se a folha de estilos for um arquivo .s...
  2. Carrinho de compras rápidas

    Neste artigo, veremos como adicionar o carrinho de compras ao seu layout, que é mostrado em um pop-up sem ter que atualizar a página ao adicionar um produto ao carrinho: Essa funcionalidade inclui o carrinho de compras com: Uma notificação exi...
  3. Como mostrar as fotos na pagina do produto?

    Código para mostrar a imagem de um único produto : {% if product.featured_image %} {{ product.featured_image | product_image_url('medium') | img_tag }} {% endif %} Existem tamanhos pré-fixados para as imagens (largura em pixel...
  4. Banners

    Neste tutorial vamos ver como podemos adicionar banners com as seguintes particularidades: Imagem Título Descrição Texto do botão Link Alinhamento Para o layout Base, criamos um componente exclusivo para os banners que, dependendo de onde o...
  5. URLs

    add_param O método add_param agrega um parâmetro à URL escolhida. {# url = 'http://www.google.com' #} {{ url | add_param('param', 5) }} {# retorna 'http://www.google.com?param=5' #} add_params O método add_params agrega mais ...
  6. Produtos relacionados

    Neste tutorial, adicionaremos os produtos relacionados mostrados na parte inferior da página de detalhes do produto. Os produtos relacionados são exibidos usando um slider que mostra uma imagem por slide em mobile e quatro em desktop. Essa fu...
  7. Vídeo na página inicial

    Neste tutorial, criaremos uma opção para mostrar um vídeo na home page da loja. Esta funcionalidade suporta links do YouTube e do Vimeo. HTML 2.  Dentro da pasta snipplets , crie um novo arquivo chamado video-item.tpl , que usaremos para ...
  8. Como carregar uma imagem configurável pelo usuário?

    Código em settings.txt: Homepage     meta         icon = picture-o         advanced = true     title         title = Imagem da homepage     image         title = Imagem da homepage         original = imagen-home.jpg         width = 3...
  9. Como crio outras seções de destaque?

    Primeiro você deve modificar o arquivo sections.txt, inserindo sua nova seção, como por exemplo: ofertas name = Ofertas description = (Pon aquí los productos que más quieras destacar como ofertas) {% for product in sec...
  10. Store

    Este objeto representa a loja e é geralmente usado em combinação com outros objetos, você pode usá-lo de duas formas: apenas para mostrar a informação ou para questionar algo. Nos exemplos seguintes poderá ver as duas formas: store.nam...