Category Archives: IPWEditor

IPWEditor – In-Place WYSIWYG Editor 1.2.1 Released with TinyMCE bug fix and more


IPWEditor provides easy in-place editing for Web pages with a layer of WYSIWYG. It allows you to seamlessly replace text on Web pages with inputs for on-the-spot editing.

Up until now IPWEditor did not support TinyMCE advance settings, due to a minor bug found and resolved by the community.
This release incorporates this bug fix and adds additional documentation around the ‘cancel’ functionality.

DEMO (TinyMCE)



Click me! I am editable and WYSIWYG!!! (TinyMCE)

Code behind:


<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.editable.ipweditor-1.2.1.js"></script>
<script type="text/javascript" src="tinymce/jscripts/tiny_mce/tiny_mce.js"></script>

<div id=”editable” class=”myipwe1″> Click me! I am editable and WYSIWYG!!! </div>

<script type=”text/javascript”>//set all the tinyMCE configuration here and pass it to the editable
$().ready(function() {
var ed = new tinymce.Editor(‘myipwe1’, {
theme : “advanced”

}); $(‘.myipwe1’).editable(
{
type: ‘wysiwyg’,
editor: ed,
onSubmit:function submitData(content){
alert(content.current)
},
submit:’save’,
cancel:’cancel’
});
});

</script>

download and docs

Formal documentation and download can be found here.

How to Connect IPWEditor to the Server Side

I have been getting multiple support requests from developers how want to save the data edited in IPWEditor on the server side.

Saving information in the server side is a server-side feature and out of scope for IPWEditor (which is a client-side JQuery plug-in), moreover, it is programming language depended – a java developer might handle this differently from a .NET or a PHP developer.

Despite all that, I will try to give general guild on how it is done, I will be using PHP for the server-side examples but you can use any server side programming language you prefer.

Continue reading

IPWEditor – In-Place WYSIWYG Editor 1.2 Released with TinyMCE support


IPWEditor provides easy in-place editing for Web pages with a layer of WYSIWYG. It allows you to seamlessly replace text on Web pages with inputs for on-the-spot editing.

Up until now IPWEditor has integrated only with FCKeditor. The major feature in this release is integration with TinyMCE, a popular WYSIWYG editor.

Developers can now choose to run IPWEditor with either FCKeditor or with TinyMCE editor using the same IPWEditor code.

Continue reading

IPWEditor – In-Place WYSIWYG Editor with FCKeditor and JQuery Editable


An In-Place editor, such as jQuery Editable plug-in, lets you seamlessly replace texts on web pages with inputs, for on-the-spot editing (see example 1). WYSIWYG editors, such as FCKeditor, provide easy, word-like editor on the web (see example 2). Basically, the two are advanced User-Interface JavaScript tools that help users edit content on the web in an easy, intuitive and productive way.

Wouldn’t it be great if we combine the two to create a really cool, web 2.0 user experience for editing content on the web? Unfortunately, FCKeditor and Editable are not fully compatible and some tweaking is required to make them interoperable.

In this article will demonstrate how, with little modification, FCKeditor can be integrated into Editable to create an In-Place WYSIWYG editor (see example3).

If you want to skip this documentation and just go to download the code and examples you can do so here.

Continue reading