Archived topic
Hide Page Hero on Mobile but still show Page Title
1 reply · Started by I on December 15, 2018
Hi there,
so I've created page heros to show on all posts, creating a full screen image page header with page title. I've added class hide-on-mobile so that on mobile featured image leads the post full-width. However using hide-on-mobile on the page hero also hides the post title, and I still want the post title to show on mobile.
Thanks
Iain
Hi there,
1. Add this PHP snippet to create shortcode [the_title]:
add_shortcode( 'the_title', function() {
ob_start();
the_title( '<h1 class="entry-title" itemprop="headline">', '</h1>' );
return ob_get_clean();
} );Adding PHP: https://docs.generatepress.com/article/adding-php/
2. Create a new hook and add this as content:
<div class="hide-on-desktop">[the_title]</div>
https://docs.generatepress.com/article/hooks-element-overview/
3. Use the before_entry_header hook and enable execute shortcode:
https://docs.generatepress.com/article/hooks-element-overview/#settings
https://docs.generatepress.com/article/hooks-visual-guide/
That should do it.
Let me know :)
