How to create an architecture portfolio website

List the pages you need before choosing a design: Home, Projects, About, Services and Contact. Give each project its own page if visitors need to see drawings, photographs, plans, materials, location and your role in the work.

Keep the top navigation short. A visitor should be able to reach the project index, your introduction and your contact details without searching through a large menu.

Choose a small set of strong images for each project rather than uploading every available photograph. Give files useful names, add descriptive alternative text in the Media Library and use captions where they provide context. WordPress supports alternative text and different image resolutions in its image controls.

Resize and compress large renders before uploading them. Oversized images are a common cause of slow portfolio pages, especially on mobile, and can make an otherwise good layout feel broken.

Go to Pages > Add New and create your Home, Projects, About and Contact pages. Use the block editor to add headings, text, buttons, columns, images and galleries. WordPress pages are intended for lasting site content and can be added to site navigation after they are published.

On the homepage, lead with one strong project image, a short description of your practice and a clear link to all projects. Avoid filling the first screen with several sliders, long paragraphs or tiny thumbnails.

For a small portfolio, create a Projects page with a grid of Image, Gallery or Columns blocks. Link each image or project title to its individual project page, then repeat the same structure for every project. This route needs no portfolio plugin and gives you full control over the order and presentation.

The drawback is maintenance: adding a project means editing the index page as well as creating the project page. If you want a filterable, automatically updated grid, use project posts or a custom post type with a portfolio-capable builder instead. Elementor’s Portfolio widget can display posts, pages and custom post types, but it does not display galleries directly.

Set the Home page as the static front page in your reading settings, then add the key pages to your navigation. With a block theme, use Appearance > Editor to edit the site’s styles, navigation, templates and template parts. Changes to a header or footer template can affect every page that uses it, so check the whole site before saving.

Choose a readable project URL structure under Settings > Permalinks before publishing many projects. Use short slugs such as /projects/courtyard-house/ and avoid changing them later unless you set redirects.

If you do not want to assemble the layout from core blocks, use Ruizarch – Architecture and Building WordPress Theme. It is designed around architecture and construction portfolios, includes project-focused layouts and works with Elementor, so you can install the theme, activate it and adapt its starter layouts instead of designing every section from an empty page.

Install the theme ZIP through Appearance > Themes > Add New > Upload Theme, activate it, then install and activate Elementor if the theme requires it. Elementor pages are built by adding sections or containers and placing widgets on the canvas.

Replace demo content before launch, check every project link and test the portfolio on a phone. A pre-built theme saves layout time, but it does not choose your best work, write project descriptions or optimise oversized images for you.