[Support request] Tailor output (not just style) based on mobile vs. desktop

[Andrew]

Is there a way in GeneratePress (officially or unofficially) to tailor output based on mobile vs. desktop?

This could include:

• Showing say five article previews on the home page, instead of ten.
• Showing different elements to mobile vs. desktop users.
• Integration with a caching solution, so that mobile vs. desktop pages get correctly cached and served.

I’m not just talking about hiding stuff using CSS, but actually altering the HTML that gets sent.

Thanks,
Andrew

[Leo]

Hi there,

I’m not sure if there is a way to do this without some heavy custom coding unfortunately.

Showing say five article previews on the home page, instead of ten.

The number of posts shown on the home page is handled by WordPress itself so it cannot be controlled by the theme.

Showing different elements to mobile vs. desktop users.

What elements are you referring to here?

[Andrew]

Hook elements from the GP elements menu. -A.

[David]

Hi there,

WP has the wp_is_mobile() template tag:

https://developer.wordpress.org/reference/functions/wp_is_mobile/

Which you can use in your own conditional functions.

For example:

add_action( 'pre_get_posts', function( $query ) {
    if ( is_admin() || ! $query->is_main_query() ) {
        return;
    }

    if ( is_home() && wp_is_mobile() ) {
        $query->set( 'posts_per_page', 5 );
    }
} );

This will change the posts_per_page to 5 on the home page if WP detects its a mobile device.

You can apply this logic with any GP filter such as the generate_hook_element_display

https://docs.generatepress.com/article/generate_hook_element_display/

[Andrew]

Thanks. -Andrew

[David]

You’re welcome

[Author]

Posts