AMP Support

BuddyX Pro ships a small set of AMP-only templates and one AMP-only stylesheet. When the AMP plugin serves an AMP version of a post, an archive, or a search page, the theme swaps in a stripped-down template that carries no JavaScript. This page explains what is swapped, what is not, and which settings still apply.

What is AMP?

AMP is a restricted subset of HTML. Pages served as AMP may not run custom JavaScript, so anything interactive has to be built from the AMP component library (amp-sidebar, amp-live-list, AMP.setState and so on).

On WordPress, AMP output comes from the AMP plugin. BuddyX Pro does not generate AMP pages and does not detect AMP on its own. It asks the plugin: the template tag buddyxpro()->is_amp() is a thin wrapper over the plugin’s is_amp_endpoint(). With no AMP plugin installed, every AMP feature described here stays dormant and your site renders normally.

Requirements

Requirement	Notes
AMP plugin	Required. The theme calls `is_amp_endpoint()`, `amp_is_request()` and `amp_is_legacy()`, which the AMP plugin provides.
BuddyX Pro theme	Active. The AMP component loads on every request, so nothing has to be switched on in the theme.
A menu on the Primary location	Required for AMP navigation. Without it the AMP pages render with no menu at all.

Installation & Setup

Step 1: Install the AMP Plugin

Go to Plugins > Add New
Search for “AMP”
Click Install Now, then Activate

The AMP header holds only your logo or site title plus a hamburger button. The menu itself lives in a slide-out drawer, and that drawer renders only when the Primary menu location has a menu assigned.

Go to Appearance > Menus
Open the menu you want to use
Under Menu Settings, tick Primary
Click Save Menu

If you skip this step, the hamburger button is not printed and AMP visitors get no navigation.

Step 3: Check the Four Page Types

Open the AMP version of each page type the theme remaps and confirm it looks right:

A single blog post
Your posts page, a category archive, a tag archive, an author archive
A search results page

Pages, the static front page, BuddyPress screens, WooCommerce screens and every other post type are not remapped by the theme. They fall through to whatever the AMP plugin does with them.

What You Can Do

Capability	What actually happens
Serve AMP posts and archives in BuddyX styling	The theme replaces the template for four request types with its own AMP templates.
Give AMP visitors a working menu	The Primary menu is rendered inside an `amp-sidebar` drawer with a hamburger toggle and a close button.
Keep footer widgets on AMP	Footer widget areas 1 to 4 and the footer info part still render.
Keep the header search toggle usable on non-remapped AMP pages	The theme injects `AMP.setState` bindings into the header search toggle. That toggle is printed by `template-parts/header/navigation.php`, which the theme’s own AMP templates do not use, so the bindings only matter on AMP pages that still render the standard header.
Live-updating comments	The theme declares AMP support with `comments_live_list` enabled and wraps the comment list in `amp-live-list`.
Ship zero theme JavaScript on AMP	The theme skips its own script enqueues on AMP requests.

The theme does not create AMP URLs, add AMP validation, or provide AMP analytics. That is the plugin’s job.

Theme Features

AMP Templates

The theme keeps seven files in its amp/ folder. Three of them are routed templates and four are partials pulled in by the other three.

File	Role
`amp/single.php`	Single post
`amp/archive.php`	Posts page, category, tag, author, post archive
`amp/search.php`	Search results
`amp/header.php`	Partial. Emits the document head and the AMP header
`amp/footer.php`	Partial. Footer widgets, footer info, the sidebar drawer
`amp/branding.php`	Partial. Hamburger button, logo or site title, tagline
`amp/off-canvas.php`	Partial. The `amp-sidebar` navigation drawer

There is no amp/page.php, amp/index.php or amp/comments.php. Anything not in the routing list below keeps its normal template.

Which Requests Get Remapped

Request	AMP template used
Single post (post type `post`)	`amp/single.php`
Posts page (`is_home()` with post type `post`)	`amp/archive.php`
Category, tag, author archive	`amp/archive.php`
Post type archive for `post`	`amp/archive.php`
Search results	`amp/search.php`

Everything else, including static pages, the front page, BuddyPress and WooCommerce screens, is left alone.

One behaviour worth knowing: amp/single.php stops rendering after the header when the request is the front page. If you have set a single post as your front page, the AMP version of it will show the header and nothing more.

AMP Header

The AMP header is deliberately smaller than the normal one. It contains:

A hamburger button, printed only when a Primary menu exists
Your custom logo, or the site title and tagline if no logo is set

It does not contain the standard navigation bar, header widgets, the search icon, the cart icon, or the top bar. Those all live in template-parts/header/navigation.php, which the AMP templates never load.

If Elementor is active and you have built a header for the header theme location, the theme’s AMP header markup is skipped and Elementor’s header is used instead. The same applies to the footer.

Navigation is an amp-sidebar with the id buddyx-amp-canvas, opened by on="tap:buddyx-amp-canvas.toggle" on the hamburger and closed by the same tap action on the close button. It renders your Primary menu.

The AMP footer renders footer widget areas footer-1, footer-2, footer-3 and footer-4, then the standard footer info part. Empty widget areas are skipped, and if all four are empty the widget row is not printed at all.

Sidebars on AMP

amp/archive.php and amp/single.php output no sidebar. amp/search.php calls get_sidebar() only when the request is not an AMP endpoint, so AMP search results have no sidebar either. Your sidebar layout setting still controls the non-AMP versions of those pages.

Assets on AMP

On an AMP request the theme changes what it loads:

Theme JavaScript is not enqueued at all
The navigation accessibility script and the skip-link focus fix are skipped
The core comment-reply script is not enqueued
The dedicated stylesheet assets/css/buddyx-amp.min.css is loaded, under the handle buddyx-amp
Stylesheet preloading is turned off, so stylesheets that would normally be registered for later preload are enqueued directly instead

buddyx-amp.css is styling only. It covers four areas (global, header, post, widgets) and targets AMP-specific selectors such as .amp-container, .amp-header-inner, .amp-site-branding, .buddyx-amp, .hamburger.amp-nav-menu-toggle, #buddyx-amp-canvas, amp-img and amp-sidebar. It adds no behaviour.

Live Comments

Because the theme declares add_theme_support( 'amp', array( 'comments_live_list' => true ) ), comments on an AMP post are wrapped in amp-live-list:

The comment list gets the items attribute
Polling interval is 60000 milliseconds (one minute)
Maximum items per page comes from the Comments per page option under Settings > Discussion when Break comments into pages is on; when it is off the value is 10000
A “New comment(s)” button appears when the poll finds something new
Comment navigation is given the pagination reference-point attribute

The sort direction follows the Comments should be displayed with the older/newer comments at the top of each page option.

Body Class

On AMP requests the theme adds buddyx-amp to the body classes. Use it as the scope for any AMP-only CSS you write.

Settings

There is no AMP settings panel in the Customizer. AMP behaviour is on whenever the AMP plugin serves an AMP page. What the AMP archive template does read are four existing theme settings.

Location: Appearance > Customize > Site Sidebar

Read by amp/archive.php. It does not add a sidebar to AMP output, but the value is resolved and cached there.

Default: right

Options: none, left, right, both.

Blog Layout

Location: Appearance > Customize > Blog Archive

Sets the listing layout class on the AMP archive, exactly as it does on the normal archive.

Default: default-layout

Options: default-layout, list-layout, grid-layout, masonry-layout, magazine-layout, editorial-layout, minimal-layout.

Columns

Location: Appearance > Customize > Blog Archive

The AMP archive clamps this to 1 through 4 and maps it onto a col-md-12, col-md-6, col-md-4 or col-md-3 grid class. The control only appears when Blog Layout is grid, masonry, or magazine.

Default: not set, shown as “Default” in the control

When it is not set, the theme falls back to the layout’s own column count: 3 for magazine, 2 for masonry, 2 for grid, and 1 otherwise. Older sites that saved blog_grid_columns or post_per_row keep those values.

Site Breadcrumbs?

Location: Appearance > Customize > Site Sub Header

Controls whether breadcrumbs print in the AMP sub-header block.

Default: on

Options: on (Yes), off (No).

Use Cases

A news or magazine site chasing mobile load time

Posts and category archives are the pages that get shared and the pages Google Search surfaces on mobile. Those are exactly the four request types the theme remaps. Install the AMP plugin, assign a Primary menu, and your post and archive AMP pages come out in BuddyX styling with no theme JavaScript on them at all. Your pages, landing pages and community screens are untouched, so nothing you built with a page builder is at risk.

A paid community with a public blog in front of it

The membership area is BuddyPress, and BuddyPress screens are not remapped to AMP templates by the theme. That split is useful: the marketing blog can be served as AMP for reach, while the logged-in community keeps its full interactive theme. Set the Primary menu so AMP readers can still reach the join or pricing page from the drawer.

A course site publishing long-form articles

Article traffic arrives from search on phones. The AMP archive respects your Blog Layout and Columns choices, so a grid or magazine listing you configured for the desktop site carries over rather than falling back to a plain stack. Course pages themselves are a different post type and stay on their normal templates.

A site running a discussion-heavy blog

Comment threads keep updating while a reader is on the page. Because the theme enables comments_live_list, AMP posts poll for new comments once a minute and offer a “New comment(s)” button rather than requiring a reload. If you have set Comments per page under Settings > Discussion, that page size is what the live list uses.

Troubleshooting

Problem: The AMP header shows the logo but no hamburger button.

Cause: No menu is assigned to the Primary location. Both the hamburger button and the drawer are gated on that.

Fix:

Go to Appearance > Menus
Select your menu
Tick Primary under Menu Settings
Save the menu

A Page Does Not Get the AMP Template

Problem: A page, product, or community screen served as AMP does not look like the AMP post pages.

Cause: The theme only remaps single posts, the posts page, category, tag, author archives, the post archive, and search. Everything else falls through to the AMP plugin’s own handling.

Fix: This is by design. Style those pages with your own AMP CSS if you need them to match.

Front Page Post Shows Only the Header

Problem: You set a single post as the front page and its AMP version is nearly empty.

Cause: amp/single.php returns early when the request is the front page.

Fix: Use a static page or the posts page as your front page.

Header or Footer Missing on AMP

Problem: The AMP header or footer is not the theme’s.

Cause: Elementor has a template assigned to the header or footer theme location. When Elementor renders that location, the theme’s AMP markup is skipped.

Fix: Either accept the Elementor header, or unassign the Elementor theme location if you want the AMP header instead.

Interactive Element Does Nothing on AMP

Problem: A slider, filter, or toggle works on the normal page but not the AMP one.

Cause: The theme enqueues no JavaScript on AMP requests, and AMP forbids custom JavaScript anyway.

Fix: Rebuild the interaction with AMP components, or accept that the AMP version is static.

Comments Do Not Live-Update

Problem: New comments do not appear without a reload.

Checks:

Confirm the page really is an AMP endpoint. Live comments only run when both the request is AMP and comments_live_list is present in the registered AMP theme support.
Confirm comments are open on the post.
Give it a full minute. The poll interval is 60000 milliseconds.

For Developers

Template Tags

Both are exposed on the buddyxpro() instance by inc/AMP/Component.php.

Tag	Returns
`buddyxpro()->is_amp()`	True when the AMP plugin is active and this request is an AMP endpoint. Wraps `is_amp_endpoint()`. Must not be called before `parse_query`.
`buddyxpro()->using_amp_live_list_comments()`	True when the request is AMP and `comments_live_list` is non-empty in the registered `amp` theme support.

Filters

Filter	Where it fires	What it does
`buddyxpro_preloading_styles_enabled`	`inc/Styles/Component.php`	Overrides the AMP-driven stylesheet preloading switch. The unfiltered value is `! buddyxpro()->is_amp()`.
`buddyx_search_slide_toggle_data_attrs`	`inc/extra.php`	Attributes on the header search wrapper. The AMP component appends `on="tap:AMP.setState(...)"`, a `[class]` binding, and `aria-expanded` bindings.
`buddyx_search_field_toggle_data_attrs`	`inc/extra.php`, two call sites	Attributes on the search container. The AMP component appends an `AMP.setState` tap handler.
`buddyxpro_css_files`	`inc/Styles/Component.php`	The stylesheet manifest, including the `buddyx-amp` entry.

Style Handle

Handle	File	Loads when
`buddyx-amp`	`assets/css/buddyx-amp.min.css`	`preload_callback` returns `buddyxpro()->is_amp()`

Source lives at assets/css/src/buddyx-amp.css.

Template Routing

Routing is a template_include filter registered in functions.php:

add_filter( 'template_include', 'buddyx_theme_amp_templatre_include', '9999992233720368547758099' );

Two things to know before you hook alongside it. The function name is misspelled in the source (templatre), and the priority is passed as a numeric string large enough to overflow PHP_INT_MAX. PHP keeps an overflowing numeric string as a string array key, so WordPress stores that exact string as the priority and ksort( $callbacks, SORT_NUMERIC ) sorts it after every ordinary integer priority. The callback therefore runs last.

That has one practical consequence: registering your own template_include filter at PHP_INT_MAX will not beat it, because PHP_INT_MAX sorts numerically lower than that string. To override an AMP template, remove the theme callback and add your own:

add_action( 'wp', function () {
  remove_filter( 'template_include', 'buddyx_theme_amp_templatre_include', '9999992233720368547758099' );
} );

Pass the priority as the same string literal; anything else will not match the stored key. The whole block is gated on amp_is_request() || amp_is_legacy(), so it is inert without the AMP plugin.

Theme Support

Declared on after_setup_theme in inc/AMP/Component.php:

add_theme_support( 'amp', array( 'comments_live_list' => true ) );

Remove or re-add it on a later after_setup_theme priority to opt out of the live comment list.

Comment Markup

inc/Comments/Component.php builds the amp-live-list wrapper, sets data-poll-interval to MINUTE_IN_SECONDS * 1000, sets data-max-items-per-page from comments_per_page (or 10000 when page_comments is off), and adds the pagination reference-point attribute through a temporary navigation_markup_template filter that it removes again straight after.

CSS Hooks

.buddyx-amp on <body>, plus .amp-container, .amp-header-inner, .amp-header-wrapper, .amp-site-branding, .amp-site-header-wrapper, .buddyx-amp-header, .hamburger.amp-nav-menu-toggle, .close-sidebar, #buddyx-amp-canvas and .buddyx-amp-sidebar-mask.

Blog Archive - Layout and column controls the AMP archive reads
Sidebar Layouts - Sidebar option resolved by the AMP archive
Sub Header & Breadcrumbs - The breadcrumbs toggle the AMP archive reads

Got a question? We’re a friendly team - happy to help.

Documentation: buddyxtheme.com/docs Support Forum: wbcomdesigns.com/support

Email Support: support@wbcomdesigns.com

Include: BuddyX Pro version, AMP plugin version, and the URL of the AMP page in question.