I am currently using The Gem theme together with Elementor PRO, and I have a specific question.
I would like to know if it is possible to manage different home pages depending on the device (desktop, tablet, and mobile), not through the traditional responsive approach within the same page, but by creating entirely separate homepage versions, each dedicated to its respective device.
The reason is that the desktop, tablet, and mobile designs I am working on are very different from each other, and simple responsive adjustments are not sufficient.
Does The Gem provide any native functionality for this, or could you suggest the best way to implement it in combination with Elementor PRO?
Thank you for your request. You can check out WordPress plugins like "Redirection," which support redirects based on the user agent (or you can look for plugins that allow redirects based on user agent or device).
Additionally, you can use custom code and utilize the wp_is_mobile() function to detect if the user is on a mobile device, like this:
function redirect_mobile_homepage() { if ( is_front_page() && wp_is_mobile() ) { wp_redirect( home_url('/mobile-homepage/') ); exit; } } add_action( 'template_redirect', 'redirect_mobile_homepage' );
However, please note that wp_is_mobile() does not differentiate between tablets and phones; it treats both as mobile devices. Also, if you use a caching plugin for your pages, this approach may not work properly because caching plugins typically serve the same cached page to all users regardless of device type. In this case, a JavaScript-based approach would be a better option.
Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Hello, I have an issue with the header background.
I created a custom header in the theme and set it to be transparent. It works correctly on the homepage, but on regular pages (for example: https://test4.buzzlab.it/filosofia-sigle-page/) there is still a white background showing below the header.
I also tried changing the settings of the individual page, but I wasn’t able to fix it.
I’m attaching a screenshot for reference.
Could you please help me understand how to remove the white background under the header on normal pages?
Dear The Gem Team,
I am currently using The Gem theme together with Elementor PRO, and I have a specific question.
I would like to know if it is possible to manage different home pages depending on the device (desktop, tablet, and mobile), not through the traditional responsive approach within the same page, but by creating entirely separate homepage versions, each dedicated to its respective device.
The reason is that the desktop, tablet, and mobile designs I am working on are very different from each other, and simple responsive adjustments are not sufficient.
Does The Gem provide any native functionality for this, or could you suggest the best way to implement it in combination with Elementor PRO?
Thank you in advance for your support.
Best regards,
Emanuele
Hi Emanuele,
Thank you for your request. You can check out WordPress plugins like "Redirection," which support redirects based on the user agent (or you can look for plugins that allow redirects based on user agent or device).
Additionally, you can use custom code and utilize the wp_is_mobile() function to detect if the user is on a mobile device, like this:
function redirect_mobile_homepage() {
if ( is_front_page() && wp_is_mobile() ) {
wp_redirect( home_url('/mobile-homepage/') );
exit;
}
}
add_action( 'template_redirect', 'redirect_mobile_homepage' );
However, please note that wp_is_mobile() does not differentiate between tablets and phones; it treats both as mobile devices. Also, if you use a caching plugin for your pages, this approach may not work properly because caching plugins typically serve the same cached page to all users regardless of device type. In this case, a JavaScript-based approach would be a better option.
Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver
Thanks.
Hello, I have an issue with the header background.
I created a custom header in the theme and set it to be transparent. It works correctly on the homepage, but on regular pages (for example: https://test4.buzzlab.it/filosofia-sigle-page/) there is still a white background showing below the header.
I also tried changing the settings of the individual page, but I wasn’t able to fix it.
I’m attaching a screenshot for reference.
Could you please help me understand how to remove the white background under the header on normal pages?
Thank you in advance.
Attached files: Cattura.JPG
Hi,
kindly check this articles:
https://docs.codex-themes.com/article/612-my-changes-in-theme-options-are-not-being-applied-to-some-pages-posts-why
https://docs.codex-themes.com/article/605-how-to-make-the-top-area-and-the-menu-transparent
Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver
Thanks
You are welcome!
Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver