Skip to content

How to use Etherpad Lite with jQuery

johnyma22 edited this page Aug 13, 2011 · 10 revisions

Description

The Etherpad Lite jQuery plugin easily allows you to add a pad from Etherpad in a web page. It injects the pad contents into a div using iframes.

Usage

Include jQuery.js, include etherpad.js, assign a pad to a div. If you get confused look at the examples in index.html

Example #1: Sets the pad id and puts the pad in the div { $('#examplePadBasic').pad({'padId':'test'}); }

Example #2: Sets the pad id, some more parameters and puts the pad in the div { $('#examplePadBasic').pad({'padId':'test','showChat':'true'}); }

Available options and parameters { 'host' : 'http://beta.etherpad.org', // the host and port of the Etherpad instance, by default the foundation will host your pads for you 'baseUrl' : '/p/', // The base URL of the pads 'showControls' : false, // If you want to show controls IE bold, italic etc. 'showChat' : false, // If you want to show the chat button or not 'showLineNumbers' : false, // If you want to show the line numbers or not 'userName' : 'unnamed' // The username you want to pass to the pad. }

General

Resources

For Developers

How to's

Set up

Advanced steps

Integrating Etherpad in your web app

for Developers

Clone this wiki locally