SFRA Storefront Changes (PDP, CART, Mini-Cart and Checkout)

1 Delivery Estimate Insertion
- 1.1 Decorator Page
- 1.2 Product Detail Page
- 1.3 Mini-Cart
- 1.4 Cart Page
- 1.5 Checkout Page

Delivery Estimate Insertion

Decorator Page

Open file \cartridge\templates\default\common\htmlHead.isml
Add the below code snippet to insert a Fenix javascript to the PDP page
<script defer type="text/javascript" src="https://sfcc.cdn.fenixcommerce.com/v1.0/fenix.js"/>

Product Detail Page

Add the below code snippet to enter an empty div on PDP which fenix js will use to inject delivery messages
Check for attributes placed on this div below
- supportedcountries = Target countries support Fenix Delivery estimates(must be in pair and pipe format for more assistance contact fenixcommerce for short codes. )
- tenantId = Fenix provided customer specific tenant id
- xapikey = Fenix provided customer specific tenant id (if not provided attribute can be kept blank)
- delesturl = Fenix provided customer delest url (if not provided attribute can be kept blank)

<div class="fenix-delivery-sfcc" 
    supportedcountries="US|United States,CA|Canada,IN|India" 
    tenantId="2934f7a59d614d27a99e677500f0d972" 
    xapikey="2934f7a59d614d27a99e677500f0d972" 
    delesturl="https://delest-api.fenixcommerce.com/fenixdelest/api/v3/deliveryestimates">
    <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.

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:

Something like below: