Verdant Ride – Homepage Structure & Recovery Guide

Overview

This document describes the architecture of the Verdant Ride homepage and provides step-by-step instructions for recovering the hero image/slider if it is ever accidentally removed.

Last verified: April 25, 2026
Site URL: https://verdantride.com/
WordPress Theme: Twenty Twenty-Four (twentytwentyfour)
Home page post: “Solid State (Raytrace)” — Post ID 62

Homepage Architecture

The homepage is built from two separate components that work together:

1. The Front Page Template (Site Editor)

This is a WordPress Full Site Editor (FSE) template that wraps the page content. It lives in the Site Editor, not in the regular Pages editor.

Template ID: twentytwentyfour//front-page
How to access: WP Admin → Appearance → Editor → Templates → Front Page

The correct block structure of the Front Page Template is:

<!-- wp:template-part (header, transparent-header) /-->

<!-- wp:shortcode -->

                    

                    

                    

                    

                    

            
  <!-- /wp:shortcode -->

<!-- wp:post-content /-->

<!-- wp:template-part (footer) /-->

The

shortcode renders the rotating hero image slider at the very top of the homepage, above all page content.

2. The Home Page Content (Post ID 62)

This is the actual page content edited via Pages → Solid State (Raytrace).

How to access: WP Admin → Pages → Solid State (Raytrace) → Edit
Direct URL: /wp-admin/post.php?post=62&action=edit
Template assigned: Front Page

Page content block order (top to bottom):

  1. 225
    Total Rides Logged
    2,524.3
    Community Miles
    176.1
    Community Hours
    0.16
    Avg Efficiency
    (miles per % battery)

    🌊 Where the community is riding

    Brand: Lift Flite SiFly Waydoo Other
    Locations are jittered ~±4 km to protect rider privacy. Only approximate body of water is shown.
    shortcode — community stats widget + map
  2. Group → my-plugin/image-button — the “LOG YOUR RIDE” button
  3. Group → Group → Cover block (Hero1 background image) → “Under Construction” section with heading and image
  4. Buttons block — “Access a massive library of free music” link
  5. cb/carousel-v2 with 3 slides — music player carousel (vr_songs shortcodes)
  6. Cover block → “Join 1500+ subscribers” sign-up section with Sign Up button

How the Hero Image Works

The hero is rendered by the

shortcode, which is a custom shortcode registered by a plugin on this site. It outputs a full-width rotating image slider at the top of the page.

Important: This shortcode lives in the Front Page Template — NOT in the page content. If you open the page editor (Pages → Edit), you will not see the hero there. It is in the template layer above.

⚠️ Hero Image Recovery Instructions

If the hero image disappears from the homepage, follow these steps:

Step 1 — Check the Front Page Template

Go to: WP Admin → Appearance → Editor (this opens the Full Site Editor). Click on Templates in the left sidebar, then click Front Page.

Look for a Shortcode block containing

between the Header and the page Content block. If it is missing or empty, that is the problem.

Step 2 — Add the shortcode back

In the Front Page Template editor, click the + button to add a new block between the Header and the Content block. Search for Shortcode, add it, and enter:

Click Save. The hero should immediately reappear on the homepage.

Step 3 — Alternative: Restore via browser console (advanced)

If you cannot access the Site Editor UI, paste this into the browser console on any logged-in WP admin page:

wp.apiFetch({
  path: '/wp/v2/templates/twentytwentyfour//front-page?context=edit',
  method: 'GET'
}).then(data => {
  const current = data.content.raw;
  if (current.includes('

                    

                    

                    

                    

                    

            
  ')) {
    console.log('Hero shortcode already present!');
    return;
  }
  const heroBlock = '
<!-- wp:shortcode -->

                    

                    

                    

                    

                    

            
  <!-- /wp:shortcode -->

';
  const postContentTag = '<!-- wp:post-content /-->';
  const idx = current.indexOf(postContentTag);
  const newContent = current.substring(0, idx) + heroBlock + current.substring(idx);
  return wp.apiFetch({
    path: '/wp/v2/templates/twentytwentyfour//front-page',
    method: 'PUT',
    data: { content: newContent }
  });
}).then(r => r && console.log('Hero restored!'));

Common Mistakes to Avoid

  • Do not look for the hero in Pages → Edit. The hero shortcode is in the template layer, not the page content. Looking in the Pages editor will not show it.
  • Do not delete blocks from the Site Editor without knowing what they are. The shortcode block in the Front Page template is easy to accidentally remove because it looks small and unremarkable.
  • If
    renders as plain text    , check that the hero slider plugin is active in WP Admin → Plugins.
  • Template changes are immediately live on the homepage as soon as you click Save in the Site Editor.

Reference: Correct Front Page Template (as of April 25, 2026)

The complete raw content of the Front Page Template when working correctly:

<!-- wp:template-part {"slug":"header","theme":"twentytwentyfour","tagName":"header","area":"header","className":"transparent-header"} /-->


<!-- wp:shortcode -->

                    

                    

                    

                    

                    

            
  <!-- /wp:shortcode -->

<!-- wp:post-content /-->

<!-- wp:template-part {"slug":"footer","theme":"twentytwentyfour","tagName":"footer","area":"footer"} /-->