New Articles

  1. Hooks de Javascript

    Ao personalizar um template na Nuvem Shop, é importante saber que há componentes críticos para que as funcionalidades funcionem bem. Esses componentes agora são identificados com algo chamado JS Hooks . Fique tranquilo porque isso não é...
  2. Promoções

    Neste tutorial vamos adicionar as promoções em seu layout, oferecendo a possibilidade de mostrar e aplicar promoções do tipo: 2x1, 3x1,% de desconto em um produto ou de um determinado número de unidades. As promoções são mostradas em: No item d...
  3. Selos personalizados

    Neste tutorial, explicaremos como você pode adicionar um selo ou logotipo personalizado para aparecer no rodapé da loja, na seção ‘Personalizar meu layout atual’ no Administrador Nuvem. Geralmente é usado para incluir logotipos ou parcerias de relac...
  4. Página em construção

    A página em construção permite ocultar produtos e páginas internas da loja quando a mesma não puder receber visitas, seja porque ainda não foi lançada ou está recebendo atualização. É uma página que mostra informações básicas de contato da lo...
  5. Como adaptar o zoom de produtos para dispositivos móveis

    Com a crescente prolifeiração de dispositivos móveis, muitas das interações de nossos websites precisam ser reformuladas. Uma delas é o evento "hover" . Ele é a ação de posicionar o cursor do mouse sobre um elemento, sem clicar. O evento hover acom...
  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. Barra de categorias na página inicial

    Neste tutorial vamos adicionar um componente na página inicial para mostrar as categorias. HTML A primeira coisa que vamos fazer é criar as pastas home e navigation dentro da pasta snipplets, se você ainda não as tiver. 1. Dentro da pasta  s...
  8. Banners informativos

    Neste tutorial vamos adicionar banners informativos, basicamente eles são banners que contêm: Um ícone Um título Um texto Um link (opcional) Temos um total de 7 banners para mensagens diferentes: Frete Cartões de crédito Segurança Trocas...
  9. Como mostro o preço no produto?

    {{ product.price | money_long }} {{ product.compare_at_price | money_long }} ...
  10. 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...