{"id":749,"date":"2022-10-11T11:11:51","date_gmt":"2022-10-11T11:11:51","guid":{"rendered":"https:\/\/blog.hostinger.io\/support\/2022\/10\/11\/6632501-hostinger-website-builder-how-to-create-a-portfolio-website\/"},"modified":"2026-03-16T12:12:04","modified_gmt":"2026-03-16T12:12:04","slug":"6632501-hostinger-website-builder-how-to-create-a-portfolio-website","status":"publish","type":"post","link":"https:\/\/www.hostinger.com\/support\/6632501-hostinger-website-builder-how-to-create-a-portfolio-website\/","title":{"rendered":"Hostinger Website Builder: How to Create a Portfolio Website"},"content":{"rendered":"<p class=\"no-margin\">In this article, you&rsquo;ll learn the basics of building a portfolio website using <b>Hostinger Website Builder <\/b>&#128071; <\/p><p class=\"no-margin\">\n<\/p><h2 id=\"h_dedb66cf0a\">Step 1 &mdash; Decide on the Structure of Your Portfolio<\/h2><p class=\"no-margin\">Basically, a website consists of pages that consist of sections that include specific elements:<\/p><p class=\"no-margin\">\n<\/p><div class=\"intercom-container intercom-align-center\"><img decoding=\"async\" src=\"https:\/\/blog.hostinger.io\/pt\/support\/wp-content\/uploads\/sites\/59\/2022\/12\/56a36ce8-a675-4489-bf41-1e3775dcd97e.jpg\"><\/div><p class=\"no-margin\">\n<\/p><p class=\"no-margin\">Portfolios usually have at least three key pages:<\/p><ol>\n<li>\n<p class=\"no-margin\"><b>Projects<\/b> to showcase your work<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\"><b>About<\/b> to tell your story<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\"><b>Contacts<\/b> to let people easily reach you<\/p>\n<\/li>\n<\/ol><p class=\"no-margin\">Besides those mentioned above, you can also <b><a href=\"\/support\/6456705-website-builder-how-to-add-more-pages\" target=\"_blank\" class=\"intercom-content-link\">add more pages<\/a> <\/b>to your website, for example, a<b> <a href=\"\/support\/6462842-website-builder-how-to-create-a-blog\" target=\"_blank\" class=\"intercom-content-link\">blog<\/a><\/b> to write about your insights or experiences. <\/p><p class=\"no-margin\">\n<\/p><p class=\"no-margin\">Once you&rsquo;ve selected a website template for your portfolio, check the following:<\/p><ul>\n<li>\n<p class=\"no-margin\">How many <b>pages<\/b> are in the website template? Would you like to add, remove, or hide any pages? To learn more, refer here: <b><a href=\"\/support\/6435707-website-builder-how-to-manage-the-navigation-menu-of-a-website\" target=\"_blank\" class=\"intercom-content-link\">How to manage the navigation menu of a website<\/a><\/b><\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">What <b>sections<\/b> do the pages consist of? Would you like to add or remove any sections? To learn more, refer here:<b> <a href=\"\/support\/6475040-website-builder-how-to-add-and-manage-website-sections\" target=\"_blank\" class=\"intercom-content-link\">How to add and manage sections<\/a><\/b><\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">What website <b>elements<\/b> are there? Would you like to add, remove, or edit any elements? To learn more, refer here: <b><a href=\"\/support\/6435894-website-builder-how-to-add-and-customize-website-elements\" target=\"_blank\" class=\"intercom-content-link\">How to add and customize elements<\/a><\/b><\/p>\n<\/li>\n<\/ul><p class=\"no-margin\">\n<\/p><h2 id=\"h_8afaf1b7fd\">Step 2 &mdash; Customize Your Website<\/h2><p class=\"no-margin\">Once you&rsquo;ve decided on your website&rsquo;s structure, focus on perfecting the main pages of your portfolio.<\/p><p class=\"no-margin\">\n<\/p><h3 id=\"h_9dfdb49668\">Portfolio Page<\/h3><p class=\"no-margin\">Presentation of your projects is the core of your portfolio. Depending on how much work and examples you want to share, you may:<\/p><ul>\n<li>\n<p class=\"no-margin\">Show all your work on a single page:<\/p>\n<div class=\"intercom-container intercom-align-center\"><img decoding=\"async\" src=\"https:\/\/blog.hostinger.io\/pt\/support\/wp-content\/uploads\/sites\/59\/2022\/12\/af572065-1af0-4660-9236-fff2270770a3.jpg\"><\/div>\n<\/li>\n<li>\n<p class=\"no-margin\">Show individual projects on dedicated pages:<\/p>\n<div class=\"intercom-container intercom-align-center\"><img decoding=\"async\" src=\"https:\/\/blog.hostinger.io\/pt\/support\/wp-content\/uploads\/sites\/59\/2022\/12\/7f14ec51-f141-46a9-affa-eabf0dade398.jpg\"><\/div>\n<\/li>\n<li>\n<p class=\"no-margin\">Show individual projects on dedicated pages and then put all those pages in a <b><a href=\"\/support\/6456916-website-builder-how-to-add-a-dropdown-menu\" target=\"_blank\" class=\"intercom-content-link\">dropdown menu<\/a><\/b>:<\/p>\n<div class=\"intercom-container intercom-align-center\"><img decoding=\"async\" src=\"https:\/\/blog.hostinger.io\/pt\/support\/wp-content\/uploads\/sites\/59\/2022\/12\/500a7a7b-ad6d-4652-9299-9e4d4d0cd23a.jpg\"><\/div>\n<\/li>\n<\/ul><p class=\"no-margin\">\n<\/p><h3 id=\"h_0732dd3fb9\">About Page<\/h3><p class=\"no-margin\">The About page is your short bio. To keep the information neat, you may introduce yourself by splitting it into sections, for example:<\/p><ol>\n<li>\n<p class=\"no-margin\">Add a text section and write a paragraph or two about who or what you are<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">Insert a section for images, gallery, or Instagram feed, and show some visuals of yourself or your work<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">Share an inspirational quote or a list of your favorite readings, music, or destinations<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">Add links to your <b><a href=\"\/support\/6474611-website-builder-how-to-add-social-media-icons\" target=\"_blank\" class=\"intercom-content-link\">social media<\/a> <\/b>profiles<br>&#8203;<\/p>\n<\/li>\n<\/ol><h3 id=\"h_cbf1707791\">Contact Page<\/h3><p class=\"no-margin\">Keep the contact page short and sweet since its purpose is only to be informative. You can add such elements as:<\/p><ul>\n<li>\n<p class=\"no-margin\"><b><a href=\"\/support\/6463265-website-builder-how-to-add-and-manage-contact-forms\" target=\"_blank\" class=\"intercom-content-link\">A contact form<\/a><\/b><\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">Your email address<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">Your phone number<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\">Links to your <b><a href=\"\/support\/6474611-website-builder-how-to-add-social-media-icons\" target=\"_blank\" class=\"intercom-content-link\">social media<\/a> <\/b>profiles<\/p>\n<\/li>\n<\/ul><p class=\"no-margin\">\n<\/p><h2 id=\"h_0398baab26\">Step 3 &mdash; Check the Website Settings<\/h2><p class=\"no-margin\">Remember to update your website settings:<\/p><ul>\n<li>\n<p class=\"no-margin\"><b><a href=\"\/support\/6521387-website-builder-general-website-settings\" target=\"_blank\" class=\"intercom-content-link\">General<\/a><\/b>: here, you can add a website preview link and a favicon, as well as enable a cookie banner<\/p>\n<\/li>\n<li>\n<p class=\"no-margin\"><b><a href=\"\/support\/6466320-website-builder-seo-settings\" target=\"_blank\" class=\"intercom-content-link\">SEO<\/a><\/b>: update meta titles and descriptions of your pages, and add alt text to your images; to make your website easy to find in search engines, follow these guidelines: <b><a href=\"\/support\/6448761-website-builder-how-to-make-my-website-appear-on-google\" target=\"_blank\" class=\"intercom-content-link\">How to Make a Website Appear on Google<\/a><\/b><\/p>\n<\/li>\n<\/ul><p class=\"no-margin\">\n<\/p><p class=\"no-margin\">As more than 50% of traffic comes from mobile devices, check the <b><a href=\"\/support\/6475658-website-builder-how-to-edit-the-mobile-version-of-a-website\" target=\"_blank\" class=\"intercom-content-link\">mobile version<\/a><\/b> of your website.<\/p><p class=\"no-margin\">\n<\/p><h2 id=\"h-step-4-publish-your-website\">Step 4 &mdash; Publish Your Website<\/h2><p class=\"no-margin\">Once your portfolio is ready, <b><a href=\"\/support\/6475340-website-builder-how-to-publish-a-website\" target=\"_blank\" class=\"intercom-content-link\">publish it<\/a><\/b> and get ready for online success &ndash; to let the world know about your portfolio, share links to your website on various social media platforms!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Learn how to create a portfolio using Hostinger Website Builder<\/p>\n","protected":false},"author":581,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"include_on_kodee":true,"footnotes":""},"categories":[277],"tags":[],"class_list":["post-749","post","type-post","status-publish","format-standard","hentry","category-general-website-builder"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/support\/6632501-hostinger-website-builder-how-to-create-a-portfolio-website\/","default":1},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/support\/6632501-hostinger-creador-de-sitios-web-como-crear-un-sitio-web-de-portafolio\/","default":0},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/support\/6632501-hostinger-createur-de-site-web-comment-creer-un-site-web-de-portefeuille\/","default":0},{"locale":"lt-LT","link":"https:\/\/www.hostinger.com\/lt\/support\/6632501-hostinger-svetainiu-kurimo-irankis-kaip-sukurti-portfolio\/","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/br\/support\/6632501-hostinger-criador-de-sites-como-criar-um-site-portfolio\/","default":0}],"include_on_kodee":true,"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/749","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/users\/581"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/comments?post=749"}],"version-history":[{"count":1,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/749\/revisions"}],"predecessor-version":[{"id":3188,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/749\/revisions\/3188"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/media?parent=749"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/categories?post=749"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/tags?post=749"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}