📜 Add Custom JavaScript to Your Checkout Page in Fleetwire!

Enhance your customer-facing checkout pages by adding custom JavaScript scripts, such as Google or Facebook analytics, or even your own scripts. Fleetwire makes it easy to integrate these scripts for better tracking and functionality. Let’s walk through how to add them!

🎯 Why Add Custom JavaScript?

Adding custom JavaScript to your checkout pages helps you:

Track Analytics: Integrate tools like Google Analytics or Facebook Pixel to monitor customer behavior.
Enhance Functionality: Add custom scripts to improve the checkout experience.
Gain Insights: Use analytics to optimize your online store (e.g., testcompany.fleetwire.io).

Note: You can add code with or without <script> tags—just paste the script as provided by the service.

🛠 How to Add Custom JavaScript

Follow these steps to add and test custom JavaScript scripts on your checkout pages in Fleetwire.

Step 1: Access the Scripts Field

Navigate to the checkout settings to add your JavaScript code.

In your Fleetwire dashboard, go to the scripts field by clicking here.
- Alternatively, navigate to Settings > Checkout in your dashboard.
Find the Custom Scripts or Additional Scripts section.

Here’s what the scripts field looks like in the checkout settings.

Step 2: Add Your JavaScript Code

Paste the JavaScript code to integrate analytics or custom functionality.

In the scripts field, paste the code provided by the service (e.g., Google Analytics, Facebook Pixel), or write your own script.
- Example (Google Analytics):

<!-- Google Analytics -->
     <script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y"></script>
     <script>
       window.dataLayer = window.dataLayer || [];
       function gtag(){dataLayer.push(arguments);}
       gtag('js', new Date());
       gtag('config', 'UA-XXXXX-Y');
     </script>

- If the script doesn’t include <script> tags, you can add them, but it’s not required.
Click Save to apply the script to your checkout pages.

Pro Tip: Replace UA-XXXXX-Y with your actual Google Analytics tracking ID for accurate tracking.

Step 3: Test the Script

Verify that your script works as expected on your checkout page.

Visit one of your listing checkout pages (e.g., testcompany.fleetwire.io) and start a test checkout.
Check if the script is functioning:
- For analytics, use browser developer tools (e.g., Network tab) to confirm the script loads.
- For custom scripts, ensure the intended functionality (e.g., a pop-up or event tracking) works.
Adjust the script if needed and save again.

Important: After adding and saving the code, always visit a checkout page to verify it works as expected—incorrect scripts can disrupt the checkout process.

🌟 JavaScript Added, Checkout Enhanced!

You’ve successfully added custom JavaScript to your checkout pages in Fleetwire! Your analytics or custom scripts are now live, helping you track and enhance the customer experience. Test your checkout today to ensure everything runs smoothly.

🚀 Next Steps

Enhance your checkout and analytics with these tips:

Customize Styling: Add CSS with Customizing Your Checkout Store with CSS in Fleetwire.
Track Orders: Monitor bookings with Registering Pickups and Returns in Fleetwire.
Set Up Payments: Accept payments with Setting Up Square Payments in Fleetwire.
Need Help? Contact us at hi@fleetwire.io or via the in-app chat.

Happy scripting! 🌟

Updated on: 15/05/2025