Badge Details Popups

Badges can be extended to show a customizable popup when clicked. This pop-up can be used to add more context to a badge and show additional information. There are a few types of popups available, each with its own configuration settings. Popups are selected when the badge Edit feature is invoked. You can learn more about the Edit feature here.

Note that regardless of the type of popup you select, there is also an option to include descriptive text.

Image Popups

An Image popup allows you to upload an additional image to show when the badge is opened. This can be used to enhance the experience and story of your challenge.

Panorama Popups

A Panorama popup allows you to upload a 360-degree panorama image that is relevant to the badge. This should be an image in an equirectangular projection. This is a special format for encoding 360-degree panorama images. 

Users can view those images on their screen and pan and zoom to get a full 360-degree impression of some location.

Google Street View Popups (ADVANCED)

A Google Street View popup shows the Google Street View image of a specific location on the map. The user can look around to get a full 360-degree overview of where he/she is during the challenge.

By default, we show the street view as it would be on the specific location along the course (based on distance from the start). However, it is possible to show a specific street view that you have selected to give the best view. To do this, you'd need to enter the Panorama ID. You can find this value by: 

1. Open Google Maps and navigate to the location you want to show

2. Drag the little Street View icon to the approximate location. This will take you to a Google Street View.

   

3. Navigate on the map to the location you would like to show in your popup.
4. In your browser's url area, find the text in the url that is between th !1s and !2e. For example, in the Google Maps url: https://www.google.com/maps/@38.8052767,-77.0423681,3a,75y,95.65h,78.84t/data=!3m7!1e1!3m5!1s-pbZ7uT_5APBysRqK1ZIJg!2e0!6shttps:%2F%2Fstreetviewpixels-pa.googleapis.com%2Fv1%2Fthumbnail%3Fcb_client%3Dmaps_sv.tactile%26w%3D900%26h%3D600%26pitch%3D11.163455735386577%26panoid%3D-pbZ7uT_5APBysRqK1ZIJg%26yaw%3D95.65493158776408!7i16384!8i8192?entry=ttu&g_ep=EgoyMDI1MDMxOS4yIKXMDSoJLDEwMjExNDU1SAFQAw%3D%3D, the relevnt text is "-pbZ7uT_5APBysRqK1ZIJg".
5. Copy the part between !1s and !2e, in our case this is "-pbZ7uT_5APBysRqK1ZIJg"
6. Paste this value in the Panorama ID field and press Save.

Video

Video popups are not currently supported.