Embed Your Ply Code Anywhere

As we look towards April, I thought it'd be a good time to update everyone on dev status and a recent milestone we've hit on the Codeply Roadmap...

Introducing Embedded Plys

Plys are now embeddable for use on others sites. When you click the 'Embed' button from the ply's Metadata menu, a dialog modal opens with embedding options. An embedded ply will contain upto 4 tabs: View, HTML, CSS and JS. You can copy and use the default <script src="http://www.codeply.com/js/embed.js">.. code.

ply embed dialog

There are also some customization options to set the ply's default selected tab, hidden tabs or change the default frame height 300px. Changing the options will update the embeddable code accordingly by setting the attributes on the DIV container..

<div data-codeply="xxxxx" data-codeply-select="html" data-codeply-hide="css" data-codeply-height="280px"></div>

The default selected tab is the View ply previewing tab, and the CSS and JS tabs will be automatically hidden if the ply doesn't contain CSS or JS code.

If you want to embed multiple plys in a site, you just need to include the embed.js script once, and add containers for each ply you want to embed...

<script src="http://www.codeply.com/js/embed.js">

<div data-codeply="codeplyid1"></div>  
<div data-codeply="codeplyid2"></div>  
<div data-codeply="codeplyid3"></div>  

You can also use an iframe with the appropriate params if you're into that sort of thing!

<iframe src="http://www.codeply.com/embed/WPjOGYjLeT?height=350&hide=css,js&select=html">

The responsive embedded ply...

oEmbed API

As an oEmbed provider, Codeply also now supports the oEmbed v1.0 spec to support discovery and embedding of ply's on sites that support oEmbed as consumers.

Endpoint: http://www.codeply.com/api/oembed
Scheme: http://www.codeply.com/view/*

At this time most oEmbed consumers will only consume oEmbed providers that are white-listed. Codeply.com has been white-listed on iFramely and we're pending white-listing approval on Embed.ly. Of course we'll continue to champion Codeply embed support on more sites!