Create a jira tracking template to track 4 events, a CTA button, a task list when clicked 5 hyperlinks in the task list and when the notification bell is clicked and when a task in the notification bell is clicked. This is for a landing page. This event is tracked on the front end. Please suggest a template to documenting the requirements for this build, keep it direct and developer friendly
Hi event, Please stand by as I search the Mixpanel knowledge base for an AI-powered answer. I normally take about 15 seconds or so. In case AI cannot answer your question, feel free to reach out to Mixpanel support at mixpanel.com/get-support. If you have follow-up questions for this thread, please tag me again with your question: @kapa.ai <follow-up question> đź‘‹
Feel free to ask a follow-up question once I've answered by mentioning me with @kapa.ai
Certainly! Here’s a direct, developer-friendly Jira tracking template for documenting the requirements to track the specified 4 events on a landing page, following Mixpanel best practices. This template is based on Mixpanel’s recommendations for event naming, property usage, and tracking plan documentation [Best Practices].---
Jira Ticket: Implement Mixpanel Event Tracking for Landing Page
Summary: Track 4 key user interactions on the landing page using Mixpanel: CTA button click, task list hyperlink clicks, notification bell click, and notification task click.---
1. Events to Track
2. Implementation Requirements
- Tracking Method:
Use Mixpanel’s track method in the frontend code to capture each event [Track Events].
- Event Naming:
Use snake_case and the (object) (verb) format for event names [Best Practices].
- Event Properties:
Include relevant properties to provide context for each event (see table above).
- Consistency:
Avoid dynamically generated event names; use properties for dynamic values.
- Testing:
Ensure events fire correctly in Mixpanel when the corresponding UI actions are performed.---
3. Example Code Snippet (JavaScript)
js
// CTA Button
document.getElementById('cta-btn').addEventListener('click', function() {
mixpanel.track('cta_button_clicked', {
button_name: 'Get Started',
page_section: 'hero'
});
});LBKS// Task List Hyperlinks
document.querySelectorAll('.task-list-link').forEach(function(link) {
link.addEventListener('click', function() {
mixpanel.track('task_list_link_clicked', {
link_text: link.textContent,
link_url: link.href,
task_list_id: 'main_tasks'
});
});
});LBKS// Notification Bell
document.getElementById('notification-bell').addEventListener('click', function() {
mixpanel.track('notification_bell_clicked', {
location: 'header'
});
});LBKS// Notification Task
document.querySelectorAll('.notification-task').forEach(function(task) {
task.addEventListener('click', function() {
mixpanel.track('notification_task_clicked', {
task_id: task.dataset.id,
task_title: task.textContent,
notification_id: task.closest('.notification-dropdown').dataset.id
});
});
});LBKS```LBKS**(Replace selectors and property values as needed for your implementation.)**LBKS---
4. Acceptance Criteria
- [ ] All 4 events are tracked in Mixpanel with the specified properties. - [ ] Event names and properties follow Mixpanel naming conventions. - [ ] Events are visible in Mixpanel’s Live View when triggered. - [ ] Documentation updated with event/property definitions.---References: - Mixpanel: What to Track - Mixpanel: Events & Properties Best Practices - Mixpanel: Track Events---This template should help your developers implement and document the required Mixpanel tracking efficiently.
kapa.ai is still learning and improving, please let me know how I did by reacting below.
ℹ️ Tip: Mention @kapa.ai in the thread for follow-ups or DM the app for 1-to-1 help.
Let me check the knowledge base for you again. One moment! đź“š
Certainly! Here’s a user story template for your Mixpanel event tracking requirements, structured according to your requested format and based on Mixpanel’s best practices for tracking plans and event documentation [Create A Tracking Plan].---
User Story
As a product manager, I want to track key user interactions on the landing page (CTA button, task list hyperlinks, notification bell, and notification task clicks) using Mixpanel, so that I can analyze user engagement and optimize the landing page experience based on real user behavior.---
Key Deliverables
- Mixpanel event tracking implemented for:
- CTA button click (cta_button_clicked)
- Task list hyperlink clicks (task_list_link_clicked)
- Notification bell click (notification_bell_clicked)
- Notification task click (notification_task_clicked)
- Each event includes relevant properties for context (see event/property table below).
- Events and properties follow Mixpanel naming conventions and best practices [Best Practices].
- Documentation updated with event/property definitions.---
Required Update
- Frontend code updated to fire Mixpanel events on the specified user actions. - Tracking plan document updated to reflect new events and properties.---
Expected Outcome
- Product and analytics teams can view and analyze these events in Mixpanel to understand user behavior and identify areas for improvement on the landing page.---
Dependencies
- Mixpanel JavaScript SDK must be installed and configured on the landing page. - Access to Mixpanel project for event verification.---
Developer Note
- Use the (object) (verb) format and snake_case for event names. - Include all specified properties for each event. - Avoid dynamically generated event names; use properties for dynamic values. - Test events in Mixpanel’s Live View to confirm correct implementation [Track Events].---
Acceptance Criteria
GIVEN the Mixpanel SDK is installed and configured on the landing page, WHEN a user interacts with any of the following elements: - clicks the CTA button, - clicks any of the 5 hyperlinks in the task list, - clicks the notification bell, - clicks a task in the notification dropdown,THEN a corresponding Mixpanel event is fired with the correct event name and properties, and the event is visible in Mixpanel’s Live View.---
Event/Property Table
kapa.ai is still learning and improving, please let me know how I did by reacting below.
ℹ️ Tip: Mention @kapa.ai in the thread for follow-ups or DM the app for 1-to-1 help.
Let me check the knowledge base for you again. One moment! đź“š
Mixpanel does not require you to use snake_case (with underscores) for event and property names, but it is strongly recommended as a best practice. The main reasons for this recommendation are: - Case sensitivity: Mixpanel is case-sensitive, so eventname and EventName would be treated as two different events.
- Consistency and downstream compatibility: Using snake_case helps maintain consistency, especially if you plan to export data to other systems or data warehouses, where snake_case is often the standard [Best Practices].
- Readability: While lower case without underscores (e.g., eventname) is technically allowed, it can reduce readability, especially for multi-word event names.You are not technically prevented from using just lowercase without underscores (e.g., eventname), but this approach is not recommended by Mixpanel’s documentation. If you choose to do so, ensure your team is aligned and aware of the potential for confusion or inconsistency, especially as your tracking grows.> “Mixpanel is case-sensitive (eg sign_up_completed vs Sign Up Completed are considered two separate events). Mixpanel generally recommends keeping a consistent snake_case naming convention.”
[Tracking Plan Methodology]In summary: you can use lowercase without underscores, but for clarity, maintainability, and best practice, snake_case is recommended.
kapa.ai is still learning and improving, please let me know how I did by reacting below.
ℹ️ Tip: Mention @kapa.ai in the thread for follow-ups or DM the app for 1-to-1 help.