Skip to main content
Custom Metadata

Customizing Metadata in Marker.io to Improve Debugging

Joe Scanlon avatar
Written by Joe Scanlon
Updated over 2 months ago

Adding custom metadata to your Marker.io issues provides developers with essential context, helping them to understand and resolve problems more quickly. By customizing metadata, you can include details specific to your application, like user roles, app versions, or order statuses, which makes debugging more straightforward.


Why Use Custom Metadata?

Custom metadata in Marker.io lets you add extra information to your issues, such as:

  • Better Context: Provide specific conditions that existed when an issue was reported.

  • Improved Debugging: Offer detailed data that makes identifying and fixing issues easier.

  • Tailored Information: Include data specific to your application’s needs, like user roles, app versions, or order statuses.


Types of Custom Metadata Supported

Marker.io allows you to add various types of metadata:

Type

Description

Number

Numeric values like order amounts or quantities.

Boolean

True/false indicators like availability status.

String

Text information such as usernames or product codes.

Array

Lists of values, like available brands or product categories.

Objects

Structured data with multiple properties.


How to Add Custom Metadata

You can inject metadata into Marker.io using two main methods:


Method 1: Embedding Custom Metadata via the JavaScript Snippet

This method involves adding custom metadata directly when your Marker.io widget is loaded. You can do this by modifying the JavaScript snippet that initializes the widget. Here’s how:

  1. Include a customData object in your widget configuration:

<script>
window.markerConfig = {
project: 'your_project_id',
source: 'snippet',
customData: {
storeID: getStoreID(),
storeName: getStoreName(),
customerId: getCustomerId(),
customerStatus: getCustomerStatus(),
customerCountry: getCustomerCountry(),
paymentMethod: getPaymentMethod(),
orderStatus: getOrderStatus(),
}
};
</script>

Example Use Case: If you want to add the user ID and app version as metadata:

<script>
window.markerConfig = {
project: '650d9785e9819c0f22aabbcc', // Replace with your project ID
source: 'snippet',
customData: {
userId: user_ID,
appVersion: app_ver,
},
};
</script>

This setup ensures that any issue reported using Marker.io includes the metadata, giving developers extra context.

If you use any of our integrations, the custom metadata will be added, as shown in the Jira example below:


Method 2: Dynamically Assign Metadata Using Marker.setCustomData() with the SDK

In more dynamic applications, you might need to update the metadata as the application state changes. The Marker.io SDK allows you to do this with the Marker.setCustomData() function:

Marker.setCustomData({
product: 'Banana',
available: true,
price: 1.23,
stock: 131,
brands: [
'The Organic Corp',
'ACME Fruits Inc',
],
});

Example with Dynamic User Data:

Marker.setCustomData({
userId: newUserID,
appVersion: newAppVersion,
});

This approach is ideal for cases where user information or application details change dynamically, providing developers with up-to-date and relevant information.


Viewing Custom Metadata

Once set up, all members can view this metadata when reviewing reported issues. This feature helps developers gain a deep understanding of the issue’s context, making the troubleshooting process faster and less stressful.


Best Practices for Custom Metadata

When you're adding custom metadata, it's a good idea to keep it readable and concise, especially since Marker.io and some of its integrations (e.g., Jira) have character limits (generally around 500 characters).

Example:

  • Rather than using a long, complicated string like this:

user:("id":"123abc", UserStatus: "Enterprise Customer", "createdAt":"2024-02-02", "paymentMethod": "Visa")
  • Try breaking it down into simpler, more readable lines:

UserID: 123abc
UserStatus: Enterprise Customer
CreatedAt: 2024-02-02
PaymentMethod: Visa

This format makes the metadata easier to read and manage, which is helpful when you need to quickly reference specific details.


Need Help?

If you have any questions, comments, or corrections, chat with us at the bottom right of our web pages.

Did this answer your question?