Overview
Elements are lightweight web components that let you add Kustom features to your storefront without building heavy integrations. Each element is a simple HTML tag that you embed where you want it, such as on product pages, landing pages, in the cart or in the footer. Elements use minimal styling so they fit your layout. Use them to show available payment methods, display delivery options or add express checkout buttons to your website.
Currently, the following Elements are available:
Payment logos: Display the payment methods you accept on your website.
Delivery logos: Display the delivery carriers you offer.
Express button Element: Add express buttons to your product page or cart.
Where to find Elements
Elements are managed directly in the Kustom Portal. To access them:
Log in to the Kustom Portal.
In the left-hand navigation menu, click Apps and then click Elements.
Select Payment logos, Delivery logos or Express buttons.
Payment logos
Payment logos allow you to display the payment methods accepted in your store, such as Visa, Mastercard, Apple Pay and Klarna, directly on your website.
Payment logos is the recommended way to show payment method logos, including the Klarna logo, on your website. Kustom provides the logos, so you do not need to download, resize or style them yourself. The logos shown always match the payment methods enabled for your market, so they stay up to date when you add or remove a payment method.
How to set up payment logos
Navigate to Apps > Elements > Payment logos in the Kustom Portal.
Select your store from the dropdown and add the domain where you plan to display Elements.
Choose your locale (for example
en-SE). This determines which payment methods are shown for that market.Copy the HTML tag displayed in the embed section:
<kustom-payment-method-display locale="en-SE"></kustom-payment-method-display>
Paste the tag in your website's HTML where you want the logos to appear.
To add your domain, click Edit domains in the top-right corner.
To retrieve the full script, click Copy script.
Note: The logos displayed will automatically reflect the payment methods enabled for the selected locale.
Delivery logos
Delivery logos allow you to display the delivery carriers available in your store. This gives customers visibility into their shipping options before they reach checkout.
How to set up delivery logos
Navigate to Apps > Elements > Delivery logos in the Kustom Portal.
Select your store from the dropdown and add the domain where you plan to display Elements.
Choose your locale (for example
en-SE). This determines which carriers are shown for that market.Copy the HTML tag displayed in the embed section:
<kustom-delivery-method-display locale="en-SE"></kustom-delivery-method-display>
Paste the tag in your website's HTML where you want the logos to appear.
To add your domain, click Edit domains in the top-right corner.
To retrieve the full script, click Copy script.
Note: The logos displayed will automatically reflect the delivery carriers available for the selected locale.
Express button Element
This section covers express buttons that you add to your own website, for example on a product page or in the cart. If you want to turn express buttons on or off inside Kustom Checkout, see Express buttons in Kustom Checkout instead. Those buttons need no code and no Elements setup.
The Express button Element lets shoppers buy faster by going straight into an express checkout flow from your website instead of through the full cart and checkout. It requires Kustom Shipping Assistant (KSA). KSA makes sure delivery options are resolved within the express flow.
Requirements
An existing integration with Kustom Shipping Assistant is required to set up and use the Express button Element.
Read more about how to set up Kustom Shipping Assistant here.
How to set up the Express button Element
Navigate to Apps > Elements > Express buttons in the Kustom Portal.
Select your store from the dropdown and add the domain where you plan to display Elements.
Choose your locale (for example
en-SE).Copy the HTML tag displayed in the embed section:
<kustom-express-buttons locale="en-SE"></kustom-express-buttons>
Paste the tag in your website's HTML where you want the express button to appear.
To add your domain, click Edit domains in the top-right corner.
To retrieve the full script, click Copy script.
Adding Elements in WordPress
The Elements script tag is a <script> element. Many WordPress themes and page builders have a built-in "header code" or "custom code" field that strips or rejects script tags for security reasons. If you paste the tag there directly, you may see an error such as "not compatible".
If this happens, use a dedicated code injection plugin instead, such as WPCode or Insert Headers and Footers. These plugins are built to accept script tags safely. If you maintain a child theme, you can also add the tag directly to your theme's header template.
Frequently asked questions
Can I show the Klarna logo on my website?
Yes. The recommended way is to use Payment logos. Go to Apps > Elements > Payment logos in the Kustom Portal, copy the HTML tag and paste it where you want the logos to appear, for example on your product page, in the cart or in the footer. Klarna is shown together with your other enabled payment methods, and Kustom provides the logos for you.
Where can I get payment method logos for my website?
You do not need to download logos yourself. Payment logos displays the correct logos for the payment methods enabled in your store, and updates automatically when your payment methods change.
How do I turn off the express buttons at the top of my checkout?
Those buttons are not part of Elements. Go to Apps > Express buttons in the Kustom Portal and turn them off there. If the buttons still show, check if the shopper's country has its own setting in the Setting for dropdown. Read more in Express buttons in Kustom Checkout.
Technical guide
For a more detailed integration guide, please see our Kustom Docs documentation for Kustom Elements.