Help Center

Things we get asked a lot (but that we’re happy to answer!)

The version of the SuperHi Editor that you should use depends on the type of functionality that you're currently looking for. Below are examples of the key differences between what each SuperHi Editor version currently supports.

SuperHi Editor V1

SuperHi Editor V1 has more features around handling files. For example, you can easily add favicons, SEO, and social sharing links from the "Page options" button and it also has an auto-refreshing full-screen preview.

SuperHi Editor V2

SuperHi Editor V2 has much better error reporting. It comes with collated warnings and errors at the top of the Editor, better descriptions when something goes wrong, and it will also pick up more issues than the v1 SuperHi Editor.

The v2 SuperHi Editor also has a very quick and automatically-refreshing inline preview as well as a settings.json file that allows you to turn some settings off to speed it up (see above) as well as modify the font size. It also allows for true multi-window editing: where you can open your project in multiple tabs or windows and everything will stay in sync.

The SuperHi Editor is a feature available to students who have joined a course, purchased our book, or signed up for a free account.

For new members:

  • You'll need to create an account with us first,

  • Then once you're logged in, in the secondary navigation at the top of your browser click the navigation title "Editor" to take you to the Editor page,

  • The options to download the Editor will appear in that window.

For existing students:

  • Log into your account,

  • Then once you're logged in, in the secondary navigation at the top of your browser click the navigation title "Editor" to take you to the Editor page,

  • The options to download the Editor will appear in that window.

We have two versions right now, so feel free to use both!

Yes! You can use your own custom third-party domains and connect them to your sites built with our SuperHi Editor. Additionally, all SuperHi sites come with free SSL Certificates for added protection.

Here's more information on how to connect a third-party domain

The first thing you need to do is to upload the font file! You probably have an OTF, TTF, WOFF, WOFF2 — or any or all of the above — and you'll want to upload those to the Editor first. Then you can start writing code:

/* add your `@font-face` declaration at the top of your CSS file */ @font-face { font-family: "My Font"; src: url("my-font.otf"); }

/* if you have multiple font files for the same font, style and weight then you can link them all in one `@font-face` but you'll also need to add a `format` field for each file */ @font-face { font-family: "My Font"; src: url('my-font.woff2') format('woff2'), url('my-font.otf') format('otf'); }

/* if you have multiple weights or styles of your font then it's a little more complex. note that you'll use the same `font-family` for each style or weight */ @font-face { font-family: "My Font"; src: url("my-font-regular.otf"); font-weight: normal; font-style: normal; }

@font-face { font-family: "My Font"; src: url("my-font-italic.otf"); font-weight: normal; font-style: italic; }

@font-face { font-family: "My Font"; src: url("my-font-bold.otf"); font-weight: bold; font-style: normal; }

/* and then you can use your brand new font */ body { font-family: "My Font"; }

If you're interested in browser support, which formats to use and why, then you can learn more here: https://css-tricks.com/snippets/css/using-font-face/

Yes! Every single site built on our SuperHi Editor includes SSL certificates when a domain is connected to it.

To ensure that your SSL Certificate gets activated you'll just need to log into your domain provider and create a CNAME record pointing to " yoursitenamehere.superhisecure.com".

We have more information on adding a domain to a SuperHi project if you navigate to the Domain page when you're in our SuperHi Editor. Follow these steps:

  • Log into our Editor

  • Click on the "Settings" gear icon in the left-hand sidebar

  • In the sub-navigation that comes up, click on the Domains section

  • In that window, scroll to the bottom to view our handy help video

As a note, domain connection processes may vary depending on the domain provider so if you're confused with the process, it also helps to reach out there!

Our SuperHi Editor is an intelligent code editor, designed to help you make websites from scratch easier. Set up projects, host everything in one place, and get your sites online with one click!

Designed with beginners in mind, it helps you learn and get started making websites right away, without worrying about all the technical stuff like hosting.