Installation

  1. Download and uncompress CodePress under a directory inside your webserver.
    Example: http://yourserver/codepress/
    Since CodePress is pure JavaScript and HTML, you can also test it without a webserver.

  2. Insert CodePress script somewhere in your page inside the <head> or above the </body> tag.

    <script src="/codepress/codepress.js" type="text/javascript"></script>

  3. Add the <textarea> tag to the place on your page you want CodePress to appear. CodePress will inherit the width and height of your textarea. When the page loads, it will automatically replace your textarea with a CodePress window.

    <textarea id="myCpWindow" class="codepress javascript linenumbers-off">
       // your code here
    </textarea>

    • The javascript portion of the class="" means that the language being edited is JavaScript.
    • The codepress portion of the class="" is mandatory and indicates a textarea to be replaced for a CodePress window.
    • Other class options are linenumbers-off, autocomplete-off and readonly-on.
    • Careful not to use the same id for two different CodePress windows (<textarea id="xx"...>) and do not use characters like "." (dot) for id names.

You also can...

  1. Open/edit code from different places.
    Example 1: textarea_id.edit('other_textarea_id','language')
    Example 2: textarea_id.edit('h1 { color: red; }','css')
    Example 3: textarea_id.edit(document.getElementById('myCode').innerHTML,'html')
  2. Get code from CodePress window.
    Example: textarea_id.getCode()
  3. Turn on/off CodePress editor and return to the regular textarea.
    Example: textarea_id.toggleEditor()
  4. Turn on/off line numbers.
    Example: textarea_id.toggleLineNumbers()
  5. Turn on/off read only.
    Example: textarea_id.toggleReadOnly()
  6. Turn on/off auto-complete.
    Example: textarea_id.toggleAutoComplete()