Add Head Snippet

Why do you need the head snippet?

The head snippet initializes the payment system on your site. Without it, the AxleButton component won't work on your published site and will show a validation error.

The snippet uses your API key to set up secure communication with Axle's payment servers.

Get your API key

1. In your Axle dashboard, click API Keys
2. Copy your Live API Key (it starts with axle_live_)
3. Keep this key safe — don't share it publicly

Add the head snippet to Framer

1. Open your Framer project
2. Click on your site name and go to Site Settings
3. Navigate to General tab
4. Scroll to Custom Code section
5. Click in the Head field
6. Paste your head snippet from the Axle dashboard into the Head field. You can find the ready-to-use snippet in your Axle dashboard under API Keys.
7. Click Save
8. Publish your site for the changes to take effect

Verify it's working

After publishing, open your site in a browser and check:

1. Open Developer Tools (F12 or right-click → Inspect)
2. Go to the Console tab
3. You should see a message confirming the Axle head snippet is loaded
4. If there's an error, double-check your API key is correct and the head snippet is in the Head section

Next steps

Once the head snippet is added, proceed to Install Framer Component to add the payment button to your site.