Marker.io is a powerful tool for e-commerce teams looking to improve their bug reporting and issue tracking process. This guide provides detailed steps and best practices for setting up and using Marker.io in your e-commerce operations. This makes for very clear communication between developers, designers, QA teams, and even your customers.
Why Marker.io Is Great for E-commerce Issue Tracking
Simplified Reporting: Capture screenshots, add annotations, and automatically collect technical details.
Deep Integrations: Link your existing project management tools like Jira, Azure, Trello, or Asana.
Clear Communication: Connect all stakeholders in one place, making issue tracking straightforward.
Better Customer Experience: Allow customers to report issues directly from your website.
How E-commerce Teams Use Marker.io
Here are some common scenarios where Marker.io can boost your operations:
Use Case | Example |
Internal Issue Reporting | Track bugs in staging environments during development. |
Live Environment Reporting | Quickly address issues on your live site before they impact customers. |
Vendor Collaboration | Work with third-party suppliers to resolve issues pre- and post-launch. |
Customer Issue Reporting | Let customers report problems directly, enhancing overall satisfaction. |
Getting Started with Marker.io
Create a Project
A project is where your team tracks issues. Here’s how:
Once you create a new project, enter your project Name, Website, and Integration. Many teams like directly integrating this project with their existing issue tracker or project management tools. In the example below, we integrate with Jira. We have many other integrations to choose from, and you can also continue without an integration, using Marker.io as your project management tool.
See our integration helpdesk area for help setting up your integration.
Add the widget to your website.
The next step is to connect the website/web app to Marker.io. You can install our widget in several ways. The JavaScript snippet installation is very straightforward once you can access your source code. Copy the snippet code above your website's closing </head> tag.
Invite Your Team
When setting up your Marker.io account, it's important to invite your team members.
Invite the following as Marker.io Members:
Internal Team Members
Project managers
QA teams
Development teams
External Team Members:
If any of the above teams are external to your organization, invite them as marker.io members also.
Invite external users generally as marker.io Guests, for example:
Clients
Beta testers
For complete details, check out our User Roles Guide.
Securing the Marker.io Widget
Ensure only the right people can access your widget:
Restrict the Widget to Specific Domains
Limiting the widget to certain domains ensures you only receive legitimate bug reports from authorized websites. This prevents spam issues from unknown sources.
For detailed instructions, see How to Restrict Domains.
Control Who Can See the Widget
By targeting the widget to specific users, you ensure that only the intended people can submit bug reports. For detailed instructions, see Control Marker.io Widget Visibility.
Understanding Marker.io forms
Marker.io forms help gather relevant information from different users:
Form Type | Use Case |
Guest Forms | Simple forms for public users and non-technical external reporters/clients |
Member Forms | Advanced forms for internal team members. |
Guest Forms
Guest Forms are intended for Public Reporters and External non-technical clients. These forms should be kept simple to avoid overwhelming non-technical users.
Member Forms
Member Forms are designed for internal team Members who are generally more technical.
Form features and settings
You can customize forms by:
Field Syncing: Automatically sync form fields with your project management tool.
Field Visibility: Control who sees what, based on user roles.
Default & Preset Values: Set starting values to guide users.
Mandatory Fields: Ensure critical fields are filled before submission.
For more customization tips, see our Form Configuration Guide.
Automatically identify your reporters.
Speed up reporting by autofilling user details like name and email directly from your web app. This improves the reporting process by:
Saving Time: Reporters don’t have to manually input their information.
Increasing Accuracy: Fewer manual steps mean fewer errors.
For setup help, visit our detailed guide.
Metadata Collection for E-commerce Teams
Marker.io helps e-commerce teams automatically gather advanced detailed metadata in bug reports, providing deep context for faster resolution of bugs. Examples include:
Customer ID: Unique identifier for each customer.
Customer Status: New, returning, or VIP.
Customer Country: Location of the customer.
Payment Method: Credit card, PayPal, etc.
Order Status: Pending, confirmed, shipped, delivered, etc.
For more details, see our custom metadata guide.
Inviting Users to Report Issues
To get started with issue tracking, invite users to report problems through:
Domain Whitelisting: Allow users with specific email domains to join.
Invite Links: Share a link to bring users onboard.
Workspace or Project-Level Invitations: Send invites directly from your workspace.
For detailed steps, check our user guide.
Submitting Issues Through Marker.io
Imagine a customer reports a broken “Contact Us” button:
The customer clicks on the Marker.io widget.
They take a screenshot and annotate the problem.
They fill out a simple form to provide details.
Reviewing Issues
Your internal team can then see the reported issue, review attached screenshots, and access automatically captured technical data like browser and device details. Session replays, console logs, and network requests are also available, making bug reproduction easy for developers.
Communicating with Reporters
Keep reporters in the loop through Marker.io’s issue page:
Reply to Comments: Reporters can receive email notifications and respond directly.
Automatic Status Updates: Any status change in your project management tool syncs with Marker.io and notifies the reporter.
Synchronize Status
When your team is ready to mark issues as resolved in your tools, this will automatically update its status in Marker.io and notify your client that all is resolved.
Give your internal team access to all issues.
If any of your internal team members would like to see the technical details of each issue, invite them as members to your account. Members see all of these technical details and can also submit their own issues, which can be deep technical issues with many fields.
For more information on our user roles, see our latest guide here.
Advanced Enterprise Features
Boost your e-commerce operations with advanced features designed for security, speed, and ease of management. Our Enterprise plans offer powerful tools to help with access control, maintain data privacy, and ensure accountability within your team. Features include:
Single Sign-On (SSO): Control workspace access with secure login options.
Audit Logs: Track activity for security and accountability.
Hide/Blur Sensitive Information: Hide or blur sensitive information in screenshots.
For a personalized demo and detailed discussion of these features, please request a demo here.
Summary
Marker.io simplifies issue reporting for e-commerce teams, making it easy to capture, track, and resolve bugs. If you need help, feel free to reach out via our support chat.