embed live code demo

  • Hi, I am wondering if there is plugin to do something like codepen/jsfiddle embed which I can have javascript/html/css code snippet and show the result?

    I found some plugin which can let me display code in Tabs, but there is no tab which show the result of javascript/html/css tabs works together.

    Sorry if I post in the wrong forum to post here.

Viewing 2 replies - 1 through 2 (of 2 total)

  • You can use an iframe tag to embed codepen and jsfiddle.

    Use this
    <iframe width="560" height="315" src="https://codepen.io/chriscoyier/embed/gfdDu" frameborder="0" allowfullscreen></iframe>

    Thread Starter changsijay

    (@changsijay)

    Yes, embed jsfiddle/codepen is straightforward.
    but it makes my blog content depend on the life of other services.
    (if someday they shutdown their service, many content of my demo would be invalid)

    What I want is like I can edit 3 tabs(javascript/html/css) in my post like below

    [html]
    some stuff here

    [css]
    some stuff here

    [javascript]
    some stuff here

    [result]
    which will display the result of above.

    • This reply was modified 6 years, 8 months ago by changsijay.
    • This reply was modified 6 years, 8 months ago by changsijay.
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘embed live code demo’ is closed to new replies.