From a tiny brochure site to a complete listing of all hire items, with CPT to simplify maintenance.
From a very small brochure website with few pages, I started from scratch, expanding the site to list all the hire items available.
This project was developed in bursts over two years because the business was busy – a good complaint. Early in 2023 I got descriptions and photos for each hire item and populated the site before migrating from the staging site to the live site.
Custom Post Type for hire items
To simplify site maintenance and displaying hire items, I created a ‘Hire item‘ custom post type (CPT). To help with SEO the url contains ‘dublin-hire.’ I also created a ‘Hire category‘ taxonomy so hire items could be added to one or more categories. The CPT was like a normal page or post with the block editor available for the content.
To allow for structured information about each item I used CMB2 to provide fields for the price, weight, width, length, height, payload and digging depth, and a field for a PDF of the item’s specifications. If a field has data it will be displayed on the front end.
Using CMB2 fields helps the site maintainer know what fields should be entered, without having to worry about the format or how they are presented. Furthermore, the numeric fields include a check to ensure that they are numbers greater than zero.
On the front end the information is listed between the description the hire enquiry form.
To keep a visitor on the site and to help them find products, each hire item can have a Related Products section. This uses a CMB2 add-on called CMB2 Attached Posts Field. I limit it to show hire item posts.
For each hire item the site maintainer can select hire items that are related e.g. show a 5 ton mini digger when viewing the 1 ton mini digger. The screenshot below is for a 6hp Power Washer so a more powerful power washer is offered, and a petrol version and a wet/dry vacuum. It’s easy to add related items and the order can be changed on the right side.
On the front end the hire item thumbnail, name and link are shown.
Hire Enquiry form
The form is created with Ninja Forms. The item name is prepopulated in a read-only field so that the site visitor does not need to copy/paste it and McGuirk Hire staff know what item the visitor is interested in.
The ‘Hire Enquiry‘ button is a details/summary accordion item. I used a tiny bit of CSS animation when the button is clicked to reveal the form (opacity goes from 0 to 1 and the height from 0 to full size).
For hire item archives all items in the category will be shown on the one page. The most number of items in a category is just over 30 so this is not too much. Using WP Super Cache on the site helps reduce the database load.
On the single hire item pages I used GeneratePress hooks to add wrapper divs so that the information is presented in two columns – the featured image on the left and the content on the right. Using the hooks means that GeneratePress handles the majority of the output and future proofs the code.