Skip to content

1. Getting Started

Jump to bottom
MarketingPip edited this page Mar 26, 2023 · 2 revisions

Note: This project needs contributors like you to help improve documentation, usage & more!

To start using Termino.js in your web page / HTML page. Define an HTML div tag where the terminal will be contained with a class or ID, as well a input tag with the class name termino-input for the terminal input. As well, a HTML tag (preferably code) with the class name termino-console for the terminal output. Then create a new terminal instance and convert the DOM element into a live terminal like the example below.

<!doctype html>
  <html>
    <head>
    <title>Termino.js Basic Example</title>
    </head>
    <body>
      <div id="terminal">
      <pre><code class="termino-console"></code></pre>
      <textarea class="termino-input" rows="1" wrap="hard"></textarea>
      </div>
      <script type="module">
        import {Termino} from 'https://cdn.jsdelivr.net/gh/MarketingPipeline/[email protected]/dist/termino.min.js';
        let term= Termino(document.getElementById("terminal"))
        term.echo("Hello world from https://github.com/MarketingPipeline")
      </script>
    </body>
  </html>

If you want use another class name instead of termino-input & termino-console, see Settings.

If you want to add your own custom functions / create animations etc, see Advanced Usage.

Clone this wiki locally