SFRA Files Change Review | Welcome to Afterpay Documentation

The following templates are present in Afterpay’s Salesforce Reference Architecture (SFRA) cartridge as well as the app_storefront_base cartridge. That means the template in Afterpay’s cartridge will override the base template.

Since Afterpay’s cartridge was built to work with the base cartridge, this override should be fine. However, if you’ve made custom changes to these templates in the base cartridge, or have installed plugins which override these templates, you must merge the changes yourself.

It may be useful to refer to that version to see the Afterpay-specific changes in the overridden file. In general, comments have been left in the files to make it easier to identify Afterpay-specific changes vs. base-SFRA content.

Template File	Location & Purpose for Change
`cart.isml`	`cartridge/templates/default/cart/cart.ismlIncludes /js/afterpay.js` and `/css/afterpaystyle.js` Default error messaging on page will also display Afterpay-specific error messages.
`cartTotals.isml`	`cartridge/templates/default/cart/cartTotals.ismlDisplay` Afterpay messaging under cart totals on the cart page.
`checkoutButtons.isml`	`cartridge/templates/default/cart/checkoutButtons.isml` Display Afterpay Express Checkout Button on the cart page.
`paymentOptionsTabs.isml`	`cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsTabs.isml` Adds a payment tab for Afterpay and/or Cash App Pay
`paymentOptionsContent.isml`	`cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsContent.isml` Include content displayed in the Afterpay and/or Cash App Pay payment tab.
`paymentOptionsSummary.isml`	`cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsSummary.isml` Include content displayed in the payment summary when Afterpay and/or Cash App Pay is the payment method.
`confirmationPaymentInfo.isml`	`cartridge/templates/default/checkout/confirmation/confirmationPaymentInfo.isml` Included Afterpay or Cash App Pay in the payment confirmation.
`checkout.isml`	`cartridge/templates/default/checkout/checkout.isml` Make all default SFRA checkout buttons hideable with CSS. Add the Afterpay and/or Cash App Pay checkout button. Add Afterpay Checkout Widget. Include Afterpay and Cash App Pay client-side JS and CSS.
`scripts.isml`	`cartridge/templates/default/common/scripts.isml` Adds JS files required to load the Afterpay assets.
`pageFooter.isml`	`cartridge/templates/default/components/pageFooter.isml` Adds Afterpay among the accepted payment methods in the footer.
`addToCartButtonExtension.isml`	`cartridge/templates/default/product/components/addToCartButtonExtension.isml` Add express checkout buttons on the PDP page.
`setItems.isml`	`cartridge/templates/default/product/components/setItems.isml`
`bundleDetails.isml`	`cartridge/templates/default/product/bundleDetails.isml` Add Afterpay messaging for bundles. Include Afterpay JS / CSS.
`productDetails.isml`	`cartridge/templates/default/product/productDetails.isml` Include Afterpay JS / CSS. Display Afterpay messaging on product details page.
`productTile.isml`	`cartridge/templates/default/product/productTile.isml` Display Afterpay messaging on product tile.
`quickView.isml`	`cartridge/templates/default/product/quickView.isml` Display Afterpay messaging on quick view.
`setDetails.isml`	`cartridge/templates/default/product/setDetails.isml` Include Afterpay JS/CSS.
`setQuickView.isml`	`cartridge/templates/default/product/setQuickView.isml`
`catLanding.isml`	`cartridge/templates/default/rendering/category/catLanding.isml` Include Afterpay JS/CSS.
`searchResults.isml`	`cartridge/templates/default/search/searchResults.isml` Include Afterpay JS/CSS.

Similarly, if you’ve made customizations to the following JS and SCSS files, you may need to merge the Afterpay changes.

JS File	Location & Purpose for Change
`checkout.js`	`cartridge/client/default/js/checkout.js` Include Afterpay client-side JS.
`productTile.js`	`cartridge/client/default/js/productTile.js` Include Afterpay client-side JS.

SCSS File	Location
`homePage.scss`	`cartridge/client/default/scss/homePage.scss` Adds CSS for Afterpay’s checkout button. Specifically used by the minicart when opened on the store home page.