This tutorial explains how to integrate Codepen in web based application. In the most of website you may have seen Codepen is integrated and it will display the output for the particular source code.
Now follow the below steps to embed Codepen in your webpage :
Now follow the below steps to embed Codepen in your webpage :
- Open the Codepen in browser.
- Create your new Codepen.
- Once you save your Codepen, it will generate one unique ID. You can get unique ID from the Codepen URL as well.
https://codepen.io/skptricks/pen/QQdJRX
- Now Place/replace that unique ID in below link :
NOTE: Also you can set width, height parameters in URL as per your requirement.
Example
Lets see the output :
Hope you like this tutorial, do let me know your comments below in comment box.
