Using the Source Code Editor

Advanced HTML Content Editor

The Source Code Editor

The Source Code Editor provides many useful features for editing raw HTML, like syntax highlighting and line numbering. It is used to edit the content of HTML components.

To open the Source Code Editor, double-click an HTML component on the canvas. The Source Code Editor opens in a pop-up window. When you are finished, click the Save button to save your changes, or the Cancel button to discard them.

Adding JavaScript Libraries

There are several ways to include third-party JavaScript libraries in your code. These techniques can also be used to add style sheets to your component, using <link> tags instead of <script> tags.

  • If the library is small, you can paste it directly into your component. For example, this code adds Bacon.js to your HTML:

<script type="text/javascript">!function(a, b, c){typeof module!="undefined"?module.exports=c(a, b):typeof define=="function"&&typeof define.amd=="object"?define(c):b[a]=c(a, b)}("bacon", this, function(a, b){var c={found:!1, s:navigator.userAgent.toLowerCase(), find:function(a){return this.found||(>=0), this.found}};return{isMobile:function(){var a=!1;return a=c.find("nokia"), a=c.find("blackberry"), a=c.find("android"), a=c.find("ipad"), a=c.find("ipod"), a=c.find("iphone"), a=c.find("opera mini"), a=c.find("opera mobi"), a}}})</script>

  • If the library is already available online, you can include a reference to it. For example, this code adds jQuery to your HTML:

<script type="text/javascript" src=""></script>

  • You can also upload the JavaScript library as a project asset and reference it from there.
    • Upload the file to your project library as an asset.
    • Right-click the asset, and choose Get URL from the context menu.
    • Use the URL in a script tag, like above.

    For example, this code adds a JavaScript library stored in an asset with the URL /wa/asset?oid=123456 to your HTML:

<script type="text/javascript" src="/wa/asset?oid=123456"></script>