Tutorial: parcelamentos

Se você deseja colocar o parcelamento aceito pela loja em todas as páginas do produto, categoria e até na home da loja, esse tutorial é ideal. Deixe as lojas de seus clientes ainda mais organizadas seguindo os passos abaixo:
1. Copie o “installlments_in_product.tpl” snipplet dentro da pasta snipplet (confira a pasta de temas snipplets).
2. Adicione o Javascript em layout.tpl. (Importante: este script também funciona com as funcionalidades de variáveis). Os scripts instalados estão dentro da função changeVariant (mudar variável). Idealmente, copie e cole o código abaixo. Cheque as referências do JavaScript caso ainda não tenha.
{{ '//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js' | script_tag }} function get_max_installments_without_interests(number_of_installment, installment_data, max_installments_without_interests) { if (parseInt(number_of_installment) > parseInt(max_installments_without_interests[0])) { if (installment_data.without_interests) { return [number_of_installment, installment_data.installment_value.toFixed(2)]; } } return max_installments_without_interests; } function get_max_installments_with_interests(number_of_installment, installment_data, max_installments_with_interests) { if (parseInt(number_of_installment) > parseInt(max_installments_with_interests[0])) { if (installment_data.without_interests == false) { return [number_of_installment, installment_data.installment_value.toFixed(2)]; } } return max_installments_with_interests; } function changeVariant(variant){ var parent = $("body"); if (variant.element){ parent = $(variant.element); } var sku = parent.find('#sku'); if(sku.length) { sku.text(variant.sku).show(); } if (variant.installments_data) { var variant_installments = JSON.parse(variant.installments_data); var max_installments_without_interests = [0,0]; var max_installments_with_interests = [0,0]; $.each(variant_installments, function(payment_method, installments) { $.each(installments, function(number_of_installment, installment_data) { max_installments_without_interests = get_max_installments_without_interests(number_of_installment, installment_data, max_installments_without_interests); max_installments_with_interests = get_max_installments_with_interests(number_of_installment, installment_data, max_installments_with_interests); $('#installment_' + payment_method + '_' + number_of_installment).text( number_of_installment + ' - R$' + installment_data.installment_value.toFixed(2) + (installment_data.without_interests? ' sem juros' : '') ); }); }); if (max_installments_without_interests[0] != 0) { $('.installments.max_installments_container .max_installments').text('Até ' + max_installments_without_interests[0] + 'x de R$' + max_installments_without_interests[1] + ' sem juros'); } else { $('.installments.max_installments_container .max_installments').text('Até ' + max_installments_with_interests[0] + 'x de R$' + max_installments_with_interests[1]); } } if (variant.price_long){ parent.find('#price_display').text(variant.price_long).show(); } else { parent.find('#price_display').hide(); } if (variant.compare_at_price_long){ parent.find('#compare_price_display').text(variant.compare_at_price_long).show(); } else { parent.find('#compare_price_display').hide(); } if(variant.contact) { parent.find('.container-box').hide(); } else { parent.find('.container-box').show(); } var button = parent.find('.addToCart'); button.removeClass('cart').removeClass('contact').removeClass('nostock'); {% if not store.is_catalog %} if (!variant.available){ button.val('{{ "Sin stock" | translate }}'); button.addClass('nostock'); button.attr('disabled', 'disabled'); $("#shipping-calculator-form").hide(); } else if (variant.contact) { button.val('{{ "Consultar precio" | translate }}'); button.addClass('contact'); button.removeAttr('disabled'); $("#shipping-calculator-form").hide(); } else { button.val('{{ "Agregar al carrito" | translate }}'); button.addClass('cart'); button.removeAttr('disabled'); $("#shipping-calculator-form").show(); } {% endif %} }
3. Instale as “etiquetas” de parcelas em single_product.tpl bem abaixo do preço (no caso do tema Luxury).
{% if product.show_installments %} {% set max_installments_without_interests = product.get_max_installments(false) %} {% if max_installments_without_interests %}
{% else %} {% set max_installments_with_interests = product.get_max_installments %} {% if max_installments_with_interests %}
{% endif %} {% endif %} {% endif %}
4. Adicione os botões de parcelamento dentro de product.tpl na estrutura de descrição (isso varia de acordo com o tema).
{% snipplet "installments_in_product.tpl" %} {% if product.show_installments and product.display_price %} {% set installments_info = product.installments_info %} {% if installments_info %} {{ "Ver el detalle de las cuotas" | translate }} {% endif %} {% endif %}
5. Adicione o modal de parcelamento no rodapé de product.tpl.
{% if installments_info %} {% set gateways = installments_info | length %} <div id="InstallmentsModal" class="modal hide fade{% if gateways <= '3' %} two-gates{% endif %}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-body"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <div class="installments"> <ul class="nav nav-tabs"> {% for method, installments in installments_info %} <li id="method_{{ method }}" {% if loop.first %}class="active"{% endif %}><a href="#installment_{{ method }}_{{ installment }}" data-toggle="tab">{{ method == 'paypal_multiple' ? 'PAYPAL' : (method == 'itaushopline'? 'ITAU SHOPLINE' : method | upper) }}</a></li> {% endfor %} </ul> <div class="tab-content"> {% for method, installments in installments_info %} <div class="tab-pane{% if loop.first %} active{% endif %}" id="installment_{{ method }}_{{ installment }}"> <div class="span4"> {% for installment, data_installment in installments %} <span id="installment_{{ method }}_{{ installment }}"> {{ installment ~ ' x ' ~ data_installment.installment_value_cents | money }} {% if data_installment.without_interests %} {{ 'sin interés' | t }}{% endif %} </span> {% if installment == 12 %}</div><div class="span4">{% endif %} {% endfor %} </div> </div> {% endfor %} </div> </div> </div> </div> {% endif %}
6. Adicione as traduções no arquivo translations.txt.
es "{1} cuotas de {2}" pt "{1}x de {2}" en "In up to {1} installments of {2}" es "{1} cuotas de {2} sin interés" pt "{1}x de {2} sem juros" en "In up to {1} installments of {2} without interest" es "{1} cuotas en tarjeta de crédito" pt "{1}x no cartão" en "In up to {1} installments" es "Ver el detalle de las cuotas" pt "Ver detalhes das parcelas" en "See installments details" es "sin interés" pt "sem juros" en "without interests"
E se você ainda não é parceiro Nuvem mas gostaria de atender seus (E NOSSOS) clientes com uma solução de e-commerce, cadastre-se agora e conheça todos os benefícios.