Everything you Need to Build a Portfolio Website

Summary

This is the opening episode of an all-in-one, start-to-finish course for building a professional portfolio website with WordPress and Minimalio — aimed at complete beginners. It outlines what the rest of the series covers: getting a domain and hosting, installing the theme and plugins, working through WordPress’s basic settings and content structure, editing with the Gutenberg editor, and finally getting the site ready for Google.

Introduction

This all-in-one tutorial exists so that anyone, with no prior experience, can build a professional portfolio website — the kind of site well suited to showcasing photography, video, or any other creative work. For inspiration, or as a starting point, it’s worth browsing the available demos, or looking at customer showcase sites. Those who prefer a bolder look than the minimalist default can find the same step-by-step course built around a second, more bold-styled site.

Why WordPress

This course builds the website on WordPress — the cheapest and most widely used way to build a website, and also one of the most versatile: it’s estimated to power around 40% of the entire internet.

What This Series Covers

The series follows a clear path: first, getting a domain and hosting, since no website exists without those. Next, installing the theme and plugins. From there, working through WordPress’s basic settings and how content works. Then, editing content with the Gutenberg editor. And finally, getting the site set up to show up properly on Google.

A Note on the Theme

This course is built around Minimalio, which comes in a free version and an upgraded premium version. Everything covered in this tutorial works with the free version — the premium version isn’t required, it simply adds some extra features and, importantly, direct support: if anything goes wrong, you can reach out and get help by email.

Conclusion

With intentions and expectations clear, it’s time to get started.

Summary

This part of the series covers domains and hosting from scratch: what each actually is, the difference between WordPress.com and WordPress.org, walking through signing up for a hosting plan, choosing between the free, personal, and premium tiers, and the first security settings worth setting up once your site is live.

Introduction

Before getting into the how-to, it’s worth quickly explaining what a domain and hosting actually are.

How Domains Work

Registering a domain is simple — prices vary mainly by the ending you choose, like .com or .org, and honestly it doesn’t matter much these days which one you pick. There’s one rule worth taking seriously, though: once you register a domain, it becomes your property, tied to your own email address — never let anyone else buy or register a domain on your behalf. Always buy it yourself.

How Hosting Works

Hosting is just as simple in concept: it’s a service that rents you space on a large computer, called a server. When someone types your domain into their browser, they connect to that server, which sends your website back to them — that’s the basic mechanism behind how the internet works.

WordPress.com vs WordPress.org

Searching for WordPress turns up two different websites, WordPress.com and WordPress.org, which trips a lot of people up — but the distinction is simple. WordPress.org is home to the open-source system itself: that’s where the underlying code, themes, and plugins live. WordPress.com is the hosting side of things — a company that makes money by hosting that same free, open-source software for you.

Getting a Domain and a Hosting Plan

With that out of the way, it’s time to actually get a domain and hosting through WordPress.com. After creating an account with your email, you can select a domain — new signups even get one included free for the first year. If you already have a domain elsewhere, you can skip this and connect it later through DNS, which is a bit outside the scope of this tutorial (though any AI assistant can walk you through it if needed).

Choosing a Plan

The next decision is which plan to choose, and storage space is the main factor. The Personal plan includes 6GB, which is plenty for most sites — unless you’re uploading images straight from your camera without optimizing them first (worth reading up on image optimization separately). Properly optimized, 6GB can easily hold thousands of images.

The Personal plan’s real limitation is that it doesn’t allow uploading video files directly — you can still embed videos from Vimeo or YouTube, just not host video files on WordPress itself, which is a bit of a shame given Minimalio’s video hover features. Upgrading to Premium removes that restriction, and buying it for a full year or more makes it genuinely one of the best-value hosting options available. The free plan is also an option worth considering purely for testing things out, though it comes with ads inserted onto your site.

First Look at WordPress

Once payment goes through, you’ll land on a template selection screen — the specific choice here doesn’t matter much, since it’s just a starting point. From there, you’re in WordPress itself, the dashboard you’ll use to manage your website going forward.

Securing Your Account

In the upper corner, you can access your WordPress.com account settings. It’s worth filling in your name here, since it may appear as the author on your posts if you choose to display that. Far more importantly, set a properly, securely generated password under Security — this genuinely isn’t a Netflix account, so treat it accordingly — and it’s worth turning on two-step authentication as well. Websites get attacked constantly by people looking to exploit them for spam or worse, so this is worth taking seriously from day one.

The Site Dashboard

One more dashboard, also accessible from that same upper corner, is worth knowing about even though you’ll rarely need it: the site’s dashboard, listing all your websites and domains in one place. It’s also another way into the WordPress admin — reachable either from there, by adding /wp-admin after your domain, or by logging in directly at WordPress.com.

Conclusion

That covers getting a domain and hosting set up. Next, it’s time to get into WordPress itself.

Summary

This part of the series covers installing Minimalio and its premium plugin: what a theme actually is, how to install it, what the plugin adds on top, and a couple of settings worth adjusting right after setup.

Introduction

A WordPress theme defines the design and functionality of your website — there’s no WordPress site without one. This course uses Minimalio: search for it under Themes in WordPress, click Install, then Activate.

What the Theme Adds

Once Minimalio is installed and activated, it adds its own section to your WordPress menu. That includes an overview of the premium features, the available demos (which premium users can import directly), and a set of tutorials — mostly about Minimalio’s own settings, but also covering topics like SEO.

Like any theme, Minimalio adds its own settings, found in the Customizer. That’s where you adjust your site’s design and functionality — each section there has its own dedicated tutorial. A few of those sections stay locked until you activate the premium plugin.

What the Premium Plugin Adds

The premium plugin unlocks those extra Customizer sections, adds the portfolio content type, and introduces special Gutenberg blocks — most notably a more capable gallery block, and dedicated blocks for video, letting you build things like a homepage with a full-cover background video. Just as importantly, it connects your site directly to support, so you can reach out if anything goes wrong.

A Note on Plugins in General

Plugins, broadly, work like apps — they add functionality of pretty much any kind, and there are thousands of them. It’s worth taking this seriously, though: every plugin is extra code, and extra code means extra potential security vulnerabilities, plus extra processing weight that can slow your site down. A handful of plugins are genuinely necessary, but fewer is generally better. If you want to experiment with a plugin, it’s worth testing it somewhere other than your live website, and enabling automatic updates for whichever plugins you do keep.

Trying the Premium Plugin

The premium plugin is available as a trial, which is worth taking advantage of — it lets you import a demo and start with real content in place, making the whole system much easier to understand as you go. If you decide the premium features aren’t for you, the trial can simply be cancelled afterward.

To start a trial, sign up right from Minimalio’s page in your WordPress dashboard. You’ll get an email with a download link and a license key — install the plugin from that zip file (re-zipping it first if your computer automatically unzipped it), then activate it by pasting in your license key.

A Couple of Housekeeping Notes

Two smaller settings are worth checking after setup. If your hosting or plan bundles in extra plugins like Jetpack, check its gallery settings and switch off Jetpack’s own gallery options, since they can conflict with Minimalio’s. It’s also worth removing the default sharing options from your posts if you don’t need them.

Summary

This part of the series covers the basics of WordPress: its main menu, the different content types (pages, posts, and custom post types like portfolios), the media library, and the core settings that shape how your site behaves. It also walks through widgets, menus, and the Customizer, along with a few important security and SEO notes along the way.

Introduction

Welcome to WordPress. The main menu is where you’ll spend most of your time, and while some plugins may add extra items to it, the core structure stays the same. Generally speaking — though not strictly — the upper part of the menu covers your content, while the lower part covers your website’s various settings. It starts with the Dashboard, which isn’t particularly interesting on its own.

Content Types: Pages, Posts & Portfolios

Next comes your content. WordPress ships with two content types, pages and posts, and plugins can add further ones — portfolios being a common example. Each type is a little different: they display differently on your website and often come with their own settings. What they all share is a unique URL, so you can link to any of them through your menu or as a normal hyperlink — how you use that to structure your website is up to you. Typically, you’ll have standalone pages like an “About Me” or “Contact” page.

There’s also a special kind of page, sometimes called an archive page, that lists your posts or portfolios in a grid — this is the key difference between pages and posts: you create a page (often called “Blog” or “Portfolio”) specifically to display that list or grid.

Managing Your Content

Opening any content type shows you a list, and hovering over an entry reveals a few options — the least obvious of these is Quick Edit, which lets you adjust certain metadata without opening the full editor. Posts and portfolios also come with categories or tags, which are commonly used to filter them. Clicking into any item opens the main editor, Gutenberg — covered in more detail in its own tutorial.

Media Library

The Media section holds all your images, and potentially PDFs or videos. You can upload files directly here, or they’ll appear automatically once you add them while editing your content. Every file gets its own URL too, useful if you ever need to link directly to a PDF or image.

Images also have an alternative text field, where you should describe what’s shown in the image. This isn’t just for visitors using screen readers — Google also reads this text, so it’s worth filling in even if you don’t expect blind visitors, purely for the SEO benefit.

Comments

WordPress also includes a built-in commenting system. In practice, it’s rarely something people actually want turned on — comment sections tend to attract spam and ads far more than genuine discussion, so it’s generally best switched off, though the choice is ultimately yours.

General Settings

Moving into the settings section, General Settings covers your site title (shown in the browser tab), your site icon (shown there too), your admin email, the language WordPress uses, and how dates are displayed on your website. There’s nothing especially notable in the Writing settings beyond this.

Reading Settings

The Reading settings let you choose a specific page to use as your homepage — if you don’t set one, WordPress defaults to showing your latest posts instead. There’s also an important option here to hide your site from search engines while you’re still building it, so it doesn’t get indexed before it’s finished. Just remember to switch that back off once your site is ready to go live.

Discussion Settings

As mentioned, comments can be switched off entirely from the Discussion settings — the rest of the options there are largely irrelevant if you’ve done so.

Permalinks

Permalinks control how the URLs across your website are structured — a “post name” structure is generally the recommended choice. The Save button on this page is worth remembering too: it can fix a surprising number of issues, since simply clicking it refreshes your site’s URL structure. For example, after installing a plugin that adds a new content type like portfolios, coming here and clicking Save is often required to get things working correctly.

Tools: Import & Export

The Tools section mainly offers Import and Export. It’s worth being clear that Export is not a backup of your website — not in any real sense. It’s meant for moving content from one live website to another, with both sites online at the time.

Users

The Users section lists everyone with access to your WordPress site. For security reasons, the name that appears publicly — as the author of a blog post, for instance — should never match your login username, and “admin” in particular is an especially poor choice for a username, since it’s the first one attackers try. Make sure your public-facing name and your username are different, and that your username itself is something unique.

Roles matter too: assigning someone the Author role, for example, limits them to editing content only — they won’t be able to touch your site’s settings and accidentally break something.

Widgets

Widgets are where you edit content that lives within the settings areas of your site rather than a specific page or post — most commonly, content that repeats across your whole website, like a footer. You edit widgets the same way you edit any other content, and depending on which widget area you place them in, they’ll appear in that corresponding location on your site — adding your contact details to the footer widget area, for instance, puts that information at the bottom of every page and post.

Menus

WordPress handles menus by having you create one and then assign it to a specific location. After creating a menu, you add items to it by checking them in the list on the left and clicking “Add to Menu” — if something you’re looking for, like your portfolios, isn’t showing up, check the Screen Options at the top of the page and enable it there. Once your items are added, a drag-and-drop interface lets you reorder them, and dragging an item slightly to the right turns it into a submenu item.

As a quick example: create a menu, give it a name (this doesn’t really matter), assign it to the Primary Menu location, add the pages you want, and save — and that menu now appears in your header. For something like a link to your Instagram profile, use a Custom Link instead of a page.

The Customizer

WordPress also includes an option called Customize, which opens the Customizer — a space that duplicates several settings you’ve already seen, including the site title, menus, and widgets, editable there in largely the same way as in their dedicated settings pages. Which one you use is mostly a matter of preference. The Customizer’s Design section, however, only applies to what are called block themes, which isn’t the case here, so there’s nothing to configure there.

Conclusion

That covers the basics of WordPress. Thank you for listening, and if you have any issues, don’t hesitate to contact me.

Summary

This part of the series covers the default WordPress block editor, Gutenberg, which you’ll use to edit every page, post, and portfolio on your site. It walks through the editor’s toolbar and settings sidebar, how the block system and nested blocks work, the most useful blocks — especially columns — and how to recover your content using revisions if something goes wrong.

Introduction

Whenever you add a new page, post, or portfolio — or open one you’ve already created — you’re taken into the main editor, called Gutenberg. This part of the series starts with the interface itself: all the buttons in the system and what they do. From there, it covers how blocks work and goes into more detail on the most important ones, and finishes with what to do if something goes wrong, including how to back up your content.

It’s often called a block system for a reason — the main building blocks of every page are, well, blocks.

The Editor Toolbar

Starting from the left side of the toolbar: the first icon is your site’s favicon, which takes you back to your WordPress admin. Next is the plus icon, the block inserter, showing every block available to you — plugins can add more to this list. After that are the patterns: ready-made groups of blocks arranged in a particular way, so you can start from something instead of building entirely from scratch.

Next are the undo and redo arrows, which can be handy if you make a mistake. Then comes what’s called the List View — arguably the most useful part of the entire interface, and honestly one that deserves to be more visible, since the whole system is much harder to use without it. Opening it shows every block currently on the page, and from there you can move blocks around, duplicate them, delete them, or copy them — without it, adjusting your content becomes far more painful.

The Settings Sidebar

On the right side of the toolbar is another important button, which opens the settings sidebar. This sidebar is split into two tabs: one for the page, post, or whatever post type you’re editing, and one for the block you currently have selected.

The first tab holds your meta information — status, URL, template, and so on — along with categories and tags, which depend on the post type you’re editing. It also includes settings like the featured image, which matters far more for a blog post than for a typical page. Below that is the Publish (or Save, once already published) button, along with some extra preview options that are rarely needed.

The Block Canvas

The middle of the screen is the canvas itself, where your blocks live. It starts with the title field, which is naturally very important. The whole editor tries to resemble how your content will actually look on the live site, but it’s not a perfect one-to-one match — a common approach is to keep the page you’re editing open in one browser tab, and the live version open in another so you can compare as you go.

Understanding the Block System

The block system is hierarchical, meaning blocks can contain other blocks, which can themselves contain more blocks — this nesting can, in theory, go almost endlessly (not that you’d want it to). Opening the List View on an existing page makes this hierarchy easy to see: it lists every block currently in use, nested exactly as they appear on the page.

Editing Blocks: Toolbar & Sidebar Options

Every block can be adjusted from two different places, which can feel a little confusing at first but becomes intuitive quickly. The first is the floating toolbar that appears above a selected block, and its options change depending on which block you’re working with. For a heading block, for example, this toolbar lets you change what kind of block it is, move it up or down using the arrows or by dragging, adjust block and text alignment, change the heading level, and apply bold or italic formatting. You can also select text and turn it into a link — either pasting a URL or choosing an existing page — which then gives you an “edit link” option and the choice to open it in a new tab.

The second location is the settings sidebar on the right, and its options mirror many of the same settings found in the toolbar.

The Block Settings Panel

Within the settings sidebar’s block tab, you’ll typically find text color and background color, sizing and dimension controls — including padding and margin — and the ability to set a custom HTML anchor ID or CSS class, useful if you’re writing your own custom styles. These options update depending on which block is selected — clicking an image block, for instance, shows an entirely different set of settings.

Working with Columns

Of all the blocks available, columns are some of the most useful, since you’ll often want content arranged side by side. After dragging a Columns block onto the page, you first choose how many columns you want and what ratio they should use — starting with an even 50/50 split gives you two equal-width columns, and because they’re equal, no specific width needs to be set. Choosing an uneven split instead, like 33/66, sets an explicit width percentage for each column. The nice part is that you can freely add or remove columns afterward, and the existing ones will automatically adjust to keep an equal width between them.

Inside each column, clicking the plus icon lets you insert any block you like — a heading, an image, or anything else.

Vertical Alignment & Other Container Blocks

Columns also offer a vertical alignment option, letting you center the blocks inside a column vertically — a nice touch for mixed content like an image next to a shorter block of text. Beyond columns, several other blocks — group, row, and even grid — let you nest other blocks inside them in similar ways. The best approach is simply to experiment with each one and see what they can do; there’s no substitute for trial and error here.

Working with Text

When working with text content, it’s worth knowing the difference between pressing Enter and pressing Shift+Enter. Enter creates a brand new paragraph block, with visible space between it and the one before it. Shift+Enter instead moves to a new line within the same block, without adding that space. And if you decide midway through that a paragraph should actually be a heading (or vice versa), you can simply change the block type and switch back again later if needed.

Revisions and Backups

Finally, it’s worth knowing what to do if you make a mistake you can’t undo. As long as you’ve saved a page or post more than once, the settings sidebar includes a Revisions option. Clicking it opens a slider showing every previously saved version of that content — if something’s gone wrong, you can step back through that history and restore an earlier version at any point.

Summary

This part of the series covers planning your website’s structure — deciding what goes in your main menu using pages, posts, and portfolios, and choosing the simplest setup that fits what you’re trying to showcase, whether that’s written content, project pages, or a pure image gallery.

Introduction

With the basics of WordPress content covered, the next step is figuring out your website’s structure — essentially, what ends up in your main menu. It sounds simple, but even with a fairly straightforward system, there are quite a few options to choose from.

Content Types and Their URLs

Every content type — posts, pages, and, for premium users, portfolios — gets its own unique URL, meaning each can be linked to and used independently. Posts and portfolios also have categories, which likewise get their own unique URLs. To make the options concrete, it helps to create a bit of demo content first: a few posts and portfolios, each with a featured image, a category, and some content, plus a couple of standalone pages.

The Simplest Structure: Portfolio & Blog Pages

Less is almost always better, so the simplest way to structure a site is a page listing your portfolios, a page listing your posts, and perhaps an About or Contact page. To build the portfolio listing page, create a page (the name doesn’t matter — “Art,” for instance), and select the Portfolio template for it. You can still add your own content above the listing, like a short intro line, but choosing that template automatically adds the list of your portfolios below it, styled according to your theme settings, with category filtering available if you want it. The same approach applies to a blog page for posts. In the end, the only real difference between portfolios and posts is that portfolios come with their own set of styles and features designed to look more like a portfolio than a blog.

Using Categories Directly

Alternatively, you can link directly to a specific category, showing only the portfolios or posts within it. There’s one slightly hidden detail here: to add categories to your menu, you need to enable them first under Screen Options in the Menus screen.

A Text-Free Option: Galleries

For anyone mainly showcasing pictures or paintings, who doesn’t need much text — or any at all — a gallery is often the better fit. Add a gallery block to a page (the default one, or the more capable Minimalio gallery for premium users), and your images appear directly on the page. Clicking one opens it in a lightbox, letting visitors swipe through the set. The main difference from posts or portfolios is that individual gallery images don’t get their own unique URL — though with the Minimalio gallery, you can still add captions underneath each one.

Conclusion

That covers the main structural options available. For a deeper dive into every possibility — including creating pages around specific categories or using the portfolio block directly in the Gutenberg editor — a more detailed structure tutorial covers that in full.

Summary

This part of the series is a guided tour of Minimalio’s Customizer settings — not a deep dive into every option (each section has its own dedicated tutorial), but an overview of what each part of the Customizer actually controls, from site identity through to the mobile menu.

Introduction

With a basic understanding of how WordPress content works, the next step is design — and Minimalio handles this through the Customizer. Premium users can shortcut a lot of this by importing one of the available demos, replacing its content with their own in Gutenberg rather than starting from a blank page. This overview won’t cover every individual setting in each section — those have their own dedicated tutorials — but it’ll explain what each section generally does.

Site Identity

Before getting into Minimalio’s own options, it’s worth starting with Site Identity: this is where you upload your main logo, or adjust your site title’s size if you’d rather skip a logo. It also covers your site icon, and lets you add a separate logo just for mobile devices, if you’d like a different one there — otherwise there’s no need to touch that setting.

Theme Layout

The first Minimalio-specific section covers layout: mainly whether your website sits inside a container or stretches to fill the whole screen, primarily a concern on large monitors. Background settings live here too — a different color, or an image, for your site’s background.

Page Options

Page Options lets you set up an automatic page title that appears at the top of your pages, along with its size — archive pages, like category pages, get this automatically as well.

Typography

Typography covers your Google Font selection, along with colors, sizes, and other type-related settings across your site.

Header

The Header section controls the top area of your site — where your site title and main menu live. You can choose between different header styles, such as the classic horizontal layout or a vertical header, which fundamentally changes your site’s overall look, along with header colors and other related settings.

Footer

The Footer section covers the area at the bottom of your site: color settings, plus the option to add a copyright line beneath your footer widget area.

Blog Options

Blog Options controls the archive page for your posts — toggling category filtering, adjusting the card style, and more. At the bottom of this section are settings for single posts, controlling things like automatically showing the title, metadata, and a “latest posts” list.

Portfolio Settings (Premium)

From here on, the settings are only available to premium users. Portfolio Settings work much like Blog Options, just with styling built to look like a portfolio rather than a blog — plus some genuinely fun hover options, like an image or video that appears when a visitor hovers over a portfolio item.

Social Media

The Social Media section lists a wide range of social networks you can link to, adding their icons to your header and footer.

Lightbox

Lightbox controls what happens when a visitor clicks an image inside a gallery you’ve built in the Gutenberg editor — it opens up in an overlay. From here, you can adjust its colors and icon style, and turn on captions, letting you show a line of text underneath each image.

Mobile Menu

The last section is the mobile menu, covering things like the screen width at which it takes over from the regular menu, its colors, font sizes, and more.

Conclusion

That covers what each part of Minimalio’s theme settings generally does. If anything’s unclear, or there’s something you’re trying to do that the settings don’t seem to allow, don’t hesitate to reach out — there’s likely a solution.

Summary

This part of the series covers keeping your site secure and backed up — what a managed hosting plan already takes care of for you, what to still be careful about (mainly plugins), and how to set up a free backup using UpdraftPlus.

Introduction

Since WordPress is the largest website platform in the world, it’s also the most frequently attacked. As with any hack, it’s rarely personal — attackers are usually just looking for any website they can use to send spam or promote questionable content. The good news is that a good managed hosting plan already comes with a genuinely secure setup out of the box: beyond using a secure password, there’s not much else required. (If you’re following this course on different hosting, a separate security and backup tutorial covers that setup in more detail.)

Being Careful with Plugins

The one thing still worth being careful about is plugins — never install one from a random, unofficial website, since they very often contain malware. If you’re unsure whether a plugin does what you need, it’s worth spinning up a second, free-plan site to use purely as a testing playground, installing whatever you like there, and only adding something to your actual live site once you’re certain you need it. This is worth doing anyway, since plugins also slow your website down — testing on your live domain is rarely a good idea.

Setting Up a Backup

A disaster can happen no matter what precautions you take, so having a backup is essential. Since backup functionality is normally reserved for more expensive hosting plans, this course uses UpdraftPlus instead, which lets you connect to Google Drive or another storage provider and back up for free. You’ll hopefully never need it, but it takes only a minute to set up and could save you days of pain later.

Install and activate UpdraftPlus from Plugins → Add Plugin, then open its settings, where a welcome screen appears — click Start, leave it on manual, then Save and Continue. Choose your backup destination (a cloud storage option like Google Drive is ideal), skip past any promotional screens, and click Backup Now to create your first backup. Make a habit of backing up again whenever you make significant changes you wouldn’t want to lose.

Conclusion

Your hosting provider’s support may also be able to help if disaster strikes, but it’s not something to rely on as your only safety net — your own backup is what actually guarantees you’ll never lose your site.

Summary

The closing part of the series covers what’s left after your website is built: making it public and visible to Google, controlling how it appears in search results and when shared on social media, and optimizing your images so they don’t weigh your site down.

Introduction

With the website itself built, a few final things are worth knowing before wrapping up.

Making Your Site Public

By default, a new website isn’t public until you launch it — you can do that with the launch button, or by changing your site’s visibility directly from the site dashboard. Making it public also means unchecking the option to discourage search engines, assuming you actually want your site to show up on Google. Third-party sharing is a personal call, and doesn’t affect the site itself either way.

Controlling Your Google Listing

A separate tutorial covers using RankMath, a plugin that gives you control over exactly what appears when your website shows up in Google search results, as well as which image gets used when your site is shared on social media — worth checking out once your site is ready to go live.

Optimizing Your Images

Since hosting plans come with limited storage and bandwidth, it’s worth avoiding uploads like 50-megabyte images. Optimizing images before uploading them is strongly recommended, though several plugins can also handle this automatically — a separate article covers this topic in more detail.

Conclusion

That wraps up the series. Good luck with your website, and don’t hesitate to reach out if you run into any issues along the way.