Umieszczenie przycisku do obliczania rat Credit Agricole w koszyku i na szczegółach towaru

W tym artykule dowiesz się, jak w łatwy sposób dodać przycisk do obliczania rat Credit Agricole w koszyku oraz na szczegółach towaru w e-Sklepie. Poradnik dotyczy standardowych szablonów w wersji 2020 lub nowszej.

1. Modyfikacja szablonu Topaz

Aby dodać przycisk do strony z koszykiem, otwórz plik staticElements/cart/cart.html a następnie wyszukaj w nim frazę cart__button cart__button–cancel cart__button–mobile secondary-action-button js-1st-step. Powyżej linijki z tą frazą występuje linijka {% endif -%} a powyżej niej, występuje tag <div>. Podany kod należy umieścić dokładnie nad tym tagiem:


<div style="padding:20px; text-align:center ">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{cart.OrderTotalValue | ToNum}}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/res/buttons/calc_md_full.png"/>
    </a>
</div>

</a>

</div>

Jeśli zamiast tego przycisku, wolisz przycisk, który od razu będzie prezentował wysokość raty:

to zamiast kodu przedstawionego powyżej, użyj tego:


<div style="padding:20px; text-align:center">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{cart.OrderTotalValue | ToNum}}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/button/img.png?creditAmount={{cart.OrderTotalValue | ToNum}}&posId=SSSNNNNNNN&imgType=5"/>
    </a>
</div>

</a>

</div>

Wskazówka

Możesz zmienić rozmiar przycisku, który prezentuje od razu wysokość raty. Wystarczy w imgType zamienić cyfrę 5 (rozmiar 323×75) na:
* 1 – przycisk o rozmiarze 163×30
* 2 – przycisk o rozmiarze 183×38
* 3 – przycisk o rozmiarze 248×75
* 4 – przycisk o rozmiarze 250×38

Wskazówka

Uwaga! W każdym z opisanych przypadków, konieczna jest podmiana SSSNNNNNNN na własny identyfikator sklepu, czyli numer identyfikujący Partnera, nadany przez Bank po podpisaniu umowy o współpracy, np. PSP1234567.

Aby dodać przycisk do strony ze szczegółami danego artykułu, otwórz plik elements/product/product-details-2.html i wyszukaj partials/common/after-adding-to-cart-popup.html. Powyżej tej frazy znajduje się jeden tag </div>. Podany poniżej kod należy umieścić nad tym tagiem:


<div style="padding: 10px 0 0 140px; text-align:center ">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{ product.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToPrice | ToNum }}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/res/buttons/calc_md_full.png"/>
    </a>
</div>

</a>

</div>

Kod dla przycisku prezentującego wysokość raty od razu:


<div style="padding:10px 0 0 140px; text-align:center ">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{ product.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToPrice | ToNum }}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/button/img.png?creditAmount={{ product.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToNum }}&posId=SSSNNNNNNN&imgType=5"/>
    </a>
</div>

</a>

</div>

Wskazówka

Jeśli w kreatorze szablonu wybrałeś inny rodzaj okna Szczegóły towaru > Towar i nie posiadasz u siebie pliku product-details-2, to plik, w którym trzeba dokonać zmian nazywa się elements/product/product-details-1.html. Odnajdź w nim frazę partials/common/after. Powyżej niej, znajduje się tag <div>. Poniższy kod wstaw w miejsce powyżej tego tagu:


<div style="padding: 10px 0 0 220px; text-align:center">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{ product.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToPrice | ToNum }}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/res/buttons/calc_md_full.png"/>
   </a>
</div>

</a>

</div>

Kod dla przycisku prezentującego wysokość raty od razu:


<div style="padding: 10px 0 0 220px; text-align:center">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{ product.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToPrice | ToNum }}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/button/img.png?creditAmount={{ product.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToNum }}&posId=SSSNNNNNNN&imgType=5"/>
    </a>
</div>

</a>

</div>

2. Modyfikacja szablonu Szafir

Aby dodać przycisk do strony ze szczegółami danego artykułu, otwórz plik product/product-presentation-data.html a następnie odszukaj w nim frazę column-ui attributes-container-ui. Powyżej tej frazy znajdują się dwa tagi </div>. Powyżej tych tagów umieść następujący kod:


<div style="padding-top: 20px">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{activeProduct.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToPrice}}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/res/buttons/calc_md_full.png"/>
    </a>
</div>

</a>

</div>

Kod dla przycisku prezentującego wysokość raty od razu:


<div style="padding-top: 20px">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{activeProduct.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToPrice}}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/button/img.png?creditAmount={{{activeProduct.Price | Times: product.UnitPriceRatio | Round: config.DecimalPlacesPrice | ToNum}}&posId=SSSNNNNNNN&imgType=5"/>
    </a>
</div>

</a>

</div>

Aby dodać przycisk do koszyka, otwórz plik order/cart.html a następnie wyszukaj w nim frazę translations.PayAndOrder. Poniżej wyszukanej frazy, znajdują się tagi w następującej kolejności: </button>, </div>, </div>, {% endif -%}, </div>. Podany poniżej kod umieść dokładnie poniżej wymienionych tagów:


<div style="padding:20px; text-align:center ">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{ order.OrderTotalValue | ToPrice }}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/res/buttons/calc_md_full.png"/>
    </a>
</div>

</a>

</div>

Kod dla przycisku prezentującego wysokość raty od razu:


<div style="padding:20px; text-align:center ">
    <a href="https://ewniosek.credit-agricole.pl/eWniosek/simulator.jsp?PARAM_TYPE=RAT&PARAM_PROFILE=SSSNNNNNNN&PARAM_CREDIT_AMOUNT={{ order.OrderTotalValue | ToPrice }}" target="__blank" rel="noopener noreferrer">
        <img src="https://ewniosek.credit-agricole.pl/eWniosek/button/img.png?creditAmount={{  order.OrderTotalValue | ToNum }}&posId=SSSNNNNNNN&imgType=5"/>
    </a>
</div>

</a>

</div>

Wskazówka

W przykładzie wykorzystano wzór przycisku calc_md_full.png o rozmiarze 250×38. Aby zmienić rozmiar przycisku, należy podmienić calc_md_full.png na:
* calc_lg_full.png – przycisk o rozmiarze 323×75
* calc_lg_comp.png – przycisk o rozmiarze 248×75
* calc_md_comp.png – przycisk o rozmiarze 183×38
* calc_sm_comp.png – przycisk o rozmiarze 163×30

Umieszczenie przycisku do obliczania rat Credit Agricole w koszyku i na szczegółach towaru

1. Modyfikacja szablonu Topaz

2. Modyfikacja szablonu Szafir

Czy ten artykuł był pomocny?

Społeczność Comarch

Oferta e-Commerce

Przydatne linki

Kontakt