Demos
Tested on FF 3+, IE 6+, Safari 4+, Chrome 11+ and Opera 10+
Use a simple theme
Click on the text to enter in edit mode
Show Source
<div id="simpletobeedited"><h1>Test header 1</h1>
<h2>Test header 2</h2>
<h3>Test header 3</h3>
<p>It's support plenty of features from <b>bold</b> to <i>italic</i>, links : <a href="http://inplacericheditor.box.re">http://inplacericheditor.box.re</a><br />
<img src="http://inplacericheditor.box.re/images/small_cube_green.png" alt="Small Green Cube" /></p></div>
<script>
new Ajax.InPlaceRichEditor($('simpletobeedited'), '/demos/update', {}, tinymce_options);
</script>
Use an advanced theme
Click on the text to enter in edit mode
Show Source
<div id="advancedtobeedited"><h1>Test header 1</h1>
<h2>Test header 2</h2>
<h3>Test header 3</h3>
<p>It's support plenty of features from <b>bold</b> to <i>italic</i>, links : <a href="http://inplacericheditor.box.re">http://inplacericheditor.box.re</a><br />
<img src="http://inplacericheditor.box.re/images/small_cube_green.png" alt="Small Green Cube" /></p></div>
<script>
new Ajax.InPlaceRichEditor($('advancedtobeedited'), '/demos/update', {}, tinymce_advanced_options);
</script>
Use an advanced theme with tinymceSave and tinymceToElementSize features
Click on the text to enter in edit mode
Show Source
<div id="savetobeedited"><h1>Test header 1</h1>
<h2>Test header 2</h2>
<h3>Test header 3</h3>
<p>It's support plenty of features from <b>bold</b> to <i>italic</i>, links : <a href="http://inplacericheditor.box.re">http://inplacericheditor.box.re</a><br />
<img src="http://inplacericheditor.box.re/images/small_cube_green.png" alt="Small Green Cube" /></p></div>
<script>
new Ajax.InPlaceRichEditor($('savetobeedited'), '/demos/update', {tinymceSave: true, tinymceToElementSize: true}, tinymce_advanced_with_save_options);
</script>
RAILS demos controller code
class DemosController < ApplicationController
def update
render :text => params[:value]
end
end
