×
  1. Central de Atendimento
  2. Opencode
  3. Objetos

product

Seguir

Disponível na página: product
Para saber mais sobre como gerenciar produtos acesse: Wiki - Gerenciar produtos

Informações sobre o produto atual.

Atributos Característica
{{ product.id }} Identificador único do produto
{{ product.name }} Nome do produto
{{ product.category_id }} Identificador único da categoria principal do produto
{{ product.price }} Valor do produto
{{ product.price_offer }} Valor do produto em promoção
{{ product.show_price }} Existem regras na plataforma referente a exibição do preço.
Só exiba o preço se o show_price for verdadeiro
{{ product.has_other_prices }} Retorna se o produto possui outros preços, ou seja,
se possui variações.
{{ product.payment }} Retorna opões de parcelamento do produto
{{ product.payment_option_details }}

Retorna um array com todas as informações das formas de pagamento,
os índices retornados são:

 display_name | plots | value |
{{ product.link }} Link para a página do produto
{{ product.upon_request }} Retorna se o produto está sob consulta
{{ product.available }} Retorna se o produto está disponível
{{ product.stock }} Quantidade de produtos em estoque
Retorna verdadeiro se for destaque
{{ product.new }} Retorna verdadeiro se for lançamento
{{ product.free_shipping }} Retorna verdadeiro se possuir frete grátis
{{ product.additional_button }}

Retorna verdadeiro se deve-se exibir selo adicional 
{{ product.availability }} Informação de disponibilidade do produto
{{ product.ranking }} count | rating Ranking (avaliação) do produto
{{ product.ean }} Exibe o código de barras do produto
{{ product.description }} Exibe a descrição completa do produto
{{ product.description_small }} Exibe um resumo do produto
{{ product.start_promotion }} Exibe a data de ínicio da promoção do produto
{{ product.end_promotion }} Exibe a data de término da promoção do produto
{{ product.brand }} Exibe a marca do produto
{{ product.model }} Exibe o modelo do produto
{{ product.weight }} Exibe o peso do produto em gramas
{{ product.length }} Exibe o comprimento do produto em centímetros
{{ product.width }} Exibe a largura do produto em centímetros
{{ product.height }} Exibe a altura do produto em centímetros
{{ product.reference }} Exibe o código de referência do produto
{{ product.has_acceptance_terms }} Retorna verdadeiro se o produto possuir
termos de aceitação
{{ product.additional_message }} Exibe a mensagem adicional do produto
{{ product.warranty }} Exibe o texto a respeito da garantia do produto
{{ product.quantity_sold }} Exibe a quantidade produtos vendidos
{{ product.related_categories }} Retorna o ID das categorias relacionadas ao produto
{{ product.virtual_product }} Retorna verdadeiro se o produto for virtual
{{ product.video }} Exibe a url do vídeo inserido no produto
{{ product.related_products }} Array dos produtos relacionados
{{ product.compared_product }} Retorna verdadeiro se o produto estiver na comparação
{{ product.included_items }} Itens inclusos na compra do produto
{{ product.has_variation }} Retorna verdadeiro caso o produto contenha variações
{{ product.variants }} Retorna um array com todas as informações das variações,
os indices retornados são:
id | ean | product_id | price |
stock | minimum_stock | reference |
weight | length | width | height |
start_promotion | end_promotion |
price_offer | payment_option|
illustrative_image | images |
payment_option_details
{{ product.additional_information }} Exibe a informação adicional (máximo de 256 caracteres)
{{ productTabs }} Retorna informações sobre as abas
{{ productHelper.banner() }} Exibe Promoções do produto.

A baixo você pode ver alguns exemplos da utilização do Objecto product:


    <div>
      Codigo do produto: <span>{{ product.id }}</span>
      <h3>{{ product.name }}</h3>
      <h3>{{ product.brand }}</h3>
    </div>
    {% if product.featured %}
      <span style="color:#fff; background:red">Produto em destaque!</span>
    {% endif %}
    <div>
      {% if product.price_offer > 0 and product.show_price %}
        Esse produto está em promoção!
      {% endif %}
      {% if product.price > 0 and product.show_price %}
        <span> De: R$:</span>{{ product.price|currency }} <small> por:</small>
      {% endif %}
      {{ product.payment }}
      {% set ranking = product.ranking %}
      {% if ranking %}
        Quantidade de avaliações: {{ ranking.count }} <br>
        Nota do produto: {{ ranking.rating }}
      {% endif %}
      {{ product.description }}
    </div>

Helpers

Exibe as informações do produto em um bloco pre-moldado.

Atributos Característica
{{ productHelper.gallery() }} Exibe as fotos e o vídeo do produto
{{ productHelper.social() }} Exibe o bloco de redes sociais para que o produto seja compartilhado
{{ productHelper.labels() }} Exibe os rótulos do produto: destaque, frete grátis, lançamento, etc...
{{ productHelper.details() }} Exibe algumas informações como modelo,
referência, marca, disponibilidade, garantia
{{ productHelper.icons('top') }}

Exibe as características do produto em
formato de ícone, as posições disponíveis são:
top| right | bottom 
{{ productHelper.bonus() }} Exibe a quantidade de pontos que o cliente
ganha ao comprar o produto
{{ productHelper.variants() }}

Exibe um bloco com as variações do produto
{{ productHelper.form() }}

Exibe o input com a quantidade de produtos e também o botão comprar
{{ productHelper.shipping() }}

Exibe o cálculo de frete
{{ productHelper.pricing() }}

Exibe informações de preço, detalhes de pagamento
(o conteúdo muda de acordo com algumas configurações no Painel Administrativo)
{{ productHelper.bundle() }}

Exibe um bloco com outros produtos que podem ser
comprados juntamente com o produto atual

  • O "Compre Junto" é exibido apenas se todos os produtos possuírem estoque.
{{ productHelper.gifts() }}

Exibe os brindes do produto
{{ productHelper.wishlist() }} Exibe a lista de desejos

A baixo um exemplo da utilização do helper de produtos:

  • HTML
  • Resultado

    {{ productHelper.gallery() }}
      

 <div id="visualBlock" class="product-gallery">
   <div id="visualAbas" class="produto-imagem-abas">
     <ul>
       <li id="abaFoto" class="aberta">
         <a href="javascript:void(0)">FOTOS</a>
       </li>
     </ul>
    </div>

    <div id="colFotos" class="conteudo">
      <div id="add">
        <div class="imgLinks" data-toggle="modal" data-target="#modal"
             data-url="/mvc/store/product/gallery?loja=123&amp;IdProd=29&amp;variant_
             id=0" data-title="Nome do Produto" data-modal-width="900px">
          <a href="javascript:void(0);">
            <img src="https://images.tcdn.com.br/assets/store/img//galeria.png"
                 alt="Abrir Galeria" title="Abrir Galeria" class="bgcolor" border="0">
          </a>
        </div>
      </div>
      <div id="foto_p" class="produto-imagem zoom-on" align="center">
        <div id="wrap" style="top:0px;z-index:9999;position:relative;">
          <a href="https://images5.tcdn.com.br/img/img_prod/123.jpg?noCache=1455281817966"
             id="container_thumb" class="container_thumb cloud-zoom" title="Nome do produto"
             rel="zoomWidth:300,zoomHeight:300,showTitle:false,position:'left',
             adjustX:-45,adjustY:0" style="max-height: 300px; max-width: 300px;
             margin: 0px auto; text-align: center; display: block; overflow: hidden;
             position: relative;">
               <img src="https://images5.tcdn.com.br/img/img_prod/123/123.jpg" 
                    title="Nome do Produto" 
                    alt="Nome do produto" id="imgView"
                    class="photo" style="max-height:300px;max-width:300px;margin:0 auto
                    text-align:center;display:block;border:0;">
           </a>
           <div class="mousetrap" style="background-image: url(&quot;/assets/store/img/vazio.gif&quot;);
                z-index: 999; position: absolute; width: 100%; height: 300px; top: 0px;
                right: 0px; cursor: move;"></div>
           </div>
        </div>
        <span class="produto-zoom-detalhe">
    		Passe o mouse e veja detalhes
    	</span>

        <div id="foto_a" class="produto-imagem-miniaturas" align="center">
          <ul id="carousel" class="jcarousel-skin-tango">
          </ul>
        </div>
      </div>

      <div id="colVideo" class="conteudo" style="display: none" align="center">

      </div>
    </div>

Imagens

Informações sobre as imagens dos produtos. Será exibido somente na página do produto.

small 
{% set images = product.images %}
<img src="{{ images[0].small }}" alt="">
30x30
medium 
{% set images = product.images %}
<img src="{{ images[0].medium }}" alt="">
90x90
large 
{% set images = product.images %}
<img src="{{ images[0].large }}" alt="">
180x180
full 
{% set images = product.images %}
<img src="{{ images[0].full }}" alt="">

Tamanho original

Para saber mais sobre como gerenciar produtos acesse: Wiki - Gerenciar produtos

Frontend - Agencia 
Avatar
Frontend - Agencia
Seguir
Tem mais dúvidas? Envie uma solicitação

Comentários

    Artigos nessa seção

    Exibir mais

    Artigos relacionados

    Powered by Zendesk