--- title: Getting Started With KeymanWeb --- ## Prerequisite - First, if you have not yet obtained a copy of KeymanWeb, please visit [the KeymanWeb Developer Home](https://keyman.com/developer/keymanweb/). A link to the "https minified" version of the code will be used here. ## Demo To setup a basic first page with KeymanWeb, only two lines of code are necessary, but a few more lines will be shown here. Open [an example page](examples/__first-example.html). The source code for the page may be seen below. ```html KeymanWeb - A First Example

Click me and type:

``` ## The Breakdown - The `` loads the Keyman Engine for Web script for the page. - `(function() { ... keyman.init( ... ); ... })(keyman);` serves to initialize the web engine with default settings. By adding the object `{attachType:'auto'}` as a parameter to our `keyman.init()` call, the KeymanWeb engine will then link into any detected input elements automatically, regardless of browser or device, as part of its initialization. - The other ``, creates the language menu seen on non-mobile devices and the on-screen keyboard toggle button. For other options, see our [User Interface Design](user-interface-design) page. - The calls to `keyman.addKeyboards()` in the source above link in the two example Keyman keyboards used in this demo from our CDN server. For more info on how to include keyboards in your KeymanWeb installation, check the [Adding Keyboards](adding-keyboards) page. ## API References - On initialization: [`keyman.init()`](../reference/core/init). - On including keyboards: [`keyman.addKeyboards()`](../reference/core/addKeyboards). [Next: User Interface Design](user-interface-design)