LYRA AI

Lyra AI Theme

Lyra AI – Clean, Accessible-Focused & SEO-Ready Theme

Lyra AI is a modern, lightweight theme suitable for blogs, business websites, and modern web projects. It provides a clean structure and a fast user experience aligned with Theme Review Guidelines, with accessibility-focused usability patterns inspired by WCAG 2.1 recommendations.

Responsive design Accessibility-focused SEO-friendly Block editor compatible GPL-2.0+

Introduction

Lyra AI is built as a clean and complete base theme that works out of the box with minimal configuration. It focuses on clarity, usability, and performance while remaining flexible enough for blogs, landing pages, small business sites, or AI-focused platforms.

The theme ships with a mobile-first layout and semantic HTML5 markup. It includes styling for posts, typography, widgets, comments, and navigation menus, plus usability enhancements such as a visible “Skip to content” link, keyboard-friendly navigation, and underlined links inside content areas for clearer interaction.

Lyra AI uses English as the default language so it can be translated into any locale using standard translation tools and .po/.mo files.

Key Features

  • Clean design suitable for blogs, landing pages, and AI-related websites.
  • Fully responsive, mobile-first layout for smartphones, tablets, and desktops.
  • Accessibility-focused: visible “Skip to content” link, keyboard navigation, ARIA labels, and clear focus states.
  • Dropdown submenus visible on hover and keyboard focus.
  • Lightweight CSS and minimal scripts to keep performance stable.
  • SEO-friendly structure with semantic headings and clean markup.
  • Compatible with the block editor and core platform features.
  • Customizable header and footer areas.
  • Styled typography for headings, paragraphs, lists, and blockquotes.
  • Underlined links inside content areas (posts, excerpts, comments, text widgets).
  • Widget-ready areas for footer and/or sidebar.
  • Child-theme compatible and translation-ready.
  • Tested with recent stable versions.

Installation Guide

Installing and activating Lyra AI follows the standard theme installation process:

  • Download the theme ZIP file from the official source.
  • In the dashboard, go to Appearance → Themes → Add New.
  • Click Upload Theme, select the ZIP file, and click Install Now.
  • After installation, click Activate to enable Lyra AI.

Recommended setup steps:

  • Go to Appearance → Menus and create or assign a menu as the Primary Menu.
  • If you want a static homepage, go to Settings → Reading and set a static page as the front page.
  • Open Appearance → Customize to adjust colors, header, footer, and other visual options.
  • For translations, place the proper .po/.mo files under /wp-content/languages/themes/ or use a translation plugin.

Theme Accessibility

Accessibility-focused usability is part of Lyra AI. The theme includes features that help users navigate and consume content more comfortably:

  • A “Skip to content” link that becomes visible when focused via keyboard (Tab key), allowing users to jump directly to the main content.
  • Dropdown submenus visible on hover and keyboard focus, supporting mouse and keyboard users.
  • Links inside content areas (posts, excerpts, comments, and text widgets) are underlined by default to clearly distinguish them from regular text.
  • Clear focus states so keyboard users can always see where they are on the page.
  • Semantic HTML5 elements for better structure and screen reader support.
  • Colors selected to provide strong contrast for legibility.

How Lyra AI Works

Lyra AI is designed to work immediately after activation, without requiring complex setup. The default layout includes a site header with navigation, a main content area, and a footer with optional widgets.

The theme supports the block editor and core blocks, allowing you to create flexible layouts using native tools. The CSS is organized to provide a consistent look for headings, paragraphs, lists, blockquotes, images, and buttons.

Menus and multi-level dropdown items are automatically styled. When you assign a menu to the primary location, top-level items appear in the main navigation bar, while submenu items appear as dropdowns on hover or focus. This behavior is keyboard-accessible.

Scripts are loaded in a minimal and non-blocking way to preserve page speed and overall performance. Lyra AI avoids heavy dependencies and focuses on clean, maintainable code.

Recommended Homepage Structure

You can build your homepage using the block editor and Lyra AI’s default styles. A suggested structure:

  • Hero section: A block with a title, subtitle, and a primary call-to-action button.
  • Features section: A grid of 3–6 features with headings and short descriptions.
  • Latest posts: A block showing recent blog posts with excerpts.
  • Call-to-action block: A section encouraging visitors to sign up, contact you, or explore your services.
  • Footer: Widgets with navigation links, contact details, or social profiles.

Screenshots Overview

The following screenshots are recommended for showcasing Lyra AI and meeting directory expectations:

1. Default Theme Preview (Required)

A screenshot of the homepage as it appears immediately after activating Lyra AI:

  • Header with site title or logo
  • Navigation menu with top-level items
  • Main content area with example text
  • Footer with optional widgets

2. Submenu Visibility

Show a dropdown submenu open beneath a top-level navigation item, demonstrating that submenu items are clearly visible.

3. Skip to Content Link

Capture the “Skip to content” link in its focused state after pressing the Tab key.

4. Mobile View

Display the responsive layout on a smartphone-sized viewport, showing the header, navigation, and main content stacked neatly.

5. Single Post Style

Show a single blog post including:

  • Post title and meta information
  • Paragraphs and headings
  • Lists and blockquotes
  • Underlined links inside the content

6. Widgets Area

Capture the footer or sidebar with widgets (recent posts, categories, text widget, etc.), showing how widgets are styled.

FAQ

How do I customize the homepage?

Create a page using blocks and set it as the static front page under Settings → Reading. Lyra AI will apply its default styles to your content.

Is Lyra AI compatible with the block editor?

Yes. Lyra AI is compatible with core blocks and is designed to work smoothly with the block editor.

How do I create and assign menus?

Go to Appearance → Menus, create a new menu, add your pages or links, and assign it to the Primary Menu location. Submenus are created by nesting menu items.

Can I change the fonts used in the theme?

Yes. You can add custom CSS using the Customizer or a child theme to override font families, sizes, and styles.

Does Lyra AI support child themes?

Yes. You can create a child theme to safely override templates, styles, and functions without modifying the parent theme.

Where can I report bugs or request support?

You can report issues through the theme support area in the directory, or via the official documentation and contact channels provided by the theme author.

Changelog

= 1.1.0 =
Maintenance update.
Tested up to 6.9
Includes usability refinements and documentation updates.

License

Lyra AI is licensed under the GNU General Public License v2.0 or later (GPL-2.0+). You are free to use, modify, and redistribute this theme in accordance with the GPL license terms.

Credits

Lyra AI follows coding standards and uses only GPL-compatible resources. The theme is designed to align with directory requirements and modern accessibility practices.

Lyra AI Theme. Released under GPL-2.0+.