After reading this post and following the video tutorials added – you will be able to create a Free Portfolio Website without coding knowledge to showcase your professional skills, achievements and stand out like a pro!
To give a clear step by step walkthrough, I have got video lessons for you to start building your free portfolio website.
If you don’t know – how to write HTML, CSS, and other coding staffs – and you are interested to make your own portfolio website – simple read the blog post and watch the lessons recommended.
As we are going to create the site for free, we are going to use Blogger platform – which is a free Google service.
What you are going to learn?
1. Start building a website from scratch
2. Upload custom theme on Blogger (theme provided)
3. Customize the theme to make it work for you
4. Add portfolio Examples
5. Add a custom domain name to the portfolio website to make it full professional!
Enough talk, let’s get into the original information!
Here is the first – the intro video of the Step by Step portfolio website building lessons, where you will see me talking with you regarding our mission!
It’s nice to introduce myself to you, and I have given you some information regarding the website we are going to work on throughout the video lessons.
We are going to host our portfolio website on Blogger.com, which is Google’s product and completely free to create websites from!
After hosting the website on Blogger, we will add a custom theme on the website, will customize it from the top to bottom to make it look professional and to make it personalized for our use.
And, in the end – we will add a custom domain name to make our portfolio website complete.
So, let’s learn – How to Create a Portfolio Website – Step by Step:
1. How to Get Started on Blogger?
To get started – you need a Gmail account, which I believe you already have one.
Then – we have to visit Blogger.com, sign in with the email address which you have.
Creating websites using the Blogger platform is free.
Anyone can create as many websites as they need on Blogger.com without paying a single cent to host the websites!
But, in the beginning, we will have a very basic looking website after entering our website name, choosing the free Blogspot domain, and by choosing any of the available themes on the first page.
But, as there are thousands of advanced blogger templates are available, we will be able to make our website look beautiful, attractive and professional!
2. How to Add a Custom Template on Blogger Website?
As I have demonstrated the process – you can see the details from the video added above.
It’s really easy to upload a custom blogger theme into a website to give it a beautiful, professional look.
I have uploaded “Storm Blogger Theme” on our website, and you got the preview from the video already.
I have added the google drive link for you to download the theme on your computer.
After downloading – you have to extract the ZIP file which is containing the theme.
Then you have to upload the XML file of the beautiful theme into the Blogger website from Theme option of the backend. (please follow the steps shown in the video above)
3. Customize a Blogger Theme – Header Section
Here, you will learn – how to customize the header section of the portfolio website.
I have shown – how to replace the demo name, and how to remove the demo job titles and place your information instead into the website to make it personalized.
If you have watched the video above, you already have seen the changes.
And, did you notice – the titles are moving nicely?
Isn’t it looking fantastic!?
4. How to Add Clickable Social Media Links into the Website?
Throughout the video, I have demonstrated the process to add your Facebook, Twitter, Instagram, Linkedin profile links to your portfolio website.
It will help your clients find a little more information about you, your reputation, etc.
If you have watched the video above, you should have learned the process to change any social media icon, and how to link them with your profile URLs.
I would suggest you add the most relevant and active social media profiles to your website.
5. Add Custom Background Image
Having a custom background image in the header section of your website is going to make it attractive and meaningful.
I have shared information about a resource that you can use to get high-quality royalty-free images.
And, the process I have shown in the video is really easy to follow.
Make sure you’re choosing and uploading a meaningful background image into your website.
6. Customize the About Me Section
In this section, you will learn- how to change the default name with yours and how to edit the descriptive information along with address, phone number, and email info.
7. Edit My Skills Section of the Website
From the video above, you will learn – how to customize your professional skills information.
I have covered the way you can follow to change the skill name, progress bar, and percentage.
Please make sure – you are following all steps to keep it look clean and realistic.
8. Service Section Customization
The services section of a portfolio website is a must-have one. From this section – your potential clients will find the best idea about the services you can help them with.
So, please add all the skills you are good at and put the focus points in a brief way.
I have shown you the process by making changes in the first service point – the process you can follow to make changes on every icon and descriptions of the list.
9. Editing Social Media Profs
Having social media and experience proofs strengthen the probability of getting contacted by clients.
As we have got – completed project number, awards info, Facebook likes and running project numbers nicely appearing on the website, it is going to help your clients learn a little more about your actual real-life experience, your reputation, etc.
As you could watch the process – really easy to customize this section. So, please work on this too 🙂
10. Add Portfolio to our Website
Having portfolios added to your website is worth the time and effort.
Most of the clients will try to get some ideas about the works you have done previously to see if you are capable of doing the work for them as well.
From the video above – you will learn the process of adding portfolios to your website.
Please upload some relevant project examples as your portfolio.
11. Get a Quote Button
This is another important section of your portfolio website.
You will be able to add a call to action text and link the button to a specific page, where your clients will be able to reach you directly.
They could send you an inquiry regarding their projects, or maybe they are going to send you a message to learn pieces of required information from you.
Please work on this to make your portfolio website as a lead magnet!
12. Contact Form and Location Setup
Contact us form is another way someone could reach out to you with inquiries.
You can keep the form as it is, it’s pre-activated and will be automatically linked to your email.
Whenever anyone sends you a message through the form, you will receive it to your email, and you will be able to reply to the email directly from your inbox.
Update your location information as well with active phone numbers.
13. Add Custom Domain Name to Your Portfolio Website
Adding a custom domain name will make your portfolio website become more professional.
You can purchase a short, easily rememberable, meaningful domain name on Namecheap at a cheap price.
In the video above, I have shown the process to purchase a domain name to setting it up and assigning it with our blogger website.
Please watch the video with full attention and follow the steps to make it work correctly.
14. Change the Favicon Icon
Make a favicon image with less than 100kb file size. Upload it to your website from your blogger backend.
Now the website is loaded with all your information.
And, yes, if you have followed all the steps along – you have a beautiful personal portfolio website, which is going to present you and your professionalism in an attractive way.
So, that was the process of creating a portfolio website, and I believe you have found the blog post and the videos informative and helpful.
Please give likes on the videos as appreciation if you have found them helpful, let me know your opinion and question by commenting.