Custom Badge Images

API & SDK
1

Originally posted by Craig

Is there a way to include our own custom badge images? Or do they need to be selected from the existing ones that you have defined?

2

Hi, I know this was posted a while ago, but just wondering if you ever got an answer for this?

Wouldn’t mind creating some custom badge images

3

Hi Chris,

You can create custom Badges in ServiceM8, but you can’t upload your own custom badge images.
When you create a custom Badge, you choose an icon from the built-in dropdown list, and Badge images can’t be changed (only the Badge name can).

The steps are in our Badges guide here: What are Badges, and how do I use them? - ServiceM8 Help Center

Once you’ve tried creating one, reply here if you still can’t find an icon that fits what you’re after.

Thanks,
Cody

4

thanks Cody.

All over that, I was just hoping there was also a way to upload a custom png image or something

Cheers

5

Hi Chris,

Badges use the built-in icon set (when you create a custom Badge you select an icon from the dropdown list), so custom PNG uploads for badge icons aren’t supported.

Also worth noting that badge images can’t be changed (only the name can), and once a custom Badge is created its colour and icon can’t be changed either.

Guide: What are Badges, and how do I use them? - ServiceM8 Help Center

Thanks,
Cody

6

Thanks for the help :+1:

7

If anyone’s interested, I figured out how to do this with the API.

When creating a badge, set the file_name param to a public URI of your badge image png. It can be stored anywhere online.

Use this image as a template. Don’t change the dimensions, just edit the three examples in place.

badge_aedfe4d2-c878-4b6a-8b37-23878870978b

I haven’t been able to change the image of a badge that was generated in ServiceM8. For example, for forms etc. It appears to only work for custom-created badges.

Good luck!

8

Hi Chris,
This is the way to do it. The image is a sprite and and the servicvem8 front end effectively seperates it into 3 images. Eg Top inactive, middle is hover state and bottom is active

The only thing I have found when doing this is when using the custom badge sprite, it seems that the mobile doent render the sprites and displays the whole image. Not a massive issue and it renders fine on the desktop. Just an fyi

image
image613Ă—501 29.9 KB

1 Like
9

Hi Michael,

Good find, and just to clarify for anyone landing on this thread: in the ServiceM8 UI, badge images can’t be changed (only the name can), and when creating a custom badge you select an icon from the dropdown list.

If you’re working via the REST API, the Badge create/update endpoints include a file_name field in the request body (POST /badge.json and POST /badge/{uuid}.json). Both endpoints require the manage_badges OAuth scope.

The API reference lists file_name as a string field but doesn’t currently describe what values it should contain, so if you’re seeing different rendering behaviour on mobile vs desktop with a custom sprite, email support@servicem8.com with a couple of examples (badge UUID + screenshots) and we’ll get it in front of the team.

Thanks,
Cody