CodePen swapping order of JS links


I had a problem with my Bootstrap collapsing navbar not working and discovered the order of links is important. So I changed to this in JS settings and everything worked:

However, when I open up the pen in another browser where I’m not logged in to CodePen, the order changes to the following and the collapsing navbar reverts to not working.

This isn’t a problem with saving my pen so the other browser is up to date.

I’ve found one other reference to this problem here but no solution.

If worse comes to worst I know I can just put the links in the head section of HTML settings.

Thanks a lot,


Ok, not sure what I’ve done but it all seems to be working now. Very odd.

I don’t suppose anyone knows anything about this issue anyway, or did I just imagine it?

This just happened to me and also broke my navigation bar. I spent about an hour going through my nav thinking I spelled something wrong and then finally saw that codepen had switched the order of my jquery and bootstrap.js files. Not sure why this is happening as I’ve been logged in the whole time. I’m guessing it just didn’t save correctly?

Sorry, just saw this. I think I discovered it had to do with how you entered the links. If you use the Quick-add it gives a “priority” to the link so that it renders at the top (or bottom) of the order, as opposed to links you type or paste yourself. Or vice versa. So if you have scripts not in Quick-add it might help to just paste all of them in manually so the order sticks.

Can’t remember exactly, sorry, and I don’t much use Codepen any more.