Forked twentytwenty template-parts/pagination.php to support amp-next-page: https://wordpress.org/support/topic/infinite-scroll-feature-in-amp/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
// Add this code to the theme's functions.php. | |
add_action( | |
'wp_head', | |
static function () { | |
if ( mytheme_is_amp() ) { | |
echo '<meta name="amp-experiments-opt-in" content="amp-next-page">'; | |
} | |
}, | |
1 | |
); | |
function mytheme_is_amp() { | |
return function_exists( 'is_amp_endpoint' ) && is_amp_endpoint(); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* A template partial to output pagination for the Twenty Twenty default theme. | |
* | |
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials | |
* | |
* @package WordPress | |
* @subpackage Twenty_Twenty | |
* @since 1.0.0 | |
*/ | |
/** | |
* Translators: | |
* This text contains HTML to allow the text to be shorter on small screens. | |
* The text inside the span with the class nav-short will be hidden on small screens. | |
*/ | |
$prev_text = sprintf( | |
'%s <span class="nav-prev-text">%s</span>', | |
'<span aria-hidden="true">←</span>', | |
__( 'Newer <span class="nav-short">Posts</span>', 'twentytwenty' ) | |
); | |
$next_text = sprintf( | |
'<span class="nav-next-text">%s</span> %s', | |
__( 'Older <span class="nav-short">Posts</span>', 'twentytwenty' ), | |
'<span aria-hidden="true">→</span>' | |
); | |
$posts_pagination = get_the_posts_pagination( | |
array( | |
'mid_size' => 1, | |
'prev_text' => $prev_text, | |
'next_text' => $next_text, | |
) | |
); | |
// If we're not outputting the previous page link, prepend a placeholder with visibility: hidden to take its place. | |
if ( strpos( $posts_pagination, 'prev page-numbers' ) === false ) { | |
$posts_pagination = str_replace( '<div class="nav-links">', '<div class="nav-links"><span class="prev page-numbers placeholder" aria-hidden="true">' . $prev_text . '</span>', $posts_pagination ); | |
} | |
// If we're not outputting the next page link, append a placeholder with visibility: hidden to take its place. | |
if ( strpos( $posts_pagination, 'next page-numbers' ) === false ) { | |
$posts_pagination = str_replace( '</div>', '<span class="next page-numbers placeholder" aria-hidden="true">' . $next_text . '</span></div>', $posts_pagination ); | |
} | |
if ( $posts_pagination ) { ?> | |
<?php if ( mytheme_is_amp() && ! is_paged() ) : ?> | |
<?php | |
// @todo This is not the ideal way to obtain the subsequent pages, but WordPress doesn't provide such a way. | |
// @todo The page titles aren't ideal. | |
$pages = array_filter( array_map( | |
static function( $link ) { | |
if ( preg_match( '#<a.+?href="(.+?)">(.+?)</a>#s', $link, $matches ) ) { | |
$amp_url = html_entity_decode( $matches[1] ); | |
$title = html_entity_decode( $matches[2] ); | |
return [ | |
'title' => $title, | |
'ampUrl' => $amp_url, | |
'image' => get_site_icon_url(), | |
]; | |
} | |
return null; | |
}, | |
paginate_links( [ 'type' => 'array' ] ) | |
) ); | |
$amp_next_page = [ | |
'pages' => array_values( $pages ), | |
'hideSelectors' => [ | |
'#site-header', | |
'.header-footer-group', | |
'#site-footer', | |
'#wpadminbar', | |
], | |
]; | |
?> | |
<amp-next-page> | |
<script type="application/json"><?php echo wp_json_encode( $amp_next_page ); ?></script> | |
</amp-next-page> | |
<?php else : ?> | |
<div class="pagination-wrapper section-inner"> | |
<hr class="styled-separator pagination-separator is-style-wide" aria-hidden="true" /> | |
<?php echo $posts_pagination; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- already escaped during generation. ?> | |
</div><!-- .pagination-wrapper --> | |
<?php | |
endif; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment