# Custom Map tutorial **URL:** \ **Category:** Help\ **Tags:** skillmaps\ **Created:** [August 27, 2024, 4:34pm UTC](https://forum.makecode.com/t/custom-map-tutorial/30322 "2024-08-27T16:34:26Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![sbergeroncp](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sbergeroncp/32/14567_2.png) [@sbergeroncp](https://forum.makecode.com/u/sbergeroncp)\ **Post date:** [August 27, 2024, 4:34pm UTC](https://forum.makecode.com/t/custom-map-tutorial/30322/1 "2024-08-27T16:34:26Z")
Hi there ! How can I make my skillmap ? Is there any tutorial step by step ? Thx ! Seb ---
**Author:** ![KIKIvsIT](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/kikivsit/32/10492_2.png) [@KIKIvsIT](https://forum.makecode.com/u/KIKIvsIT)\ **Post date:** [August 27, 2024, 4:58pm UTC](https://forum.makecode.com/t/custom-map-tutorial/30322/2 "2024-08-27T16:58:46Z")
We don’t have a completed tutorial yet, but we do have some docs and plenty of examples! You can take a look at these: - [https://makecode.com/writing-docs/skillmaps](https://makecode.com/writing-docs/skillmaps) - [https://makecode.com/writing-docs/tutorials](https://makecode.com/writing-docs/tutorials) - [https://github.com/microsoft/pxt-arcade/blob/master/docs/test/skillmap/class.md](https://github.com/microsoft/pxt-arcade/blob/master/docs/test/skillmap/class.md) - [https://github.com/microsoft/pxt-arcade/tree/master/docs/test/skillmap/class](https://github.com/microsoft/pxt-arcade/tree/master/docs/test/skillmap/class) ---
**Author:** ![sbergeroncp](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sbergeroncp/32/14567_2.png) [@sbergeroncp](https://forum.makecode.com/u/sbergeroncp)\ **Post date:** [August 28, 2024, 1:10am UTC](https://forum.makecode.com/t/custom-map-tutorial/30322/3 "2024-08-28T01:10:54Z")
I figured out something. Now. How can I carry the code over the next activity ? ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/c/7/c73f9ed4ec79085ef12d1ff94ae65a32b7b5b74c.png) ---
**Author:** ![KIKIvsIT](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/kikivsit/32/10492_2.png) [@KIKIvsIT](https://forum.makecode.com/u/KIKIvsIT)\ **Post date:** [August 28, 2024, 1:12am UTC](https://forum.makecode.com/t/custom-map-tutorial/30322/4 "2024-08-28T01:12:43Z")
Make sure you have template code in the tutorial that you’re trying to carry over to… > [@Tutorial Creators](https://forum.makecode.com/t/tutorial-creators/19464/59): > > Update…it is working with skillmaps loaded from my personal repo: [https://arcade.makecode.com/--skillmap#github:kiki-lee/forest\_test/forest.md](https://arcade.makecode.com/--skillmap#github:kiki-lee/forest_test/forest.md)@rymc88 Can you try putting your tutorial files in a folder with the same name as the skillmap? I can’t see a reason why that should be the issue, but it could be. If that doesn’t work, here are some of my ideas: Maybe try downloading this same forest\_new package from [https://github.com/kiki-lee/forest\_test](https://github.com/kiki-lee/forest_test) and see if it works for you If not, the d… ---
**Author:** ![sbergeroncp](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sbergeroncp/32/14567_2.png) [@sbergeroncp](https://forum.makecode.com/u/sbergeroncp)\ **Post date:** [August 30, 2024, 2:54pm UTC](https://forum.makecode.com/t/custom-map-tutorial/30322/7 "2024-08-30T14:54:12Z")
@KIKIvsIT it’s working now ! But now, how can I change the background picture ? Inside your code - backgroundurl: /static/skillmap/backgrounds/forest-comp.png I can’t find the png file in your repositories on Github. ---
**Author:** ![sbergeroncp](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/sbergeroncp/32/14567_2.png) [@sbergeroncp](https://forum.makecode.com/u/sbergeroncp)\ **Post date:** [September 3, 2024, 4:45pm UTC](https://forum.makecode.com/t/custom-map-tutorial/30322/8 "2024-09-03T16:45:32Z")
@KIKIvsIT I wanted to add a background so I tried this : ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/8/7/870447fe249d1a7d9f0a7b881a05899c51b5bbb0.png) Here is my png on Github ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/0/6/06b753049b96ee61ecced150a225540a27ef45c2.png) Any idea ? ---
**Author:** ![Winess](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/winess/32/25976_2.png) [@Winess](https://forum.makecode.com/u/Winess)\ **Post date:** [September 26, 2025, 2:25am UTC](https://forum.makecode.com/t/custom-map-tutorial/30322/10 "2025-09-26T02:25:21Z")
I know this is super late, but heres an example of how I did the background and banner: - bannerUrl: [https://raw.githubusercontent.com/sjwines/hourofai/master/assets/NavalStemLogo.png](https://raw.githubusercontent.com/sjwines/hourofai/master/assets/NavalStemLogo.png) - backgroundurl: [https://raw.githubusercontent.com/sjwines/hourofai/master/assets/NAVSEAMap.png](https://raw.githubusercontent.com/sjwines/hourofai/master/assets/NAVSEAMap.png)