Social Tools

CodePen Embeds

CodePen is a “playground for the front end side of the web”. It’s a great tool to experiment with code and share it with others. You can easily share your “Pens” by embedding them to your WordPress.com site

You can sign up for CodePen and start making Pens here: http://codepen.io

To embed a Pen from CodePen, you will need to create or edit a Post or Page on your site.

Next, in your site’s post editor, paste the URL of your Pen on a line by itself (No HTML or Javascript needed!).

CodePen Embed

That’s it! The update will preview live in the Visual Editor so you can see what it looks like without having to click Preview Changes.

The final result will look something like this:

Not quite what you're looking for?

Get Help