The new Learnyst website builder will help you design a multi paged website without any design experience.
In this article, let me show you how to create a professional looking website without any design skills using 128+ readymade layouts and blocks.
Premade Layouts & Blocks
The builder comes with a good collection of ready to import design layouts for websites and landing pages.
With the help of these design layouts, you can design websites/landing pages faster.
Note: The free plan comes with a small collection of premade layouts while you can enjoy a wider collection with the Pro plan.
You also get a good collection of ready to import premade design blocks.
With ready to import design blocks, you import a part/section of a webpage; for example, you can import a contact block, a gallery block, features block etc.
How to Import a Premade Layout
This is how you can import a premade layout to kick start a new project. Once you create a project, click on the + sign to start building your page.
In the window that pops up select the Layouts tab
Note: On the free plan, click on the Free category on the left to choose from free layouts and select a layout you would like to import.
When you select a layout to import, you will see a list of available page designs on the right and its preview on the left.
Select a page layout on the right and hover your mouse over the left pane to view the full preview of the layout.
Select ‘Replace Global Styling’ option at the bottom and click on the ‘Import This Layout’ button to import the layout to your page. This will import the global colors and typography of the premade layout.
You will see a new Global Styling preset by the name of the imported layout under the Global Styling screen.
Import a Block
While a premade layout imports a full web page containing multiple blocks, you can also choose to build your page by importing one block at a time from our premade block gallery.
Blocks are filtered by categories like: hero, contact or header blocks and more. To import a block to a blank page, click on the + sign in the middle of the page.
To import a block below or above another block, click on the + sign below or above the block.
The premade block library will open up. On a free account, you will see the Pro label on some of the premade blocks; use the ones without the Pro label.
Blocks are organized based on categories. You can find those in the left sidebar.
Every block has a light and dark version. If you like to use a dark version, select the Dark style.
You have two block design kits to select from; Kit 1 and Kit 2. By default, Kit 2 is selected. You can also import blocks from design Kit 1 by selecting Kit 1 from the Blocks dropdown.
For more tutorials on how to market your website, check out the course marketing tutorials series below.