Lesson 5: Customizing WordPress for your portfolio

Complete lesson on customizing and designing your WordPress portfolio. 

In this lesson, I’ll cover how to really customize your portfolio so that it looks great, is easy to navigate, and will set you up for success as your blog grows. Let’s dig in!

Customizing your site identity and using the WordPress Customizer

When using the Customizer in WordPress, different themes will display different options. I’ll cover the ones that are common across all WordPress sites. This includes Site Identity, where you can add your site’s logo and name.

When you’ve logged in to your site, you’ll be able to access the WordPress dashboard. Some people might call this the back end, or the control panel, but the correct terminology is the WordPress dashboard. This is different from your hosting dashboard, which controls your hosting settings.

When you’re logged in, you’ll see a toolbar appear at the top of your website. This is only visible to you, as the admin and to any user who is logged into your site. Your visitors won’t see this. You can use it to toggle between your site’s “front end” and dashboard.

Customizing your Site Identity

You can launch the Customizer by going to Appearance > Customize. When using the Customizer in WordPress, different themes will display different options. I’ll cover the ones that are common across all WordPress sites. This includes Site Identity, where you can add your site’s logo and name.

Your Site Identity will display site info in search results and in your browser tab, as well as on the site itself. The Site Identity displays across the entire site, unless you choose to hide it completely.

Your Site Identity is made up of 4 elements:

  • Title
  • Tagline
  • Logo
  • Site icon (the small icon that appears in your browser tab)

You don’t need a logo necessarily, since your site title in the font of your choice can act as your logo. Whether you use a logo or just your site title text, this will be clickable and act as a ‘return to home’ link.

Customizing your Menus

Different themes will have different menu areas, which means the different places on your site where you can add clickable site navigation. The Customizer is an easy place to build a new menu and add links, and see in real-time how they look on your site. You can also build menus and not assign them to a menu area at all. This will save your custom menu on the backend and allow you to later use them as a widget in widget areas on your site.

Some themes have a dedicated menu location called Social Menu. I recommend only using this for links to your social media profiles. This menu area is most often designed to display social icons when the appropriate Facebook, LinkedIn or Twitter profile link is added as a custom link.

Adding and removing Widgets

The Customizer is also where you can view and edit your widgets with a live preview. Widget areas are theme-dependant. Most often, widget areas include the sidebar of your site or the footer. Some widgets are standard across all WordPress sites, some themes add widgets to the options, and plugins can also expand your widget selection on your site, although your widget areas are controlled by your theme.

Content Options

Content options is a section of the Customizer that appears for certain themes only. Don’t worry if your selected theme doesn’t include this. It’s simply a place to add more features like controlling whether you show the author name, tags, categories and other blog post metadata.

Static homepage vs your latest posts

There are two main ways to set up your homepage in WordPress: to have one page designated as your homepage and displayed at your home URL, or, a page that pulls in your blog posts in a style dictated by your theme. If you run a blog, the option of displaying your blog posts on your homepage is the best way to put your content front and center.

If you are building a website, it’s best to choose a static page and design that page to look exactly how you want. With the WordPress Editor, you can still pull in your latest posts and display them on your static page. This is my recommendation if you have a website that also has a blog section. In the case of a portfolio, I would recommend the Static homepage as well.

When you set your homepage to be a static page, you need to choose which page or create a new one. If you also plan to create blog posts, then you should create a new page called Blog (or Posts, or News, whatever works best for you) and mark that as your Posts Page. If you add that page to your menu, that’s how people will access your latest blog posts.

Note that this setting isn’t permanent. You can change your mind at any point!

Creating your homepage using the Block Editor

Using the Block Editor to build a homepage

Now that you’ve created a page called Home and set it as your WordPress homepage, you can start editing it! You can access the editing view of any page by clicking on Edit Page on the top toolbar when viewing the page or by going to Pages and clicking on Edit below the name of that page.

Once you’re in the page, you’ll notice the right-hand toolbar. Under the ⚙️ gear icon, you’ll see Page and Block. Page controls the settings for the whole page, such as the visibility, author, publication date, URL, featured image, and whether or not you allow comments on that page.

You can also nest a page under another page, making it the Parent Page. If you have a hierarchy of content on your site, this can help organize it better. For example, you could have a page called Courses, and nest the pages: Yoga, Barre, and Prenatal under the Courses Parent page.

The Block tab under the gear icon controls individual blocks. When you add a block to the editor, these settings show up and allow you to make changes to the appearance of each block.

Here is a helpful guide on using the Block Editor. Note the guide is from WordPress.com, but the block instructions work for your WordPress instance as well.

There are many blocks that are available out of the box, but adding Plugins to your site can also add additional blocks to use on your site. In Lesson 6, we’ll add Plugins and you’ll see how they add even more blocks and widgets to use on your site. Patterns, which you can see when viewing all Blocks, are a grouping of blocks that are pre-designed. Reusable blocks are groupings or preset blocks that you’ve designed and saved yourself. Note that when you make a reusable block, anytime to edit it, it updates across all the places it’s used.

Adding pages, a blog, and setting a menu

Without content, your website looks empty. In this video, I add pages, a blog, and show you how to display and organize all your content for your website visitor. It’s totally normal if you have to watch this video a few times while imitating the steps. You can even slow down the video’s playback settings so you don’t miss any detail.

Adding a menu

Menu areas are theme-specific, meaning that where your menu appears can vary. But you can create cool menus that serve your needs with any theme! You can control your menus in two places: Appearance > Menu, or click on Live Preview to access the Customizer, where you can see your menu changes in preview mode.

menu

Notice how you can edit menus, create menus, and manage locations all in this screen. The steps to creating a new menu are:

  • Create a menu and give it a name.
  • Add items. You can add Pages, Posts, custom links, or a link to a specific category or tag used in posts. You can scroll through your content or search it.
  • Organize your menu. Notice how some menu items are indented? You can drag, drop, and indent menu items so they become drop-down menus.
  • Set a location. Choose where this menu will appear. You can choose more than one location if you want to have it both in the header and footer for example. However, I recommend creating a slightly more condensed menu in your footer or to link to another set of links to make certain quick links (Contact, Privacy Policy, or FAQ, for example) easier to find.

Adding a blog

Adding a blog to your website is a great way to display content that is timely. Even if you don’t plan on blogging frequently, I recommend using the blog feature to add a news section to your website or to share updates from time to time. This is also great for Search Engine Optimization, since Google likes it when your website has fresh content regularly.

Managing a blog

Whether you plan on posting a lot or once in a while, you can already start thinking up your main categories. If you run a business website, you might have categories about products, or feature releases, corporate news, or upcoming events! You should only have a handful of categories in total and assign 1-3 for a blog post.

Tags can be more niche and numerous and don’t have to be consistent across your blog posts. Both of these metadata items can help you organize your content into sections, and even be used in your menus to create easier navigation. For that reason, I recommend putting some thought into it from the start.

And those are the fundamentals! In the next lesson, we’ll talk about adding even more features to your website through plugins. Once we’ve activated the Jetpack plugin, we’ll also add portfolio projects using the Portfolio custom post type.