How to create an architecture portfolio website

Prepare the content before opening WordPress. A useful structure is Home, Projects, About, Services and Contact. Give each project its own page if you want to show drawings, plans, photographs and project notes in detail.

Choose one strong cover image for every project and keep image proportions consistent where possible. Sort each project’s files into a small set of finished images before uploading them; a portfolio becomes difficult to browse when every construction photograph is included.

For the manual route, use a block theme or another theme whose typography, content width and header can be changed without editing theme files. Set your site title, logo, colours, typefaces and header from the theme’s available settings. WordPress themes control the common appearance of pages, while the block editor supplies the page content.

This route is genuinely fine for a small portfolio, but it has limits. You may need to build every project layout yourself, and a basic theme may not provide project filters, masonry grids, hover effects or a suitable lightbox. Do not edit the parent theme’s files for styling changes, because an update can remove them.

Go to Pages > Add New and create the pages from your planned structure. Use headings, short paragraphs, buttons and image blocks rather than putting the whole site on one very long page. Add a featured image to project pages if your theme uses featured images in project listings.

Create a page called Home, publish it, then go to Settings > Reading and choose it as the static homepage. If you want a blog, create an empty Blog page and select it as the posts page. The common Friday problem is forgetting this setting: visitors then see the latest blog posts instead of your portfolio landing page.

Start a project page with the project name, location, completion date and a one- or two-sentence summary. Follow it with the strongest exterior or interior image, then add sections for the brief, concept, materials, plans, drawings and completed work. Keep captions specific so visitors know what they are looking at.

Insert a Gallery block for groups of images. Set the number of columns, choose an appropriate image resolution, decide whether images should be cropped, and enable Enlarge on click if visitors need to inspect details. WordPress supports captions, reordering and several gallery link behaviours from the block settings.

Add Home, Projects, About and Contact to the site navigation. Depending on your theme, navigation is managed through the Site Editor, Customizer or the menu screen. Keep the top-level menu short and place less important links in the footer. WordPress supports adding published pages and custom links to navigation menus.

Preview every project page on a phone. Check that galleries use sensible column counts, captions are readable and images can be enlarged. Large original files can make a mobile gallery slow, while inconsistent image ratios can create awkward rows; the Gallery block includes resolution, crop and aspect-ratio controls to help manage this.

If you want the faster route, use Maiko as the starting point instead of assembling every layout manually. It is designed for architecture and interior design portfolios and includes architecture-oriented layouts, gallery styles, responsive design and support for page builders such as Elementor and WPBakery.

After installing and activating it, import a suitable demo if available, replace the sample projects with your own pages and images, then check the homepage, navigation and mobile layouts before publishing. This route saves layout work, but you still need to edit the content, optimise images and verify that the imported design matches your brand.