Help needed embedding CodePen in posts

I’ve had a message from a member who’s having problems embedding CodePen in a post. According to this post, all you need to do is paste the link:

but the member says

Tried posting just the link of the pen, didn’t work. Tried it with iframe, didn’t work. Tried it with uploading, didn’t work.

I don’t use CodePen - can anybody help out here, please?

Can he give us the exact text he is pasting in?

He only needs to copy and paste… but make sure that you use the correct URL.

I use the URL I see in the address bar. CodePen has a share button that allows you to share that codepen with someone using a particular theme… on the top corner, at the right, you have some code that you can copy and paste too…

Don’t use the share facilities… not necessary and if you do, you’ll get a text with a link, not a view of the code and its result. At least, in Dicourse.

So I would say the right way is… load the window in your browser, copy the URL in the address bar… paste it in your post

Paste as plain text and not as a link.

See here for an example.

FYI, rebaking

Allowed the codepen to load.

Thanks, all, for the help. I’ve learned a couple of things, and hopefully this will help anybody else encountering difficulties.

The other thing to note is that the Pen won’t embed if it’s created anonymously. You have to have an account at CodePen (which is completely free, BTW).

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.