True Blogger Genesis Child Theme

A clean, performant, and SEO-first Genesis child theme for serious bloggers. Features a WordPress Dashboard-inspired UI with system fonts for optimal performance.

✨ Features

Performance First

• System Font Stack - No external font requests, instant text rendering
• Minimal JavaScript - Vanilla JS with no jQuery dependency
• Optimized CSS - CSS custom properties for efficient styling
• Lazy Loading - Native browser lazy loading for images
• Deferred Scripts - Non-blocking JavaScript execution
• Query String Removal - Cleaner URLs for better caching

Modern Design

• WordPress Dashboard UI - Familiar, professional aesthetics
• CSS Custom Properties - Easy theming and customization
• Dark Mode Support - Automatic system preference detection
• Responsive Design - Mobile-first approach with fluid typography
• Print Styles - Optimized printing experience

SEO Optimized

• Semantic HTML5 - Proper document structure
• Schema Markup - Enhanced structured data
• Accessibility Ready - WCAG 2.1 compliant
• Skip Links - Keyboard navigation support
• Clean Output - Minimal bloat in page source

Block Editor Ready

• Full Site Editing Support - theme.json configuration
• Custom Block Styles - Consistent block appearance
• Editor Styles - WYSIWYG editing experience
• Wide and Full Alignments - Flexible content layouts
• Custom Color Palette - Curated color options

📋 Requirements

• WordPress: 6.4 or higher
• PHP: 8.0 or higher
• Genesis Framework: 3.6.1 or higher

🚀 Installation

1. Install Genesis Framework

   • Upload the genesis folder to /wp-content/themes/
   • Do NOT activate Genesis directly

2. Install True Blogger Child Theme

   • Upload the trueblogger folder to /wp-content/themes/
   • Activate "True Blogger Theme" in Appearance > Themes

3. Configure Theme

   • Navigate to Genesis > Theme Settings
   • Customize via Appearance > Customize

📁 File Structure

trueblogger/
├── assets/
│   └── js/
│       ├── main.js          # Source JavaScript
│       └── main.min.js      # Minified JavaScript
├── images/
│   └── icon.png             # Theme icon
├── languages/
│   └── trueblogger.pot      # Translation template
├── editor-style.css         # Block editor styles
├── functions.php            # Theme functionality
├── home.php                 # Blog home template
├── page_landing.php         # Landing page template
├── screenshot.png           # Theme screenshot
├── style.css                # Main stylesheet
└── theme.json               # Block editor config

🎨 Design Tokens

The theme uses CSS custom properties for easy customization:

Colors

--color-primary: #2271b1;         /* WordPress blue */
--color-primary-hover: #135e96;
--color-accent: #d63638;          /* WordPress red */
--color-success: #00a32a;
--color-warning: #dba617;

Typography

--font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, ...;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, ...;

Spacing

--space-1: 0.25rem;   /* 4px */
--space-2: 0.5rem;    /* 8px */
--space-4: 1rem;      /* 16px */
--space-5: 1.5rem;    /* 24px */
--space-6: 2rem;      /* 32px */
--space-8: 3rem;      /* 48px */

🔧 Customization

Adding Custom Colors

Add to your child theme's functions.php:

add_filter('genesis_editor_color_palette', function($colors) {
    $colors[] = [
        'name'  => __('My Custom Color', 'trueblogger'),
        'slug'  => 'my-custom',
        'color' => '#ff6b6b',
    ];
    return $colors;
});

Modifying Layouts

The theme supports all Genesis layouts:

• Content-Sidebar
• Sidebar-Content
• Full-Width Content
• Content-Sidebar-Sidebar
• Sidebar-Sidebar-Content
• Sidebar-Content-Sidebar

Widget Areas

• Primary Sidebar - Main sidebar widget area
• Before Content - Widget area before content
• After Content - Widget area after content
• Footer Widget 1 - First footer column
• Footer Widget 2 - Second footer column
• Footer Widget 3 - Third footer column

🔒 Security Features

• XML-RPC disabled by default
• X-Pingback header removed
• Security headers added (X-Content-Type-Options, X-Frame-Options, etc.)
• WordPress version removed from source

🌐 Browser Support

• Chrome/Edge (last 2 versions)
• Firefox (last 2 versions)
• Safari (last 2 versions)
• iOS Safari (last 2 versions)
• Samsung Internet (last 2 versions)

♿ Accessibility

The theme follows WCAG 2.1 Level AA guidelines:

• Proper heading hierarchy
• Focus indicators
• Skip links
• Keyboard navigation
• Screen reader text
• Reduced motion support
• Sufficient color contrast

📝 Changelog

Version 3.0.0 (December 2025)

• Complete theme rewrite for modern standards
• PHP 8.0+ compatibility with strict types
• Genesis 3.6.1 compatibility
• WordPress 6.4+ block editor support
• System font stack implementation
• WordPress Dashboard-inspired UI
• Performance optimizations
• Security hardening
• Full theme.json support
• Modern CSS with custom properties
• Vanilla JavaScript (no jQuery)
• Accessibility improvements

Version 2.1.2 (Legacy)

• Previous stable release
• Genesis 2.x compatibility

📄 License

This theme is licensed under the GPL-2.0-or-later license. See LICENSE for details.

👤 Author

Gaurav Tiwari

• Website: gauravtiwari.org
• Theme Page: True Blogger

🙏 Credits

• Genesis Framework by StudioPress
• WordPress for the amazing CMS
• Normalize.css for CSS reset patterns

---

Made with ❤️ for WordPress bloggers