How to Build a Portfolio Website in Notion - Forms, Charts, Page layout & New Features

How to Build a Portfolio Website in Notion - Forms, Charts, Page layout & New Features

Learn how to build a portfolio website in Notion with our detailed guide. Master Notion's latest features including forms, sites, charts, and page layouts.

Learn how to build a portfolio website in Notion with our detailed guide. Master Notion's latest features including forms, sites, charts, and page layouts.

Resources

November 29, 2024

Description

Step-by-step guide: Build a professional portfolio website in Notion in under 10 minutes! Perfect for designers, developers, and creatives looking to showcase their work. Learn how to create a professional portfolio website using Notion's latest features in this comprehensive tutorial. Design an engaging portfolio website with custom Notion charts, Notion forms, and page layouts using the Notion site builder. Take your notion website design to the next level with professional features like SEO optimization and custom branding with Notion templates.

What is this video about?

This video will guide you how to create an impressive portfolio website using the latest features in Notion. You will learn how to design a skill chart, build a contact form to collect client information, publish your Notion pages with SEO optimization & custom branding using Notion sites, and create an engaging portfolio layout. The video provides a free workshop template to follow along. The template includes sections like an About Me page with your profile picture & introduction, a Contact Us button that opens a form, a skills showcase key metrics authority branding, testimonials, achievements, projects and a blog section.

The video will show you how to use Notion's new Page Layout feature to customize the display of your skills & other information. You'll learn to create a visual line chart representing your skill levels using Notion Charts. Also, the video will guide you through building a contact form using Notion's form feature. When clients click the Contact Us button, a pop-up form will appear for them to submit their name company, email phone number, and message.

The video aims to help you stand out with a professional and visually appealing portfolio website tailored to your needs. Here is the text rewritten with factual and easy to understand vocabulary, using only English: First, click the three dots in the top right corner of the form & select "Customize Form". Next, we need to adjust the permissions for this form so that people who are not in your workspace can also submit it. With these steps, we have created a basic form. Now, let's go back to the homepage to set up the "Contact Us" button.

Click "New Action", then select "Open Page or URL". Search for our form's title in the menu that appears. By doing this we have successfully embedded our Notion form into our portfolio website. If you want your contact form to have more advanced features, you can try using the free Tally form as your contact form solution.

Tally form offers advanced features such as conditional logic, allowing you to create forms that work for both individual and business clients. I will share the Tally form template for free in the video description. After copying the template go to the "Share" tab, select "Embed Form" & copy the embed link. Replace the original form on your homepage footer or contact page with your Tally form.

To highlight the differences let's create a new contact button for the Tally form. Follow the same process: select "Open Page" and search for the "Contact Us" page. This will give us a contact button for both the Notion form & the Tally form. The exciting thing is that all submissions from Tally form can be integrated into a Notion database.

To synchronize submissions from Tally form with a Notion database, navigate to the "Integrations" tab within the form. Select the option to link your Notion account and follow the provided steps. Once completed, your Tally form submissions will automatically sync with the designated Notion database. You may notice Tally's branding on your form.

To remove this and access advanced features such as email notifications for respondents, custom domain, and custom CSS consider upgrading to Tally's Pro Plan. With the Pro Plan, you can even create a checkout form with 0% fees, enhancing your ability to collect payments without additional costs. Finally, let's publish your website. First, go to the "Settings" tab of your account and find the "Site" option. If you haven't changed your website's link, you can customize your subdomain here to make it more branded.

If you're a paid Notion user, you have some cool options for adding a new domain. You can either go with Notion's domain, which is straightforward or you can pay $96 a year for your own custom domain. If you're subscribed monthly, you can purchase the custom domain for just one month at a time. It's a nice option for those who want to test it out or need it for a short-term project.

Once you've sorted out your web address, head back to the homepage. Find the "Share" button in the upper right corner of the homepage and make this Notion page public on the web. Don't forget to turn on search engine indexing, which lets search engines know you exist. For more advanced website customization, you'll need a Notion Plus subscription.

This lets you customize your site's theme and favicon. In the header section, you have several customization options. We definitely don't want our users to duplicate our entire website, and you can also enable search if you have lots of blog posts. If you don't want to show Notion's branding, you'll need to purchase the custom domain mentioned earlier. Finally we can add some important pages to our header so users can quickly navigate to specific sections.

For more advanced website customization, you'll need to purchase Notion Plus subscriptions. This allows you to customize your site's theme and favicon (the small icon displayed in the browser tab). In the header section, you have several customization options. We definitely don't want our users to copy our entire website, & you can also enable search functionality if you have many blog posts. If you don't want to show Notion's branding, you'll need to purchase a custom domain as mentioned earlier.

Finally we can add some important pages to our headers so users can quickly navigate to specific sections. Going back to the settings panel we can also add the Google Analytics Measurement ID to track user behavior on your website. Once you're done, click "publish changes," and we've successfully created an appealing portfolio website using Notion. I hope you found this video helpful and are excited about building your portfolio website.

Click the link below for the workshop template & follow the tutorial to create an impressive portfolio. If you'd like to support my tutorial videos or want a ready-made solution you can get the complete portfolio template that includes Notion Form, Chart, and page layout features, along with a bonus testimonial section. Thank you, and best of luck with your professional journey.

Summary

This article is a complete guide on how to build one such professional portfolio website using Notion’s new features like charts, forms, and custom layouts. The portfolio template comes with important sections like the About Me page, contact form, skills showcase, testimonials, achievements, projects and a blog section. This guide shows how to integrate and use both basic Notion forms and our advanced Tally forms to manage contacts with submissions syncing to Notion database. The tutorial will teach you how to use website publishing options such as domain customization, SEO optimization and Google Analytics integration, and the advanced customization features found in Notion Plus subscriptions.

Frequently Asked Questions

Q: What are the primary sections that come along with the portfolio template?
A: Sections of the template include About Me, a Contact Us form, skills showcase, key metrics, authority branding, testimonial, achievements, projects, and blog.

Q: What are the contact form options?
A: Users have the choice between a basic Notion form or an advanced Tally form. It also features additional features like conditional logic and integrates with Notion databases to automatically sync submissions to a Tally form. Either can be embedded into the portfolio via a Contact Us button.

Q: Are there any website publishing and domain choices?
A: Notion offers users the option to host their portfolio with a Notion subdomain for free — or to buy a custom domain for $96 a year, or on a monthly basis. From there, search engine indexing is enabled if you’re a premium (notion plus) subscriber and you get additional customization options for theme, favicon, and header settings.

Q: I want to know how to track and customize my portfolio website.
A: It allows you to configure a header navigation bar, allow or disallow pages duplication, allow or disallow search functionality, add tracking with Google Analytics and more. You can also remove Notion branding (by purchasing a custom domain). Through Notion Plus subscriptions, you also get advanced customization options.

Q: How can I start with the portfolio template quickly?
A: The tutorial does have a free workshop template to follow along to, however, for a completely built out premium template, we have already pre-configured Notion Forms, Charts, page layouts, and a bonus testimonial section for you to use right out of the box.

Albert

Notion Creator & Ambassador

Notion Recommended Creator, Productivity Expert, Youtuber, Founder of a Video Production & Marketing Company

HeyAlbert Youtube
HeyAlbert TwitterX
HeyAlbert Instagram
HeyAlbert Product Hunt
HeyAlbert Tiktok
HeyAlbert Youtube
HeyAlbert TwitterX
HeyAlbert Instagram
HeyAlbert Product Hunt
HeyAlbert Tiktok
HeyAlbert Youtube
HeyAlbert TwitterX
HeyAlbert Instagram
HeyAlbert Product Hunt
HeyAlbert Tiktok

Subscribe to our newsletter

Tips, Tools, Tutorials, Templates and systems for maximum efficiency.

Unsubscribe anytime.

Love it? Share it!