How to Build a Custom Category Page in

GenerateBlocks
Last Updated

22nd September 2022

 Overview
Description
This document will go through the process of setting up a custom category page instead of the
default category page provided by WordPress.

While this document contains a very brief outline of the actual design, each website will have a
different design language which should be considered while building the page.

Execution Time
30 Minutes

When To Run This Process

When creating a new category page

Outcome
A custom category page

Tools & Services

N/A
 Process
This process will be broken down into two sections:

1. Building the Custom Category Page

2. Implementing the Custom Category Page

1. Building the Custom Category Page

Note that every site will have a different design philosophy; this document is intended as a
guide, but this should only be used to understand what needs to be put into a custom category
page.

There are two ways to edit the Category page, depending on the website's link structure.

Hard Silo
If the website uses Hard Silos and the URL structure looks like this:
authorityhacker.com/topic/articlet-title

Locate authorityhacker.com/topic/ and edit that page directly to get started.

Soft Silo
If the website uses soft silos and the URL structure looks like this:
authorityhacker.com/article1
authorityhacker.com/article2

Begin by going into the WordPress dashboard and selecting Pages > Add New

For Soft Silos, please ensure that step 2 of this SOP is followed to finish setting up a custom
category page.

Chose The Featured Subcategories

Begin by selecting the top pages for each category. For example, if the Category page was Best
Paintball Clothing, the top subcategories could be:
● Best Paintball Pants
● Best Paintball Vests
● Best Paintball Gloves

Aim to include a maximum of 4 subcategories on the main category page.

If possible, identify the categories which are a high priority for the website, i.e., they make more
money or are popular with readers.

Once identified, begin building the Category Page.

Blurb
Start the page with a short blurb about what the category is for. Ensure that the keyword of the
page is included in this blurb

Example
On this page, you'll find a roundup of the best paintball gear to help you stay protected
and have fun!

Featured Navigation
Next, begin building the featured navigation part of the page.

First, insert a Container block, and inside that container, insert a 2-column Grid block.

On the left-hand Grid block, add a Headline block, adjust the size to H3 and enter the featured
category title as decided in the above process.

Underneath the Headline, enter another Heading block and set it to Paragraph. Then, enter a
short blurb explaining what this subcategory is about
Add an additional line of text that says “Learn More…” underneath the blurb. Link this text to
either the subcategory or a full article on the topic.

Next, on the right-hand grid block, add a Heading block, set it to H4, Center align it, and add the
text Our Top Pick. Set the color of this text to the website’s primary color.

Underneath that, add an image of the top product from that category. If the main affiliate
program of the site offers a Hotlinked Image HTML Code (e.g., Amazon Associates), enter an
HTML block.

If they do not provide HTML Hotlinked images, simply insert an Image block and upload an
image of the product.

Resize the image so that the vertical height is no larger than the blurb.
Underneath the image, add another Headline block, set it to Paragraph, Centered, and bold,
then write the product name. Add an affiliate link to the product name text.

Underneath the product title, add a Button block, center it, add the text Buy Now and add an
affiliate link to the product.

Select the right-hand grid block, and set the Container Width to 33

Under Spacing > Padding, set all values to 20

Select the left-hand grid block and set the Container Width to 66, and also set the Padding to 20

Finally, select the entire Container block, and under Spacing > Border Size, set the Top and
Bottom values to 1

Then, simply duplicate the container and update each element for the next featured item in the
list.

When copying, set the container’s Top border to 0 to ensure there is no overlap.

Note: Every website has a different setup. It may be necessary to tweak things such as
border, padding, and margins. Adjust these settings as necessary to get the desired
design.
Further Navigation
If the website has many subcategories underneath the main category and does not fit into the 3-
4 featured categories, these should be added as a smaller navigation menu.

Adjust this process depending on the number of links that will be inserted.

Start with a Container block.

Add a Grid block and select the 3-column layout.

In the left-hand grid, add a Headline, and set it to H4, with the text “More Guides…”. Set this to
the website's primary brand color

Select a Headline block in the middle grid block and set it to Paragraph. Enter the name of the
subcategory being linked to and link to it

With this text highlighted, locate the Icon block setting in the sidebar, and select General. Here,
add a “>” icon.
Duplicate the style text box as many times as required, evenly splitting them between the 2nd
and 3rd grid block

Adjust the sizing and spacing as required to match the branding requirements of the site.

Keyword Content
Once the navigation elements are completed, use the keyword-rich content provided and add it
underneath.

Simply upload this content as if it were a regular article underneath.

2. Implementing the Custom Category Page for a Soft Silo

● Locate the original Category URL by going to Posts > Categories in the WordPress
dashboard
● Click on the Category which needs to be updated with a custom page
● Locate the Slug

● Go back to the custom page that was built using the above process
● Locate the Permalink > URL Slug section
● Ensure that the slug provided does not match the slug visible on the categories page
○ If it does, adjust it

● Save the custom category page and make a note of the link
● Go to Rank Math > Redirections
● Click Add New
● Under Source URL, enter the original Category URL
● Under Destination URL, enter the URL of the custom category page
● Leave all the other settings as default, and hit save.