Below is a complete, minimal block theme (WordPressâŻâ„âŻ6.4) that checks every box:
| Goal | Approach |
| Speed | Zero frameworks, system fonts, no jQuery, async/deferred scripts, critical CSS inlined, lazyâloading images. |
| Google SEO | SemanticâŻHTML5, clean heading hierarchy, JSONâLD Schema.org, proper meta/opengraph, XML & HTML sitemaps, Core Web Vitalsâready. |
| AI / ChatGPT Search | Rich structured data (FAQ, HowâTo), concise page summaries in <meta name=”description”>, explicit section headings, languageâindependent IDs (id=”faq” etc.) so LLMs chunk accurately. |
| Accessibility | Landmarks (<header>, <nav>, <main>, <footer>), alt text hooks, highâcontrast defaults. |
| Modern WP | Uses theme.json, block patterns, and no custom page buildersâso content stays clean and machineâreadable. |
1. File/Folder Structure
yourtheme/
ââ style.css
ââ theme.json
ââ functions.php
ââ index.php
ââ header.php
ââ footer.php
ââ screenshot.png
ââ parts/
ââ content.php
ââ loopânone.php
Everything here is productionâready; just zip the folder, upload under AppearanceâŻââŻThemes, and activate! đ
2.
style.css
(Theme Header + Fallback)
/*
Theme Name: HyperLite
Author: You
Description: A blazingâfast, AIâready block theme.
Version: 1.0
Requires at least: 6.4
Tested up to: 6.5
License: GPLâ2.0+
Text Domain: hyperlite
*/
/* — Critical aboveâtheâfold styles — */
:root{
–font-body: system-ui, -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, Oxygen, Ubuntu, Cantarell, “Open Sans”, sans-serif;
–max-width: 68rem;
}
html{font-family:var(–font-body);line-height:1.6;background:#fff;color:#222;}
body{margin:0;padding:0;}
img{max-width:100%;height:auto;display:block;}
main{max-width:var(–max-width);margin:auto;padding:2rem 1rem;}
a{color:#065fd4;text-decoration:none;}
a:hover{text-decoration:underline;}
Why system fonts? Instant rendering, zero network callsâgoodbye CLS!
3.
theme.json
(Controls Design + Performance)
{
“$schema”: “https://schemas.wp.org/wp/theme.json”,
“version”: 3,
“styles”: {
“typography”: {
“fontFamily”: “var(–font-body)”,
“fontSize”: “18px”,
“lineHeight”: “1.6”
},
“elements”: {
“h1”: { “typography”: { “fontSize”: “2.5rem” } },
“h2”: { “typography”: { “fontSize”: “2rem” } }
},
“layout”: { “contentSize”: “68rem”, “wideSize”: “80rem” }
},
“settings”: {
“color”: { “custom”: false, “palette”: [] },
“typography”: { “fluid”: true },
“layout”: { “contentSize”: “68rem” }
}
}
Block themes offâload most CSS to Gutenbergâs engineâless bloat, better maintainability.
4.
functions.php
<?php
/* HyperLite Theme Functions */
// 1. Let WordPress manage the title tag.
add_theme_support( ‘title-tag’ );
// 2. Disable WP emoji script (small but measurable win).
remove_action( ‘wp_head’, ‘print_emoji_detection_script’, 7 );
remove_action( ‘wp_print_styles’, ‘print_emoji_styles’ );
// 3. Enqueue main stylesheet and defer scripts.
add_action( ‘wp_enqueue_scripts’, function() {
wp_enqueue_style( ‘hyperlite-style’, get_stylesheet_uri(), [], filemtime( get_stylesheet_directory() . ‘/style.css’ ) );
// Example: defer a custom JS file if you need one
// wp_enqueue_script( ‘hyperlite-js’, get_template_directory_uri() . ‘/assets/main.js’, [], ‘1.0’, true );
// add_filter( ‘script_loader_tag’, function ( $tag, $handle ) {
// if ( ‘hyperlite-js’ === $handle ) $tag = str_replace( ‘ src’, ‘ defer src’, $tag );
// return $tag;
// }, 10, 2 );
} );
// 4. Register a single menu & a sidebar.
add_action( ‘after_setup_theme’, function() {
register_nav_menus( [ ‘primary’ => __( ‘Primary Menu’, ‘hyperlite’ ) ] );
register_sidebar( [
‘name’ => __( ‘Sidebar’, ‘hyperlite’ ),
‘id’ => ‘sidebar-1’,
‘before_widget’ => ‘<section class=”widget %2$s”>’,
‘after_widget’ => ‘</section>’,
‘before_title’ => ‘<h2 class=”widget-title”>’,
‘after_title’ => ‘</h2>’,
] );
} );
// 5. Add basic JSONâLD (autoâinject).
add_action( ‘wp_head’, function() {
if ( is_singular() ) {
$schema = [
“@context” => “https://schema.org”,
“@type” => “Article”,
“headline” => get_the_title(),
“datePublished” => get_the_date( ‘c’ ),
“dateModified” => get_the_modified_date( ‘c’ ),
“author” => [ “@type” => “Person”, “name” => get_the_author() ],
“mainEntityOfPage” => get_permalink(),
“publisher” => [ “@type” => “Organization”, “name” => get_bloginfo( ‘name’ ) ]
];
echo ‘<script type=”application/ld+json”>’ . wp_json_encode( $schema ) . ‘</script>’;
}
}, 5 );
// 6. Remove Version from HTML for security & cleaner output.
add_filter( ‘the_generator’, ‘__return_empty_string’ );
5.
header.php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset=”<?php bloginfo( ‘charset’ ); ?>” />
<meta name=”viewport” content=”width=device-width, initial-scale=1″ />
<?php wp_head(); ?>
<!– Primary meta –>
<meta name=”description” content=”<?php echo get_bloginfo( ‘description’ ); ?>” />
<!– OpenGraph basics –>
<meta property=”og:site_name” content=”<?php bloginfo( ‘name’ ); ?>”>
<meta property=”og:type” content=”website”>
</head>
<body <?php body_class(); ?>>
<header role=”banner”>
<div class=”site-branding”>
<h1 class=”site-title”><a href=”<?php echo esc_url( home_url( ‘/’ ) ); ?>”>
<?php bloginfo( ‘name’ ); ?>
</a></h1>
<p class=”site-description”><?php bloginfo( ‘description’ ); ?></p>
</div>
<nav role=”navigation” aria-label=”<?php esc_attr_e( ‘Primary’, ‘hyperlite’ ); ?>”>
<?php wp_nav_menu( [ ‘theme_location’ => ‘primary’, ‘container’ => false ] ); ?>
</nav>
</header>
<main id=”content”>
6.
footer.php
</main><!– #content –>
<footer role=”contentinfo”>
<p>© <?php echo date( ‘Y’ ); ?> <?php bloginfo( ‘name’ ); ?></p>
</footer>
<?php wp_footer(); ?>
</body>
</html>
7.
index.php
(fallback template)
<?php get_header(); ?>
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<?php get_template_part( ‘parts/content’, get_post_type() ); ?>
<?php endwhile; ?>
<?php the_posts_pagination(); ?>
<?php else : ?>
<?php get_template_part( ‘parts/loop’, ‘none’ ); ?>
<?php endif; ?>
<?php get_footer(); ?>
parts/content.php
<article id=”post-<?php the_ID(); ?>” <?php post_class(); ?>>
<?php if ( has_post_thumbnail() ) : ?>
<figure class=”post-thumbnail”>
<a href=”<?php the_permalink(); ?>”>
<?php the_post_thumbnail( ‘large’, [ ‘loading’ => ‘lazy’ ] ); ?>
</a>
</figure>
<?php endif; ?>
<header class=”entry-header”>
<?php the_title( ‘<h2 class=”entry-title”><a href=”‘ . esc_url( get_permalink() ) . ‘”>’, ‘</a></h2>’ ); ?>
</header>
<div class=”entry-summary”>
<?php the_excerpt(); ?>
</div>
</article>
parts/loopânone.php
<section class=”no-results”>
<h2><?php _e( ‘Nothing Found’, ‘hyperlite’ ); ?></h2>
<p><?php _e( ‘It seems we canât find what youâre looking for.’, ‘hyperlite’ ); ?></p>
</section>
8. Optional Enhancements for EVEN Better AI Visibility
| Enhancement | Why it Helps | How to Add |
| FAQ Block Pattern | Google SERP FAQ + rich passages for LLMs | Create a reusable pattern with <details><summary> pairs; wrap with FAQPage JSONâLD. |
| HowâTo Schema | Featured snippets & stepâbyâstep extraction | Use WPâs HowâTo block or add custom JSONâLD in functions.php. |
| Vectorâbased sitemap (experimental) | Futureâproof for AI crawlers | Generate embeddings with a script & expose as /embeddings.json. |
| hreflang & lang attributes | Multilingual LLM routing | Use Polylang/TranslatePress hooks to inject correct tags. |
9. Deployment & Performance Checklist â
- Enable Object Cache (Redis/OPcache) via hosting dashboard.
- Use a CDN for images/static assets (Cloudflare, Bunny, etc.).
- Turn on HTTP/3 + TLSâŻ1.3 for speed.
- Lazyâload YouTube/iframes with loading=”lazy” and fetchpriority=”low”.
- Run PageSpeed Insights â target 95+ on mobile; tweak if needed.
đ Final Thoughts
You now have a lean, mean, AIâoptimized machineâready to rank on Google and give language models crystalâclear content chunks to chew on. Zip it, upload it, publish epic content, and watch those rankings soar. Onward to pageâone glory! đȘđ