Hi seosurvival,
Unfortunately there currently is no way to remove blocks using a remove_action. The best way to handle hiding content on mobile devices would be to use CSS @media queries. This is pretty easy to setup, you just need to determine at what size width you want the content to no longer show. If you would like to go this route, let me know and I will do what I can to help.
I am curious though about the is_mobile() function. That is not a standard WordPress function so it must be unique to your theme. Blox, the paid version of Blox Lite, does contain visibility settings. It currently does not offer mobile visibility settings but this would be a neat thing to add. Do you have any info on how the is_mobile() function works? WordPress does have a wp_is_mobile() function, but this is not meant to styling purposes.
Nick
Hi Nick,
Thank you for the reply. I’ll look into the @media query solution. Can you point to decent documentation or a forum?
Basically I want to hide/remove certain bloxs for mobile users.
As for the mobile() function. I’m using the plugin “mobble”. Hopefully you have plans to include similar functionality within your awesome plugins, either lite or pro. I chose your solution because it fit a need with my Dynamic theme, but it was lacking the capability to hide from mobile users. So I have to jury rig it. I hope I can figure this out because I’m considering purchasing the pro version.
Again, thank you for the response.
Hi Nick,
You are right there is no way to “remove_action” a blox. I tried all day with no success. So I’ll try the @media route.
Questions:
Where is the @media code entered? (ie Theme custom CSS or Blox CSS)
What is the format of the @media code. I’m stuck on referencing a specific blox.
Thank you in advance…
Hi seosurvival,
I would recommend that you keep the @media queries consistent with your theme. For example, the base Genesis theme has the following breakpoints:
@media only screen and (max-width: 1340px) {
...CSS code...
}
@media only screen and (max-width: 1023px) {
...CSS code...
}
@media only screen and (max-width: 860px) {
...CSS code...
}
I would look at your themes style.css file and see what it is using. But for the sake of example, using the breakpoints above, I am guessing you would want to use the max-width: 860px one to hide the block on mobile devices. You can always specify a larger or smaller width.
To just hide a single block, and not multiple blocks, use the Style tab on the individual block. You will see a box for Custom CSS. You will also see the block’s unique id below the custom CSS box. This is what you use to target the individual block. You will then want to enter something like this:
@media only screen and (max-width: 860px) {
#blox_global_## {
display: none;
}
}
This code will hide the block whenever the browser width is less than or equal to 860px.
Let me know if you have any further questions.
Any luck with this seosurvival? Let me know if you were able to get this working.
Nick
