WordPress FSE templates, header alignment, Core Web Vitals and 3 new pages

via Freelancer ·

Budget / Salary£20–250
TypeFreelance project
LocationRemote
Posted4 hours ago
Website: https://lovecanals.uk

Theme: Twenty Twenty-Five (block theme / Full Site Editing)
Jetpack-connected self-hosted WordPress. Custom FSE templates already exist. Heroes use shortcodes such as [canal_hero_slider] and [post_hero_slider]. Several templates use Spectra / UAGB containers. Other active plugins include ACF, Smart Slider 3, Max Mega Menu (+ Pro), Yoast SEO, WPCode Lite, Simple Custom CSS and JS, Jetpack and the Gutenberg plugin.
This is not a rebuild of the whole site. Stay on the existing theme and templates. Do not switch theme. Do not install a page builder (Elementor, Divi, etc.).
Six preview images are attached, one for each template. Match those layouts in WordPress (blocks + minimal custom CSS/JS). Keep the existing header, mega menu, footer and Fund Britain’s Waterways strip working.
Price, time and how we work
The price in your bid is the price paid. No extras, no “now I have looked at the site it will cost more”. If anything in this brief is unclear, ask before you bid. If you bid, that figure covers the whole job.
Timescale: 7 days from award to a finished development-site build ready for me to review.
Updates: One short daily message — what you did, what is left, any blocker. A missed day without a reason is a problem.
Development site, then live

I will give you admin access to the development site after award. All work is done there.
You will not get access to the live site until I have signed off the development build and it is ready to transfer. After sign-off I will grant live access so you can move the finished templates, pages and assets across and check that live matches the development site.
Payment: 100% after that live transfer is done and accepted.
Do not send a low bid and plan to raise it later. Those bids will be ignored.

The 6 WordPress templates in scope
Apply the shared layout rules below to all six:

Header template part (shared across the site)
Canal Pages Template New (canal-pages-template-new) — individual canal heritage pages
Pages / default inner page template (page / page-no-title as used today)
About page template (page-about) — redesign from the attached preview
Restoration page template — new template from the attached preview (extend restoration-and-engineers if that is the cleanest fit)
Activities page template — new template from the attached preview (Canal Events / activities hub)

If another template has to be touched only to keep header alignment consistent, that is fine. Do not redesign homepage or location-log pages unless needed for the header, alignment or performance work.

Shared layout rules (all 6 templates)
1. Header must display at 1600 × 500

The header / hero banner artwork is designed at 1600 × 500. It must be fully visible at desktop widths — not cropped, letterboxed wrongly, or squashed. On smaller screens it should scale proportionally. A 2× asset (3200 × 1000) is available if needed. Do not use a huge uncompressed original as the LCP image.
2. Left-hand content must line up with the header edge

The left edge of the main content column (and any left-aligned heading / intro block) must align with the left edge of the header / hero. Current templates mix alignfull Spectra containers, constrained widths (1140 / 1340) and extra padding, so the text sits inboard of the header. Fix this with one consistent content width and padding system, not one-off margins per page.

Performance
Largest Contentful Paint (LCP)

Pages are weak on LCP. This looks template-level: full-width hero / [canal_hero_slider] / [post_hero_slider], late-loading header images, Google Fonts @import inside templates, and large images without proper dimensions, fetchpriority="high" or preload.
Required:

Identify the LCP element on canal pages, About, Restoration, Activities and a typical inner page
Use a correctly sized, compressed header/hero file as the LCP image (WebP/AVIF if the stack allows), with dimensions, fetchpriority and preload where appropriate
Do not lazy-load the LCP image
Do not load unused hero slider assets on pages that do not need them
Move template-level @import Google Fonts to a proper enqueue, or use the theme font system

Time to First Byte (TTFB)

TTFB is also poor. Look first at what the templates and plugins are doing (heavy template HTML, shortcodes on every view, Spectra markup, duplicated FBW HTML pasted into several templates, uncached PHP). Then implement what is safe on this host.
Give before/after PageSpeed figures for:

Homepage
https://lovecanals.uk/the-shropshire-union-canal/
About
New Restoration page
New Activities page

Aim for LCP under 2.5s on mobile for those URLs after cache warm-up, and a clear TTFB improvement. If hosting itself is the ceiling, say so with evidence — do not guess.

Bug: canal page map not showing
Example: https://lovecanals.uk/the-shropshire-union-canal/
The page has a “Shropshire Union Canal Map” heading but the map does not render correctly (empty, broken or wrong size).
Find the cause (block embed, iframe, ACF field, shortcode, CSS overflow/height 0 from a Spectra container with overflow: hidden and a negative top margin, JS not loading, or the map never inserted). Fix it so the map displays at a usable height on desktop and mobile on this page and other canal pages that use the same pattern. Do not leave a heading with a blank box.

New / redesigned pages (match the attached preview images)
Build these as WordPress templates + pages, not as frozen picture copies.
A. New Activities page

Convert the attached Activities preview into a maintainable Activities template and page. Content must be editable in the block editor after handover. Use existing Canal Events content where that is the right source (https://lovecanals.uk/canal-events/).
B. New Restoration page

Same approach from the attached Restoration preview. This should work as a hub for existing restoration project pages (Cotswold, Montgomery, Grantham, etc.), not a one-off static file.
C. Redesigned About page

Replace the current About layout (https://lovecanals.uk/about/) with the attached About preview, using the About template. Keep the existing About copy unless the preview shows new wording. Design first — do not invent a new brand story.
All three pages must use the same header (1600 × 500), left-edge alignment, footer and FBW support block as the rest of the site.

Two small extras
1. LinkedIn in the header and footer

Add LinkedIn to the existing social links in both the top (header) and bottom (footer):
https://www.linkedin.com/company/love-canals/
Match the current social-icon style and size. Open in a new tab. Use a proper LinkedIn label / accessible text, not a bare URL.
2. Caneo badge in the footer

Add the Caneo badge in the footer with the other footer badges/logos. Artwork is attached. Keep it in proportion with neighbouring logos, sharp on retina, and linking to the official Caneo URL if supplied.

Technical constraints

Stay on Twenty Twenty-Five FSE templates / template parts
Keep Max Mega Menu working
Keep existing shortcodes working ([canal_hero_slider], [post_hero_slider], [canal_news], [author_profile_card], etc.). Improve them if they are the LCP/TTFB problem
Do not duplicate the FBW campaign HTML into yet more templates if it can live in one reusable template part or pattern
No new premium plugins without written approval
Mobile, tablet and desktop
Accessible colour contrast and heading order
Do not break Yoast / existing SEO titles and slugs

What I expect at the end

Updated header template part and the six templates above
Activities, Restoration and About pages matching the attached previews, editable in the block editor
Working canal maps on the canal template, checked on the Shropshire Union page and at least two other canal pages
LinkedIn in header and footer; Caneo badge in the footer
Short handover note: what changed, which templates/files, how to assign a template to a page, how to replace the 1600 × 500 header image, before/after LCP and TTFB
Development site signed off, then transferred to the live site and checked

How to bid
Include:

One total price (that is the price paid)
Confirmation you can finish in 7 days
Confirmation you will send a daily update
2–3 examples of WordPress FSE / Twenty Twenty-Four or Twenty Twenty-Five template work (not only Elementor)
A short note on what you would check first for the Shropshire Union map and for LCP
Confirmation you will work from the attached preview images rather than redesigning from scratch
javascript website design seo wordpress css website testing html website management web development accessibility
Apply on Freelancer →

Project sourced from Freelancer.com. Applications happen directly on the original platform — we never collect your data.