> For the complete documentation index, see [llms.txt](https://partners.tray.com.br/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://partners.tray.com.br/themes/construindo-seu-template/desenvolver/como-manipular-as-variacoes-de-produtos.md). # Como manipular as variações de produtos Esse artigo tem por objetivo detalhar e exemplificar como é feita a manipulação de informações de variações nos servidores Tray. Todas as informações das variações de um produto estão armazenadas no índice `{{ product.variants }}` e nesse índice são disponibilizadas diversas informações referentes a variação como id, product\_id, price, stock, payment\_option, sku, entre outras. Abaixo um exemplo de retorno desse índice. ```json Array ( [sku] => Array ( [Cor] => Array ( [Azul] => Array ( [id] => 112 [ean] => [product_id] => 88 [price] => 80.00 [cost_price] => 0.00 [stock] => 10 [minimum_stock] => [reference] => [weight] => 100 [length] => 40 [width] => 25 [height] => 25 [start_promotion] => [end_promotion] => [payment_option] => R$ 72,00 à vista com desconto Boleto - TC ou 6x com juros de R$ 14,28 [payment_option_details] => Array ( [0] => Array ( [display_name] => Boleto - TrayCheckout [plots] => 1 [value] => 72.00 ) [1] => Array ( [display_name] => Cartão Amex - TrayCheckout [plots] => 6 [value] => 14.28 ) ) [available] => [illustrative_image] => [color_id_1] => 2 [color_id_2] => 0 [cubic_weight] => 100 [payment] => [html pronto das formas de pagamento] [images] => Array ( [0] => Array ( [small] => https://images4.tcdn.com.br/img/img_prod/image.jpg [medium] => https://images3.tcdn.com.br/img/img_prod/image.jpg [large] => https://images3.tcdn.com.br/img/img_prod/image.jpg [full] => https://images1.tcdn.com.br/img/img_prod/image.jpg ) ) [calculated_price] => 80.00 [is_variant] => 1 [price_offer] => 0 [color_1] => Array ( [id] => 2 [name] => Azul [image] => http://images3.tcdn.com.br/img/img_prod/xx/cor_2.png?20160622100723 [image_secure] => https://images3.tcdn.com.br/img/img_prod/xx/cor_2.png?20160622100723 ) ) [Vermelho] => Array ( [id] => 114 [ean] => [product_id] => 88 [price] => 80.00 [cost_price] => 0.00 [stock] => 10 [minimum_stock] => [reference] => [weight] => 100 [length] => 40 [width] => 25 [height] => 25 [start_promotion] => [end_promotion] => [payment_option] => R$ 72,00 à vista com desconto Boleto TC ou 6x com juros de R$ 14,28 [payment_option_details] => Array ( [0] => Array ( [display_name] => Boleto - TrayCheckout [plots] => 1 [value] => 72.00 ) [1] => Array ( [display_name] => Cartão Amex - TrayCheckout [plots] => 6 [value] => 14.28 ) ) [available] => [illustrative_image] => [color_id_1] => 12 [color_id_2] => 0 [cubic_weight] => 100 [payment] => [html pronto das formas de pagamento] [images] => Array ( [0] => Array ( [small] => https://images.tcdn.com.br/img/img_prod/image.jpg [medium] => https://images.tcdn.com.br/img/img_prod/image.jpg [large] => https://images.tcdn.com.br/img/img_prod/image.jpg [full] => https://images4.tcdn.com.br/img/img_prod/image.jpg ) ) [calculated_price] => 80.00 [is_variant] => 1 [price_offer] => 0 [color_1] => Array ( [id] => 12 [name] => Vermelho [image] => http://images3.tcdn.com.br/img/img_prod/xx/cor_12.png?20160622100723 [image_secure] => https://images3.tcdn.com.br/img/img_prod/xx/cor_12.png?20160622100723 ) ) ) ) ) ``` {% hint style="info" %} Indicamos que seja utilizada a chamada image\_secure para exibir as imagens das variações pois a mesma tem o link com https, a chamada somente com image tem o link com http {% endhint %} Vamos de um exemplo prático para deixar mais claro a utilização do `{{ product.variants }}` ### Como exibir as formas de pagamento das variações? Para exibir essa informação há duas opções: A primeira delas é utilizar o `payment`, essa chamada trás um bloco já pronto das informações de precificação: #### Exemplo ```twig {% for sku in product.variants %} {% for type in sku %} {% for value in type %} {{ value.payment }} {% endfor %} {% endfor %} {% endfor %} ``` Também é possível exibir as formas de pagamento de acordo com sua necessidade e para isso deve-se utilizar as informações do índice `payment_option_details`. Esse índice retorna as seguintes informações: ```json [payment_option_details] => Array ( [0] => Array ( [display_name] => Boleto - TrayCheckout [plots] => 1 [value] => 72.00 ) [1] => Array ( [display_name] => Cartão Amex - TrayCheckout [plots] => 6 [value] => 14.28 ) ) ``` #### Exemplo: ```html {% for sku in product.variants %} {% for payment in sku.payment_option_details %} {% if payment.plots == 1 %}

{{ settings.currency }} {{ payment.value }}

à vista no {{ payment.display_name }} {% else %} {% if payment|length > 1 %}
ou {% endif %} em {{ payment.plots }} vezes de {{ settings.currency }} {{ payment.value }} no {{ payment.display_name }} {% endif %} {% endfor %} {% endfor %} ``` Seguindo o mesmo principio é possível exibir diversas outras características de variações, como tipos de variações e imagens por exemplo. --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://partners.tray.com.br/themes/construindo-seu-template/desenvolver/como-manipular-as-variacoes-de-produtos.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.