Categories

Featured templates

Featured templates

Multipurpose Website templates. Novi Builder overview

Rating: 4.5/5. From 4 votes.
Please wait...

This tutorial provides the overview of Novi Builder editor.

  1. Novi builder has panels on the left and right sides. There you can adjust settings, add content and perform other actions.

    Novi Builder. Overview-1
  2. You can modify text double-clicking on it. You can set the font style or link using the icons above text. You can change titles of menu items in the same way.

    Novi Builder. Overview-2
  3. Images like logo can be changed using the Elements panel. Click on the logo. Elements panel may show different options for different elements.Click on Upload button in order to upload your image. Alternatively you can select the image from the media library. You can also add an image to the media library by clicking Upload button.

    Novi Builder. Overview-3
  4. You can access all pages in the Pages panel. Let’s open the About page.

    Novi Builder. Overview-4
  5. You can add a new page using this button:

    Novi Builder. Overview-5
  6. Let’s add content. Access the ‘Add content’ panel, select some content and drag it to the page. You can perform the same actions on the existing pages.

    Novi Builder. Overview-6
  7. Project Settings panel allows changing project settings, uploading favicon and changing User details (like phone and e-mail). You can also change Social share links.

    Novi Builder. Overview-7
  8. Inspector allows setting up the Layout, sizing and other options. You can also set layout options, typography options, background etc.

    Novi Builder. Overview-8
  9. Page settings panel allows setting options like SEO, Page name, External resources. You can also add references to custom scripts.

    Novi Builder. Overview-9
  10. Media panel allows uploading and managing content, e.g. images.

    Novi Builder. Overview-10
  11. Novi builder has several settings allowing you to check how your website looks on the mobile and portable devices. We have selected a mobile layout

    Novi Builder. Overview-11
  12. Top right section allows saving changes you have performed to the website. You can also undo changes you have performed recently using undo button. Preview section allows previewing your website. Changes automatically save when you access the preview mode. This is how the website look on the tablet layout (preview mode).

    Novi Builder. Overview-12
  13. Click on Generate your site in order to save your site. Be sure to generate site before closing the browser. Do not clear Browser’s cache and cookies if you want to perform modifications to your projects later. Upload Generated website to your hosting.

    Novi Builder. Overview-13

Take a look at the collection of premium website templates to choose the best items for your online project.

Feel free to check the detailed video tutorial below:

Multipurpose Website templates. Novi Builder overview
This entry was posted in JS Animated tutorials and tagged editor, JS Animated, novi, novi builder, website template. Bookmark the permalink.

Submit a ticket

If you are still unable to find a sufficient tutorial regarding your issue please use the following link to submit a request to our technical support team. We'll provide you with our help and assistance within next 24 hours: Submit a ticket