Page tree
Skip to end of metadata
Go to start of metadata

Getting started with is super easy. In this guide you will invoke on a <textarea> as part of an HTML <form>.  When the <form> is submitted, the contents of the editor will be submitted as part of the <form> POST.  

To complete this guide, you will need access to a web server. This guide assumes a web server is running on port 80 on localhost. 

Step 1: Download a copy of and put it on a web server

  • Download the SDK from Tiny.
  • Unzip the package and open the textboxio-all or textboxio-client directory.
  • Move the textboxio subdirectory into a web accessible location on your web server (for example, localhost).

Step 2: Add to a page

With accessible via your web server, you can now include the script anywhere you would like to use the editor.

To add the script,  add the following inside your page’s <head> tag. 

<script src="http://YOUR-DOMAIN/YOUR-DIRECTORY/textboxio/textboxio.js"></script>

Step 3: Invoke as Part of a Web Form

With the script included, you may then invoke on any element (or elements) in your webpage. lets you identify elements to replace via a CSS3 selector. To add to a page you pass a selector to textboxio.replace().

In this example, you will replace <textarea id="mytextarea"></textarea> with a editor by passing the selector '#mytextarea' to textboxio.replace().

<!DOCTYPE html>
	<script src="http://localhost/textboxio/textboxio.js"></script> 
  <h1> Getting Started Guide</h1>
    <textarea id="mytextarea"></textarea>
    <button type="submit">Submit</button>
  <script type="text/javascript">
    var editor = textboxio.replace('#mytextarea');

For the best user experience, it is recommended that the HTML5 doc type is set.

<!DOCTYPE html>

Try it:

You’ve added to the page - that's all there is to it!

Next, we'll look at retrieving content as part of a <form> POST.

Step 4: Saving Content with a <form> POST

When the form is submitted, the editor mimics the behavior of a normal HTML <textarea> during a form POST. No additional configuration is required.

What's Next

At this point, you've seen how to create instances on a page using textboxio.replace(), and you've seen how to retrieve content from as part of an HTML <form> POST. There's way more under the hood if you're feeling adventurous: read on for more goodness: