Featured

Intro To Editor X Masterclass | Build A Free Website Tutorial For Beginners #001



Published
In this intro to Editor X Masterclass course, you'll learn the basics and fundamentals of Editor X.

You will get familiar with the UI, and understand what grids, containers, stacks, and all the other important things you need to know to make your very first responsive website in Editor X for free :)

By the end of this Editor X Masterclass, you'll have either built, if you've followed along with me live, OR have the knowledge to build your very own responsive website from scratch in Editor X!

Let's get started!

Download the asset library:
https://create.editorx.com/libraries/share/141a6123-1249-4fb5-bdee-391d9ead3942

Project/design inspired by: Vladimir Gruev
https://dribbble.com/shots/14458191-people-visual-identity-web-page/attachments/6140647?mode=media

Join Our Discord Community to get any Editor X questions you have, answered:
https://discord.gg/rWpnVKTDje

Timestamps:
00:58 Intro
2:54 EditorX.com
3:20 Final Website Showcase
5:22 Logging into Editor X for the first time
5:34 How to create a new site
5:38 Editor X Website Templates
7:13 Intro To Editor X User Interface
7:34 Add Elements Panel
7:46 Layers Panel
8:30 Pages Panel
8:44 Inspector Panel Explained
11:41 Breaking down how we're going to build the site
16:26 TUTORIAL BEGINS
35:56 How to place multiple elements into a container
36:51 Introduction to grids in Editor X
42:30 Margins Explained
42:48 Making site responsive
42:54 Explaining responsiveness in Editor X
43:39 Working with percentages in Editor X
44:29 Responsive Scaling Text Explained
46:18 Responsiveness Tip #1 for making your Editor X website responsive
48:37 Breadcrumbs in Editor X Explained
49:20 Max Content Explained & How To Use It in Editor X
51:47 Responsiveness tip #2 how to troubleshoot responsiveness
57:32 The Inspector Settings Overrides The Advanced Mode Custom Settings
1:03:00 Making Tablet Responsive Layout
1:05:43 Making Mobile Responsive Layout
1:08:47 How to easily move elements around within grid cells in Editor X
1:10:09 How to check if your Editor X website is fully responsive
1:10:49 Adding final touches to the responsive website
1:13:37 Publishing the website
1:17:22 Adding animation
1:18:48 Finished website showcase
1:19:35 Outro


Join Brandon Groce every Monday & Tuesday at 1pm EST (on the 1st week of every month) to learn how to approach each challenge using Editor X. Practice along with me and you’ll be on your way to sharpening your skills. Get your questions answered, see what the community is creating and get feedback on your work!

Editor X is a no-code tool that allows you to build a responsive website for professional use. It's powerful, easy to use, and fully featured. This episode is all about how to create a simple homepage using grids in minutes within Editor X.

#editorx #BuildAWebsite #nocode #Masterclass
Category
Web design
Be the first to comment