📍
Bolt Help / Products / Ignite 🔥 / API Implementation / Components
A comprehensive list of components needed to install the Bolt Ignite package.
Initialize Bolt
On each page, the Bolt client must be initialized before using any components.
if (Bolt != null) {
initBolt()
} else {
// Use `document.head` if the Bolt script is located in the document <head></head>
// make sure you add the id "bolt-embed" to your Bolt script tag.
document.body.querySelector("#bolt-embed")
.addEventListener("load", initBolt, { once: true });
}
function initBolt() {
const boltPublishableKey = YOUR_KEY;
Bolt.initialize(boltPublishableKey);
// start using Bolt
}
You can wrap this in a promise for ease of use if you want to easily reuse this logic across pages.
const boltReadyPromise = new Promise((resolve) => {
if (Bolt == null) {
resolve();
return;
}
document.body.querySelector("#bolt-embed")
.addEventListener("load", resolve, { once: true });
}).then(() => {
const boltPublishableKey = YOUR_KEY;
Bolt.initialize(boltPublishableKey);
});
async function initBolt() {
await boltReadyPromise;
// start using Bolt
}
Localization
You can also localize the Bolt modal by adding the language parameter when instantiating the Bolt modal. The value of this parameter must be in ISO format.
Bolt.initialize(boltPublishableKey, {
language: "fr-CA",
});
Components
Allow shoppers to opt out of Bolt Account creation.
Enable Bolt Shoppers to login to their Bolt Accounts on your store frontend.
Allow shoppers to authenticate their session as a Bolt user to accelerate login and checkout.
Add Bolt's payment fields component to leverage the Bolt Tokenizer.
Allow shoppers to confirm that they are signed into their Bolt Account.