Page Comparison

Delivery Estimate Insertion

Product Detail Page

• Open file \cartridge\templates\default\product\productDetails.isml

• Add the below code snippet to insert a Fenix javascript to the PDP page

assets.addJs('fenix.js');

Something like below:

...

• replace the above js with the CDN LINK : https://sfcc.cdn.fenixcommerce.com/v1.0/fenix.js

• Add the below code snippet to enter an empty div on PDP which fenix js will use to inject delivery messages

<div class="fenix-delivery-sfcc">
  <div class="fenix-animated-background">
    <div class="fenix-background-masker fenix-btn-divide-left"></div>
  </div>
</div>

Something like below:

...

Mini-Cart

• Open file \cartridge\templates\default\checkout\cart\miniCart.isml

• Add the below code snippet in the minicart-footer section.

        <div class="row">
            <div class="col-12 checkout-continue">
                <isinclude template="fenix/fenixEstimateWidget" />
            </div>
        </div>

Something like below:

...

Cart Page

• Open file \cartridge\templates\default\cart\cart.isml

• Add the below code snippet in the cart-page container.

        <div class="col-12">
            <isinclude template="fenix/fenixEstimateWidget"/>
        </div>

Something like below:

...

Checkout Page

• Open file \cartridge\templates\default\checkout\shipping\shippingMethod.isml

• Use the below code snippet to print the list of shipping methods:

...