How to design a WordPress blog layout

Decide what visitors should see first: a featured post, a grid of recent posts, a simple list, or a combination. Keep the header, navigation, content area and footer consistent, then choose one main layout rather than mixing several competing styles.

If you want a separate home page and blog page, create both pages and assign them under Settings > Reading. The page selected as the Posts page displays your posts, but its page content and assigned page template may not control the post archive in the way you expect. WordPress uses the relevant theme template for that posts view.

With a block theme, go to Appearance > Editor. Use Templates for the home, archive, search and single-post layouts, and use Patterns for reusable headers, footers and other template parts. Use Styles to set site-wide colours, typography and spacing.

With a classic theme, go to Appearance > Customize and check the theme's layout, blog, homepage and typography controls. Classic themes differ widely, so a setting described in one theme's guide may not exist in yours. If the theme offers no archive layout controls, changing the layout may require a child theme or a different theme.

In the relevant home or archive template, select the Query Loop block or add one from the block inserter. Choose a pattern, or start blank and add the post elements you need, such as Featured Image, Post Title, Excerpt, Date, Categories and Pagination.

Select the Post Template inside the Query Loop, then switch between list and grid view. Set the number of columns, adjust spacing and remove elements that add clutter. Changes inside the Post Template repeat for every post, so edit the nested blocks rather than styling each article separately.

Give each post a consistent featured image with a similar subject, crop and aspect ratio. In the Query Loop, enable the Featured Image block's link to the post and make the Post Title a link so visitors can open the article from more than one place. Add excerpts instead of full post content when the layout is a grid or archive list.

A common break happens when some posts have no featured image: cards become different heights or leave empty spaces. Add featured images to older posts, or make the image block optional and design the card so it still works without one.

Use the Styles panel for the main font, text size, colours and site-wide spacing. Then adjust the individual Query Loop, Post Template, Featured Image, Title and Excerpt blocks for card gaps, image ratios, borders and alignment. Use List View when nested blocks are difficult to select.

Preview the layout at desktop, tablet and mobile widths before saving. Check that titles do not create awkward card heights, navigation remains usable, text has enough contrast and the grid collapses sensibly on narrow screens. Template and template-part changes can affect every page that uses them, so review the home page, archives and single posts after saving.

If you do not want to assemble templates and tune responsive spacing yourself, use a blog theme with finished layouts, then replace its demo content with your own posts and branding. Paper Plane is a suitable option when you want parallax sections plus grid and list layouts without building the design from scratch.

Install the theme from Appearance > Themes > Add New > Upload Theme, activate it, import or select a suitable demo if the theme provides that option, and then adjust the logo, colours, typography, menus and post settings. Keep a backup before switching themes: changing themes can alter templates, widgets, menus and image presentation, and a demo import can add pages or content you did not intend to publish.