i love your awkwardness. make more tutorials. loveee

This is extremely helpful. Thank you so much! Does anyone know how I can display more than 100 collection items on the map? I'd appreciate a pointer!

This helped so much thanksss!!!!

Thank you for a great feature to Webflow and perfect map! 😀 I just have one challenge I hope you have the answer to. I just get the first 100 CMS items to show up on the map. How do I get the rest? When Switch on paginate i get these buttons next to the collection list to push next and when do so it loads the other 100 CMS items. I hope there is a way to pull all CMS items when load the map? Many thanks in advance! 😀

Thanks for the video, it was extremely useful! The only problem is that when I click on a circle on the map, I see not just one item, but all the items from the collection. Does anyone else have the same issue? How can I fix this? I have checked everything multiple times but haven't had any luck yet.

Loved this video, thanks KC!

Instant subscriber!! How fun! GREAT tutorial!

This was fricken Awesome! Thank you so much for taking the time to go over all this and to share the cloneable. It's things like this that are the reason why I stay up late in the night trying to "build along" with you in youtube.

Thank you

Thank you for an amazing tutorial KC! Few times I experienced some issues honestly, but that was only my fault tbh 😂 for anyone wondering, these were the issues that I experienced: 1. keep.track.of.your.changes.in.naming.stuff - I was changing the script ids and then adjusted ids of my elements (instead of products I needed pages etc.) and FORGOT that when I change the Name of the element it immediately changes the id name. So make sure you name everything correctly, I didn't and it took me half an hour to realise that hahah 2. Airtable works wonders, but, I also didn't listen very much to the crucial part (again, my fault) - using the "Bearer". I too have like zero experience with APIs, therefore I didn't really know that the word bearer needs to be in there as well. So like, bearer + space + api key. Had to create 3 credentials just to test it hahaha. 3. I thankfully had Success Message immediately in Webflow Logic, but when I tried to test live form, I received error message. I didn't realise I am using recaptcha on my website and that was the reason - so make sure you have recaptcha inserted in this form (which I quite struggled with because well... where to put it so I don't mess up the amazing layout you created?). After these three were solved, the calculator now works magic. I also had to use rounding in total amount, so if anyone is working with prices like $199 you should also incorporate this in your script. :) So yeah, it works perfectly, thank you very much for this amazing tutorial, subscribe button hit! 🫶

Can you turn this into a component instead of a cloneable website? I am trying to add it to my website into a section Is that possible?

Great tutorial

WHAT THE FISH!!! THIS IS AMAZING I LOVE FISH. Great work - Hope I match with Salmon (need that super like haha)

Really found this helpful KC. Thanks!

Thanks so much! My clients nedeed this and I was strugling to do this within a collection.

Great tips! I like the energy of your tutorials.

Super helpful and concise video, KC! You're a natural :)

I just wonder how KZbin knew that this was the correct video "For you" 😁 Definitely checking out Better Shadows 🥰

Nice video. Looking forward to watching more. Shared it on the SoF website too. 💪🏽

Thanks for the shout! I hope you like the app. And nice office closet! Looks like you're settling in to Oakland life just fine then 😅

SOOOOO COOOOOOOOL!!!

I am so stoked SVGImport got a chefs kiss! Thankyou so much for the review KC, you nailed the benefits demo of svg import better than I’ve ever managed to! Also use all four of these apps myself, I tried out Asset Bae on Thursday and it’s awesome. It feels almost like a game using the AI for alt text. Love it!

Do this apps have a limit in using AI or do they connect to ChatGPT API?

The 'chef's kiss(es)' part made this video...chef's kiss :D

I will definitely check out slater, looks useful! I love the style of this video btw, keep it up!

"The last app is pretty useful. Is it free?"

For anyone looking to do this now, if you clone the project, it won't work. You just have to : 1/ Update the version of mabpx-gl-js inside your head tag to match the version of mapbox that you've designed your map in. You can find this version in the settings tab inside mapbox studio. Thank you @Matthias-ps3qo for the comment below about that. But you also have to 2/ Change the mapbox style URL to your style URL (Line 28 of the body HTML code). And it should work!

Thank you so much for sharing this just what I needed!

Is the live link still active?

this was very helpful thanks for sharing KC!

Hey KC Katalbas, great tutorial! Would you know how to connect the final calculated price to a checkout page in the context of an e-commerce site? Thanks 😊

Have followed this to a tee but still can't get mapbox to load and it seems to be a common issue. Even the mapbox on he cloneable is not loading either so I assume something has changed since this video was published that has caused the error. Has anyone done this recently and found a solution?

This was exactly what I needed. I'm trying to link to an open accordion when you click a button from another page. so I added some code to look at the anchor that's in the url and if it's there there then open this specific accordion item. It works when I turn off interactions but no way to close which sucks. So you're right it doesn't seem to work when interactions are applied to the dropdown. I'd love to see an update or a workaround for this!

Well done!

Great content, thank's a lot

In case your map doesn't load and displays "Type Errors", such as Uncaught TypeError: Cannot read properties of undefined (reading 'composite') Make sure to update the version of mapbox-gl-js inside your head tag to match the version of mapbox that you've designed your map in. You can find this version in the settings tab inside mapbox studio.

'promosm'

This is so helpful, thank you!

Great video, KC! I always wondered how personality tests are setup, and your ranking method makes a lot of sense.

Thanks for the in-depth walkthrough! Also because of that smooth video/screen capturing.Is there any specific capturing software you are using for highlighting different parts of Figma and Webflow?

This was so fun to watch you build! The frog quiz is so silly.... I love it. My favorite question is "what's your favorite mode of transportation" only because "my froggy legs" as an answer made me lose it. I got Daniel, btw lol 🐸

I love your content ideas. Throughout your videos, just the right amount of technique to make a much better site than a boring one.

Whoohoooo! this is awesome

Hi, looks great, but I have a concern. Mapbox uses a public api key connected to your mapbox account. This API key is easily visible to anyone who knows how to inspect a webpage or track the network requests from a site. If someone took that API key and did some sort of denial of service attack (spamming refresh on the site thousands of times a second) you could well exceed the free tier for API requests. This could be dangerous as Mapbox doesn't stop after the max requests, it just starts charging you. Maybe I'm wrong, but people could be 'hacked' using this method, costing people a lot of money. I hope I'm wrong. I'll email Corey about this.

Hi, did you figure out how to add filters? I'm also trying to add clusters, any idea how to integrate those onto the map?

Thanks a lot. VERY HELPFUL!

nice, just a question, how would you go about adding a filter to this, one that you can use to filter through data using parameters like idk, type, area, or whatever

Thank you! Is it ok to add the 'window.innerWidth' property? to make the code only working on mobile?

I don't see anything in the browser. I have copied the code/CMS from your link, and change the API-token - but nothing shows up for me. Am I missing something?

Thank you for this tutorial KC! Has anyone done this with a styled email template using SendGrid, Mailchimp etc?