Frontend Integration

This guide covers all frontend tracking events you should implement to get the most out of edrone.

Why frontend tracking?

Frontend tracking enables:

• Real-time user identification - recognize returning customers
• Onsite features - popups, recommendations, chat, social-proof
• Behavioral tracking - abandoned cart, browsing history
• Personalization - tailored emails based on behavior

Events overview

Implement these events on their respective pages:

Event	Page	Purpose
Homepage View	Homepage	Track homepage visits
Product View	Product pages	Track viewed products
Category View	Category pages	Track browsed categories
Add to Cart	Product/Cart pages	Track cart additions
Order	Thank you page	Track completed orders
Subscribe	Newsletter forms	Track subscriptions

Implementation checklist

• Add initialization script to all pages
• Implement homepage_view on homepage
• Implement product_view on product pages
• Implement category_view on category pages
• Implement add_to_cart on add-to-cart buttons
• Implement order on thank you page
• Implement subscribe on newsletter forms

Data encoding

URL Encoding

Always URL-encode values containing special characters:

• Product titles with special characters
• URLs with query parameters
• Category names with spaces

// Example: encoding product title
_edrone.product_titles = encodeURIComponent('Women\'s Shoes - Size 38');

Dynamic values

Replace static values with your platform's template variables:

// Example with template syntax (adjust to your platform)
_edrone.product_ids = '{{ product.id }}';
_edrone.product_titles = encodeURIComponent('{{ product.name }}');
_edrone.product_images = '{{ product.image_url }}';

Testing

After implementing events:

1. Browser DevTools - Check Network tab for requests to api.edrone.me
2. Test orders - Place a test order to verify the full flow