Introduction to Blocs 5 User Interface

Let’s take a look at the user interface of Blocs 5 website builder, including the Inspector, Layer Tree, Page Navigator, and more.

The "Getting Started with Blocs 5" video course is the perfect starting point for anyone who wants to learn web design. Designed specifically for beginners, this comprehensive tutorial series provides an easy-to-follow introduction to the Blocs 5 web design software.

Through a series of engaging and informative lessons, you'll learn how to use the software's various features and tools to create beautiful, professional-looking websites. Whether you're a complete beginner or have some experience with web design, this course will give you the skills you need to bring your web design visions to life.

So if you're ready to start your journey in web design, enroll in the "Getting Started with Blocs 5" video course today!

Introduction to the Blocs Interface

The Blocs interface is comprised of four main sections: the left toolbar with the Layer Tree and Page Navigator, the center Design Canvas, the right toolbar with the Inspector, and the top main toolbar.

The Layer Tree

The Layer Tree gives you a bird's-eye view of the entire structure of the currently selected page. You can manage your document by viewing the attributes of each layer and renaming or reordering them.

The Page Navigator

Easily access any page in your project with the Page Navigator, which provides a searchable overview.

The Design Canvas

The Design Canvas is where the visual output of your site is displayed. It allows you to interact with the page in real time, selecting elements, moving them, and editing their contents. The Design Canvas is located in the center of the main application window.

The Inspector

The Inspector is where you can style the currently selected element with custom classes, add custom data attributes, and even apply animation. You'll also find the quick launch controls for the Class, Asset, Swatch, and Menu Managers at the bottom of the right toolbar.

The Main Toolbar

The Main Toolbar, located at the top of the main application window, gives you quick access to project settings, active breakpoint, zoom level, preview mode, and the page dropdown menu.

Course Curriculum

14 lessons, 2 hours 2 minutes

1. Overview

2 mins

2. User Interface

10 mins

3. Settings

12 mins

5. Visual Design

12 mins

6. Classes

10 mins

7. Class Editor

12 mins

8. Typography

18 mins

9. Colors

9 mins

10. Project Assets

7 mins

11. Menus

7 mins

12. Animations

10 mins

13. Publishing

5 mins

14. Review

2 mins

Over 1200 beautiful custom designs!

The magically fast way to create websites in Blocs

Supercharge your web design workflow in Blocs 5.

blocs library-hero

What Blocs users say about Blocs Master

Read a testimonial letter from Frank.

This wonderful guy has created a series of videos (many free) which cover every aspect of Blocs in simple to understand examples. I promise he’s not paying me to write this, but I like many are indebted to him for the hours he has spent helping others.

- David

The best website to learn how to use Blocs. Eldar cares to help you if you have problems with the templates.

If you subscribe you will not regret it. It includes a large number of sample templates. 100% recommended

- Wardiam

The best place to learn virtually all there is to know about Blocs for beginners. And what better teacher than Eldar himself who spares nothing to make sure you are on the right track from step one through to intermediate.

- Sabina

What sets Eldar apart from other developers is his amazing customer service, attention to detail and his genuinely positive way of interacting with his customers.

- Lee

It is definitely worth the money if you want to learn Blocs quickly and efficiently, not to mention the many tips and tricks that Eldar has built into his lessons.

- Ive

If you are looking for an in-depth course on how to get the most out of Blocs, I highly recommend Blocs Master Course. 

- Arno