- This topic has 5 replies, 3 voices, and was last updated 4 years, 1 month ago by
.
-
Posts
-
Similar questions have been posted before, but I’m not sure if my solution is best practice. I created a hook element to show some content next to the logo. I have to remove this content on mobile devices. I did that by setting the wrapper DIV to
display: none;in a media query. Would you consider this ok? Or would you recommend a better solution?Thank you!
Mike
Customer Support
Hi there,
This should help:
https://docs.generatepress.com/article/responsive-display/#using-our-hide-on-classesHi Leo,
thank you very much. This is pretty much how I did it. Usually, I try to avoiddisplay:none;and prefer to remove unwanted code using PHP. But this is not really possible with media queries, since the server does not know anything about the device.Thanks again,
Mike
Customer Support
Hi Mike,
You can try using wp_is_mobile() condition for the Hook element.
https://developer.wordpress.org/reference/functions/wp_is_mobile/Filter the display rule using this filter –
https://docs.generatepress.com/article/generate_element_display/Example:
add_filter( 'generate_element_display', function( $display, $element_id ) { if ( 123 === $element_id && wp_is_mobile() ) { $display = false; } return $display; }, 10, 2 );But this is quite limited. I may work on some devices but not others as the function is pretty old. It may be worth adding more User agents.
Here’s a loose copy of this – https://gist.github.com/ejcabquina/4790ff39a976610f2c1e2056a6bb8841
I don’t know all the UA strings but if you can get all and add them in, it should work for most.Thanks, Leo. This is an interesting approach. Will give it a try. Might be a bit risky though for elements that could break the layout. Didn’t know the
generate_element_display. This is really a powerful feature. Thanks for pointing me in this direction. There is so much to learn about Generatepress, and it is always great fun. Besides, the documentation is absolutely fantastic. Great job!Glad to hear!
- You must be logged in to reply to this topic.
