Creating a Portfolio Website Using Notion

Creating a Portfolio Website Using Notion

Creating a Portfolio Website Using Notion

Creating a Portfolio Website Using Notion

How to use Notion

November 30, 2024

Feeling overwhelmed, in a sea of people around you. Unsure how to make a mark for yourself amidst the crowd? Lets delve into the enhancements in Notions together! We'll discuss the additions such as Notions website functionalities including forms and charts along, with enhancements to page layouts. By utilizing these features we can design a portfolio webpage that highlights your talents and knowledge effectively.

Getting Started with Notion Templates

You can start by downloading the workshop template at no cost thing to do is download the workshop template, for free You will then have access, to a designed layout that we can utilize as our initial step This template includes various fundamental functions that will assist you in organizing your portfolio efficiently

Pre-designed Notion template layout

Exploring the Template Features

At the top of the template, you'll find the About Me section. Here, you can add your profile picture and a brief introduction. Below that is a Contact Us button that opens a contact form, which we will learn to create later. Next is your skills showcase, designed to help clients understand your strengths. This includes categories like software expertise and languages.

Furthermore there's a compilation of your abilities, for a encompassing perspective.. To enhance the appeal of your portfolio we've included segments on metrics and known brands to add credibility.. People appreciate having access, to figures and reputable endorsements as they visit your portfolio..

Metrics and authority brand sections

Testimonials and Achievements

Below the skills showcase is a Testimonial section. Each testimonial includes the person's name, job title, company, message, and star rating. This is a bonus section, not included in the workshop template, but I’ll show you how to get this bonus section at the end of the article.

In the hidden properties, you can select the rating, and the star display will update automatically. Further down, you’ll find your Achievements section, where you can add competition names, awards, and badges. The Project section allows you to include project names, years, clients, descriptions, and related URLs if needed.

Blog and Subscription Features

The blog section shows article titles, authors, last update times, and estimated reading times. Additionally, there’s a Subscribe to Our Newsletter button that will pop up a subscription form. This subscription form currently uses my link, but you can embed your own at any time. The View More button directs users to the blog page.

Blog section with article details

Customizing Your Portfolio Layout

Now let's start with Notion's page layout feature. Click on any skill, then click Customize Layout at the top. In the layout settings, click Add to Panel. You can choose any database property to display in your panel. We will use the proficiency rating property here.

When it appears in the side panel, click the three-dot icon and select Move to Page. This helps keep the main page uncluttered by relocating the property group to the panel. Click the top module to pin important properties—specifically, levels and types. Once done, click Apply to All Pages.

Customizing layout settings in Notion

Creating Charts to Showcase Skills

To enhance your portfolio's uniqueness, let’s create a line chart that provides a visual overview of your skills. Right-click any tab and select Duplicate under layout options. Choose Chart and click Edit Chart. From the chart types, select Horizontal Line Chart. For axis configuration, set proficiency rating as the X-axis and skills as the Y-axis. Customize your chart's appearance in the style section.

Creating a line chart in Notion

Integrating Contact Forms

Next, we will explore the exciting Notion form feature. When your clients click the Contact Us button, a pop-up will appear displaying a contact form. To set this up, go back to the workshop template's landing page. Navigate to the database page and use the Inline Database Command to create a database called Contact Form.

Next, create the necessary properties for the contact form, including client name, company name, email, contact number, and client's message. To generate a form based on your database, click the plus icon in the tab section and select Form. Notion will automatically create the form for you.

Creating a contact form in Notion

Customizing the Contact Form

In this tool, for creating forms you have the option to name the form and provide a description for it as rearrange the questions by moving the modules around with your mouse cursor. To mark a question as compulsory or switch it to an answer format simply click on the right corner of the respective module. Additionally you can include details to elaborate on each question and customize both the form submission button and the message displayed to users upon completing the form submission.

We must now modify the permissions, for this form to allow users, outside your workspace to submit it well By following these steps we have established a form.

Configuring the Contact Us Button

Now let's return to the homepage to configure the Contact Us button. Click New Action, then select Open Page or URL. Search for our form's title in the subsequent menu. By doing this, we’ve successfully embedded our Notion form into our portfolio website.

Configuring the Contact Us button

Using Tally Forms for Advanced Features

If you want your contact form to have more advanced features, you can also 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 B2C and B2B clients. I’ll share the Tally form template for free in the video description.

After copying the template, go to the share tab, select Embed Form, and copy the embed link. Replace the original form in your homepage footer’s 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 and the Tally form.

Using Tally form for advanced features

Synchronizing Tally Form with Notion

The best part is that you can connect all entries from a Tally form to a Notion database seamlessly! Simply go to the integrations section, in the form to sync Tally form submissions with your Notion database by linking your Notion account and following the instructions provided there. Once you've finished the setup process as guided on linking your account and following through with the steps shown on screen your Tally form submissions will be smoothly synced with your chosen database without any extra effort, on your part.

You might see Tallys logo on your form page.You can get rid of this. Unlock features, like email alerts for respondents,a custom domain and custom CSS, by upgrading to Tallys Pro Plan.With the Pro Plan you can also make a zero percent fee payment form to improve your payment collection capabilities without incurring expenses.

Publishing Your Website

Lets wrap up by getting your website ! Start off by heading to the settings section of your account and locating the sites feature. If you haven't altered your website link yet. Want to give it a bit character with a personalized subdomain option available here. For paid users of Notion, like yourself. There are some choices, for incorporating a domain name if needed. You have two options; stick with Notions domain, for simplicitys sake or opt for an upscale route by investing $96 annually in your personalized domain name.

If you choose to subscribe on a basis you have the option to buy the domain for a single month only.This is a choice, for individuals looking to try it out or requiring it for a project duration.

Publishing and customizing the website

Finalizing Your Portfolio Website

After arranging your website address return to the homepage. Locate the share option situated at the top right corner of the page to make this Notch page accessible, to the public online.Make sure to enable search engine indexing that's how you inform search engines of your online presence.

For website personalization options, on Notions Plus subscriptions are necessary. These subscriptions allow for adjusting your sites theme and favicon. Within the header section of the website layout customization options are available. It's important to prevent users from replicating our website and consider enabling search functionality, for websites with a volume of blog posts.

Finalizing your portfolio website

Conclusion

Finally, we can add some important pages to our headers so users can quickly navigate to specific sections. 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 you’ve successfully created an appealing portfolio website using Notion.

This guide should be useful, for you as you embark on creating your portfolio website. I hope it has been of help to you far in your journey towards building a professional online presence. If you're interested in backing my efforts or prefer a made solution instead of a DIY approach; there's an option to obtain the full portfolio template which comprises features like Notional Form integration and various page layout options as well, as an additional testimonial segment included. Appreciating your consideration. Wishing you the best of luck as you progress in your endeavors!


FAQs

What is Notion?

Can I create a portfolio on Notion for free? How do I customize my Notion portfolio? You have the freedom to personalize your Notions portfolio by incorporating sections and layouts while also integrating forms and charts based entirely around your preferences for a tailored experience. What features does the Tally form offer?

Can I create a portfolio on Notion for free?

Sure thing! You're able to set up a portfolio using Notion at no charge ! They've got a bunch of templates for you to kick things off without spending a dime. How do I customize my Notion portfolio? You have the freedom to personalize your Notions portfolio by incorporating sections and layouts while also integrating forms and charts based entirely around your preferences for a tailored experience. What features does the Tally form offer?

How do I customize my Notion portfolio?

You have the freedom to personalize your Notions portfolio by incorporating sections and layouts while also integrating forms and charts based entirely around your preferences for a tailored experience.

What features does the Tally form offer?

The Tally form provides options, like conditional logic and custom domains while also integrating with Notions databases to create robust contact forms effectively.




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.

Related Post