• Skip to main content
  • Skip to header right navigation
  • Skip to site footer
CDP Studio logo

CDP Studio

The no-code and full-code software development tool for distributed control systems and HMI

  • Doc
  • Why CDP
    • Software developers
    • Automation engineers
    • Managers
  • Products
    • Automation Designer
    • HMI Designer
    • Maritime HMIs
  • Services
  • Use cases
  • Pricing
  • Try CDP

CDP Studio Documentation

  • GUI - Web UI
  • How To Create New Web UI Application
  • 5.0.0

How To Add Web UI to an Application How to Use JavaScript in Web HMI GUI

How To Create New Web UI Application

To create a new Web UI application, make sure you first have a system (see How to Create a System). Then select the system in the Project tree, right-click, select Add New... and select CDP Application in the dialog that pops up, then click 'Choose...'.

When choosing Type of Application, choose WebUI in the list of application types:

After the wizard is finished, Design mode becomes enabled, and you can start creating your GUI as described in Design mode manual.

Once the GUI is ready and you want to run it in a web browser, do the following:

When the application is running and connected, click on the application in Configure mode Project tree and choose the Table Editor tab. Go to the Properties section, find the property called WebURL. This is the link for the web browser. You can also open the browser directly by clicking the icon next to the url. Note that there is a WebFilesToServe property in the application configuration that must list all files and folders that should be accessible in the web browser. If the WebFilesToServe is not set up correctly, then the web browser might not show the content correctly, or it might not function correctly.

See also How To Show Existing GUI in Web Browser and How To Add Web UI to an Application.

How To Add Web UI to an Application How to Use JavaScript in Web HMI GUI

The content of this document is confidential information not to be published without the consent of CDP Technologies AS.

CDP Technologies AS, www.cdpstudio.com

Get started with CDP Studio today

Let us help you take your great ideas and turn them into the products your customer will love.

Try CDP Studio for free
Why CDP Studio?

CDP Technologies AS
Hundsværgata 8,
P.O. Box 144
6001 Ålesund, Norway

Tel: +47 990 80 900
E-mail: info@cdptech.com

Company

About CDP

Contact us

Services

Partners

Blog

Developers

Get started

User manuals

Support

Document download

Release notes

My account

Follow CDP

  • LinkedIn
  • YouTube
  • GitHub

© Copyright 2025 CDP Technologies. Privacy and cookie policy.

Return to top