If you don’t know the coding but still want to build or create a website, you are in the right place. In this guide, you can create, design, and publish your website using Notion. Notion is a platform where you can organize and manage your daily tasks, projects, and many more.
One of the key advantages of Notion is that you can create a website without any programming language or coding. With easy-to-use built-in tools and templates, you can create a professional website and make it live.
The main theme of this step-by-step guide is to present you with how to build a Notion website in minutes.
How to Build a Notion Website in 10 Minutes (Step-by-Step Guide)?
This step-by-step guide aims to cover the following topics:
Add Navigation and Welcome Message in Notion
Add Quote Section with Image in Notion
Create a Home Button in Notion
Design Website Pages in Notion
Add the Latest Articles and Blogs on the Homepage of the Notion Website
How to Publish the Notion Website?
Create a Home Page in Notion
Follow the steps to create a homepage of your Notion website.
Step 1: Create a New Page
First, log in to the Notion account. Create a new empty page, as shown below:
Step 2: Website Name and Add Logo
Enter the name of your website like “AppBlends” and then click on the Add icon to add the logo of your website:
When you click on the “Add icon”, a new window will pop up where you can locate your logo file:
After uploading the logo file click on the Save button to properly add the logo for your website:
Step 3: Add Cover or Header Background
For the cover or header background, click on “Add cover”, as shown in the below screenshot:
You can choose the cover from the Notion Gallery or upload it from system:
Step 4: Create Website Footer
Go to the end of the page by pressing enter. Enter copyrights and other details. To customize it, select the text and apply the required changes:
For changing the background color, click on the grid button, on the left side of the text. Click on the color:
Go to the background color category and select your preferred color:
Add Navigation and Welcome Message in Notion
With the below steps, create a navigation block on your Notion website.
Step 1: Add Columns for Navigation
Right below the website title, type “/columns” and select the “2 columns” option from the given list:
Step 2: Add “Navigation”
In the first column, enter the “/callout” and select the Callout option. Enter a name like “Navigation”:
Step 3: Create Website Pages in “Navigation”
In the Navigation column, enter the names of the pages such as Notion, Spotify, and Discord. Select the them all and go to the “Turn into” option:
In the “Turn into” option, locate the “page” and select it:
All the selected names will turn into pages, as shown in the following screenshot:
Step 4: Add Icon to Page
You can also customize your website pages by adding Icons etc. For instance, to change the icon of the Notion page, click on the page icon:
Go to the Icon tab and search for the Notion icon:
You can choose the color of the icon from the list.
Note: You can add the icon from your system through the “upload” tab.
So far, you have created a basic homepage for your website. It will look like the following:
Add the welcome note or short introduction to your website in the right column.
Add Quote Section with Image in Notion
You can easily add a quote block for your Notion website using the following steps.
Step 1: Add Columns for Quotes Section
Go to your preferred location, type “/columns” and select the 2 columns from the list;
Step 2: Add a Suitable Image for the Quote
In the column, go to the “Image” and select it:
It will add a random image from the Notion gallery. You can change it by uploading it from your system.
For example, if you want to add an image from the “Unsplash” gallery, locate the “Unsplash” tab in the “Image” section and select an image of your choice.:
Step 3: Add Quote
Select the second column, type the “/quote” and select the Quote from the list:
Type the relevant quote and apply formatting if needed:
Create a Home Button in Notion
Follow the below process to create a Home button on your Notion website.
Step 1: Create Home Button
To create a Home button for your Notion website, type “/button”, and click the Button from the list:
In the Button option, click on the “New action” and select the “Open page, form or URL” option from the list:
Next, click on the “Select page, form, or URL” and then select the Home page:
For the page view, click on the “Center peek” and select the “Full page”:
Once you have updated the homepage settings, click the “Done” button to save the changes:
Step 2: Change the Homepage Icon
You can change the icon of the homepage button in Notion. First, click on the Home button and locate the Icon option from the list, as shown below:
Enter a name like “Home” and select the icon and color:
Here you go! You have successfully created a Home button for your Notion website:
Design Website Pages in Notion
You can design your pages on the Notion website through these steps.
Step 1: Design Page
Go to the page like “Notion”:
Add two columns for articles and blogs related to Notion and for Navigation pages:
Add all the relevant guides, blogs, and articles in one column:
Step 2: Create a Link of Navigation Block
To copy the Navigation block to other pages, you need to sync the block. First, select the Navigation column, go to the Open Menu, and select the “Turn into” option:
In the “Turn into” section, locate “Synced block” and select it:
The Navigation block has been successfully synced. Now, you can utilize the block on the other pages.
Step 3: Copy the Navigation Block
Click on the Navigation block and click on the “Copy link to block”:
Next, go to the page, such as “Notion”, and paste the link in the preferred location. You will be shown more options, select the “Synced block”:
This provides a convenient and simple way to copy and sync the block, such as Navigation anywhere on the Notion website.
Add the Latest Articles and Blogs on the Homepage of the Notion Website
The latest articles and blogs can be linked to the Homepage on the Notion website via the following procedure.
Step 1: Add Heading: Latest Articles/Blogs
Go to the particular line, enter “/h2”, and select “Heading 2” from the list, and type a heading like “Latest Articles/Block”:
Step 2: Add Columns for Latest Articles/Blog
Add three columns where you can add the latest articles:
Step 3: Copy the Link of the Latest Article
Now, locate the latest article on your website, click on it, and select “copy link to block”:
This will give you a link to the latest article, which you can paste in the appropriate location.
Step 4: Link the Latest Articles to Homepage
After copying the link to the block, go to Homepage and under “Latest Articles/Blogs”, past the link and select the “Synced block” from the list:
Repeat the procedure for other articles. You can find the final appearance of the page:
Upon completing all the above-mentioned steps, your Notion website is ready to publish.
How to Publish the Notion Website?
After completing the website, publish it using the following steps.
Step 1: Publish the Notion Website
Once you have built a Notion website, now it’s time to publish it. Simply, follow the steps:
- Locate the “Share” in your top-right corner.
- Select the “Publish” tab.
- Click on the “Publish” button, and that’s it.
Step 2: View Your Notion Website
To view the final website after publishing, click on the “View site”:
Congratulations! You have successfully built and published a website in Notion.
You can verify each page of your website, for example, click on Navigation > Notion to open the Notion page:
FAQs
Can I build a website in Notion without coding?
Yes, Notion enables you to build a website without any coding. With simple built-in tools and templates, you can create and design a professional website.
Can I publish or live the website created in Notion?
Yes, after you complete your website, you can publish it from Notion and share the link with your circle.
How can I publish my Notion website?
Once you have finished building the website in Notion, locate “Share”, go to the “Publish” tab, and select the “Publish” button to make your Notion website live.
Conclusion
Notion allows you to build a website in minutes. To create a complete website, follow a few simple steps: First, create a homepage. Next, design your website template and add content. Finally, publish it and share the link with your fans and friends.
