JSFiddle Shortcode

Allows to easily embed Fiddles using a small shortcode.

Author:Willington Vega (profile at wordpress.org)
WordPress version required:3.2.1
WordPress version tested:5.2.2
Plugin version:1.1.1
Added to WordPress repository:16-07-2011
Last updated:07-07-2019
Warning! This plugin has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.
Rating, %:100
Rated by:2
Plugin URI:https://wvega.com/492/jsfiddle-shortcode/
Total downloads:3 605
Active installs:100+
plugin download
Click to start download

Allows to easily embed Fiddles using a small shortcode.

Usage:

[jsfiddle url="http://jsfiddle.net/wvega/UupFu/" height="300px" include="result,html,js,css" font-color="39464E" menu-background-color="FFFFFF" code-background-color="f3f5f6" accent-color="1C90F3"]
  • All attributes are optional.
  • url is the URL of the fiddle you want to embed, with or without trailing slash.
  • include can be any combination of result, html, js and css, separated by commas; the tabs in the embedded fiddle will follow the order specified with the include attribute.
  • font-color is the color used for the name of the tabs.
  • menu-background-color is the color used for the background of the tabs.
  • code-background-color is the color used for the background of the area where the code and results are shown.
  • accent-color is the color of the indicator shown below the active tab.

Result:

<iframe style="width: 100%; height: 300px" src="http://jsfiddle.net/wvega/UupFu/embedded/result,html,js,css/?fontColor=39464E&menuColor=FFFFFF&bodyColor=f3f5f6&accentColor=1C90F3"></iframe>
ChangeLog