Sharing CodePen 2.0 demos on DEV
If you've tried the new CodePen 2.0 editor, you may have noticed that the URL format has changed. And if you've tried sharing one of these demos here on DEV, you've probably also noticed that it do...

Source: DEV Community
If you've tried the new CodePen 2.0 editor, you may have noticed that the URL format has changed. And if you've tried sharing one of these demos here on DEV, you've probably also noticed that it doesn't work with the standard CodePen embed code: {% codepen https://codepen.io/editor/alvaromontoro/pen/019d657e-d7bc-746a-9bc3-4df2244c97cc/24ac30a5aad27b2b927702d3557c6e70 %} So, the new URL doesn't work yet... but what if you still want to include it in a DEV article? Good news: you can! You just need to use the hash for the CodePen demo instead. Here's how to find it: Click on the Share icon in the top-right corner Select "Embed" A modal will open, make sure "HTML (recommended)" is selected In the code, look for data-slug-hash and data-user Copy those values. Use them to generate a classic CodePen URL in the embed tag: {% codepen https://codepen.io/[USER]/pen/[SLUGH_HASH] %} That's it! In the screenshot above, the hash is "MYjBBrm" and the user is "alvaromontoro", that makes the URL https