The main Editor Interface

Upon launching the editor, you will see the web page with the addition of a black bar on top, sporting the LiveCanvas logo.

On the right side there is a handy responsive preview feature.

It has all the standard Bootstrap breakpoints plus a retina 13” laptop:

  • XS (for a width of 375px, comparable to mobile phones)
  • SM (for a width of 576px)
  • MD (for a width of 768px)
  • LG (for a width of 1200px)
  • XL (for a width of 1440px)
  • New breakpoint! Added new XXL breakpoint for 1400px and up. (only for Bootstrap 5)
  • RETINA13 (for a width of 576px)
  • 100% (Full, native screen width)

More on the right, the Options menu reveals some advanced options:

  • Edit Main HTML: to review and edit all the generated code.
  • Edit Global CSS: to your own optional CSS statements to the site.
  • History: to review and restore past editing steps.
  • Download as HTML: to export your page content as a stand alone index.html file.
  • Reset Page: to delete your page and restart from scratch.
  • [FullScreen Mode: self explanatory].

The last buttons, Save and Exit, do the obvious.
It is interesting to note that contrarily to what happens with  other builders, the full page HTML is directly saved onto the database.