Updated: May 15, 2023 By: Dessign Team
Using the default Twenty Twenty-Three WordPress Gutenberg theme, you can easily create a simple and professional WordPress portfolio website.
With NoPlugins, NoCode, and NoPageBuilders just the plain WordPress CMS and Gutenberg page builder, anyone can create a simple and clean website. There are many free Gutenberg WordPress themes if you like a different design.
In this YouTube video tutorial, I go over the basic of Gutenberg layout using mostly Featured Text, Query Loop block, Cover Block, and just simple Column block to create a fully responsive designer theme that can be used for any kind of portfolio website with blog and portfolio category.
SiteGround Best Managed WordPress Hosting at 80% OFF – Limited Time Offer
Free Designer WordPress theme is for a self-hosted website if you looking for the best WordPress hosting provider we recommend SiteGround as we are partners and recommend SiteGround to our friends and customers. If you looking to purchase or switch your hosting provider for the best and most secure WordPress hosting.
Download the FREE version of Designer Theme
I promise you can download the free version of Designer theme with the XML demo content so you can easily upload it on your website and then follow the YouTube video to better help you understand how Gutenberg thee works.
You are free to use the Designer theme as you like and customize it to your needs, I also show a few layout settings where you can change the layout just with a few clicks and add a cover block to change the homepage. You can freely use the theme for personal and commercial purposes and all the images on the demo content are from Unsplash License website with copyright-free commercial and noncommercial purposes.
Free Designer Gutenberg WordPress Theme Screenshots Overview Tutorial
Gutenberg Tutorial Video How to Setup and Use the Designer Theme
WP Engine Best Fully Managed WordPress Hosting –
4 Months FREE Limited Time Offer
WP Engine is by many experts considered the best in WordPress Managed Hosting, they offer automatic security updates, daily backups, one-click restore points, automatic caching, top-tier security, FREE CDN & SSL Plus FREE Site Migration.
1. Homepage – Layout
For the designer theme homepage we are using the Query loop block which displays category posts with featured images, post titles, and posts excerpts displayed it in a grid-based layout.
- 1. Click on the 3-line icon
- 2. Click on the Query Loop
- On the right Settings – 3 Columns
- Categories add: Media, Portfolio, and/or Design
2. Category/Portfolio – Layout
For portfolio/ category pages I also used the Query loop to display the grid-based layout, but I removed the post excerpt so only the featured images and post titles are there. If you click under the templates and Archive – click Edit the section you can adjust the number of columns and adjust the size and dimensions of the images and size of the typography with the settings option.
Once you are inside the editor click on the their small lines button to open the left navigation, then click on the Query Loop – to show the settings on the right. Now you can change the columns setting from 3 to any number you like, you can make the content any size or width you like.
3. Blog Page – Layout
For the Blog (Alternative) page one you inside the templates look for the Blog (Alternative) select and Edit the template. This is the custom design I also used the Query Loop but all the categories as selected under “blog” so only the posts that are in category blow will show on this page.
The layout is unique as I put the date on the left, the post title on the top right, with the featured image under the title, and then the post excerpt on the right with a read more custom button under the post excerpt for a simple but unique layout.
Once you inside the settings area once again click on the three lines icon and inside look for the Query Loop, once you click on it you will get the right setting area where you can make your customizations, as I show in the setup video you can remove any part of the layout, if you don't like the read more button just click on it and remove it, if you want to make the feature images bigger just click on one and use the width size to resize it or change the typography fonts.
4. Change the Styles of Designer Theme
If for some reason you don't like the dark theme style, you can easily pick from other varieties and even change the colors and typography for an overall look. Once you click on the Browse styles, just select any style and one you like save it, and then customize it to your desire or needs.
As mentioned before you can use the Designer Gutenberg-based WordPress theme for personal or commercial use and make any changes and modifications you desire. All images are free to use and modified to your need.