PhpFiddle Widgets 2.0

Phpfiddle widgets are HTML/CSS and JavaScript code that encapsulate user interfaces and PhpFiddle's APIs with JSON HTTP response, and any web pages could use Phpfiddle widgets freely to access Phpfiddle's services by copy-paste widget code

1 Run PHP/MySQL/HTML/JavaScript code

1.1 Widget preview

 

 

 

1.2 Widget code and installation


Copy-paste following code between two lines to your HTML head


<!-- JavaScript libraries of PhpFiddle Widgets --> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <link type="text/css" href="http://phpfiddle.org/js/codemirror/lib/codemirror.css" rel="stylesheet"> <link type="text/css" href="http://phpfiddle.org/js/codemirror/addon/pf/css_set.css" rel="stylesheet"> <script type="text/javascript" src="http://phpfiddle.org/js/codemirror/lib/codemirror311.min.js"></script> <script type="text/javascript" src="http://phpfiddle.org/js/codemirror/mode/pf/allmixed.min.js"></script> <script type="text/javascript" src="http://phpfiddle.org/js/codemirror/addon/pf/js_set.min.js"></script> <script type="text/javascript" src="http://phpfiddle.org/js/jquery.hotkeys-0.7.9.min.js"></script>
Copy-paste following code between two lines to your HTML body, and set widget parameters as needed
<!-- Run mixed code widget Run PHP/MySQL, HTML/CSS and JavaScript code with PhpFiddle services Widget parameters widget_width_percentage from 25 to 100 in percentage, other with 60 always widget_height_pixels from 50 to 650 in pixels, other with 260 always editor_width_percentage from 20 to 80 in percentage, other with 62 always eitor_placeholder with a string Keyboard shortcuts F8 Clear F9 Run Ctrl-Z Undo Ctrl-Y Redo Ctrl-[ Decrease indent ( Shift left ) Ctrl-] Increase indent ( Shift right ) Alt-Z PHP autocomplete, Alt-X JS autocomplete Version 2.0 copyright Copyright (c) 2014 PhpFiddle.org License http://opensource.org/licenses/MIT The MIT License (MIT) --> <script src="http://phpfiddle.org/deposit/widget_001.php ?widget_width_percentage=60 &widget_height_pixels=260 &editor_width_percentage=62 &editor_placeholder=Enter PHP/MySQL, HTML/CSS and JavaScript code here..." type="text/javascript"> </script> <div id="phpfiddle_widget_001"></div>

2 Search PhpFiddle code

2.1 Widget preview

 

 

 

2.2 Widget code and installation


Copy-paste following code between two lines to your HTML head
	

<!-- JavaScript libraries of PhpFiddle Widgets --> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <link type="text/css" href="http://phpfiddle.org/js/codemirror/lib/codemirror.css" rel="stylesheet"> <link type="text/css" href="http://phpfiddle.org/js/codemirror/addon/pf/css_set.css" rel="stylesheet"> <script type="text/javascript" src="http://phpfiddle.org/js/codemirror/lib/codemirror311.min.js"></script> <script type="text/javascript" src="http://phpfiddle.org/js/codemirror/mode/pf/allmixed.min.js"></script> <script type="text/javascript" src="http://phpfiddle.org/js/codemirror/addon/pf/js_set.min.js"></script>
Copy-paste following code between two lines to your HTML body, and tune widget styling as needed
<!-- Search code widget Search code from PhpFiddle code repository widget parameters widget_width_percentage from 40 to 100 in percentage, other with 60 always widget_height_pixels from 100 to 650 in pixels, other with 260 always editor_width_percentage from 30 to 70 in percentage, other with 38 always eitor_placeholder with a string Version 2.0 copyright Copyright (c) 2014 PhpFiddle.org License http://opensource.org/licenses/MIT The MIT License (MIT) --> <script src="http://phpfiddle.org/deposit/widget_002.php ?widget_width_percentage=60 &widget_height_pixels=260 &editor_width_percentage=38 &editor_placeholder=Click code id on left side to print out the code" type="text/javascript"> </script> <div id="phpfiddle_widget_002"></div>

3 Encoding and decoding

3.1 Widget preview

 

 

 

3.2 Widget code and installation


Copy-paste following code between two lines to your HTML body, and set widget parameters as needed


<!-- Encoding and decoding widget Widget parameters widget_width_percentage from 250 to 1560 in pixels, other with 550 always widget_height_pixels from 50 to 650 in pixels, other with 150 always Version 2.0 copyright Copyright (c) 2014 PhpFiddle.org License http://opensource.org/licenses/MIT The MIT License (MIT) --> <div id="phpfiddle_widget_003"></div> <script src="http://phpfiddle.org/js/pf-encode-decode.min.js" type="text/javascript"></script> <script src="http://phpfiddle.org/deposit/widget_003.php ?widget_width_pixels=550 &widget_height_pixels=150" type="text/javascript"> </script>

 

SQLite 3.8