Some phones and tablets load the desktop version of your website instead of the mobile version. When that happens the mobile advanced search does not appear on the page at all.

This happens because many modern devices report themselves to the website as desktop computers. WordPress then decides the visitor is on a desktop, so WPResidence loads the desktop search layout instead of the mobile one.

This is common on:

• iPhone or iPad using Safari
• Android phones and tablets using Chrome or Firefox
• Any device with “Request Desktop Site” turned on
• A desktop browser window that has only been made narrower

Making a laptop browser window smaller is not the same as testing on a real phone. A laptop still has a mouse or a trackpad, so it is still detected as a desktop device.

Why does this happen?

WPResidence uses the WordPress mobile detection to decide when to show the mobile search. If WordPress reports a desktop visitor, the mobile search template is never added to the page. It is not hidden by CSS, it is simply not there, which is why no theme setting and no custom CSS can bring it back.

Some devices no longer send a mobile signal. iPadOS Safari identifies itself as a Mac desktop browser. Some Android devices identify themselves as desktop Linux or Chrome. A phone with “Request Desktop Site” enabled does the same on purpose. Because of this, the website cannot always tell that the visitor is on a small screen.

How to check this is your case

Open the page on the device where the search is missing, then open the page source and search for mobile-adv_categ.

If it is not found, the mobile search was never added to the page and the fix below is the right one.

If it is found, the mobile search is already on your page and something else is keeping it out of view, such as the header height on a small screen or a custom CSS rule. In that case please open a support ticket and send us the page address and the device you are using.

How to fix it

The workaround is to detect the device by how the hardware behaves instead of by the name it reports. The code below checks whether the device has a touch screen and a screen narrower than a desktop. If it does, the site treats it as mobile and shows the mobile search.

Add this code at the end of your child theme functions.php file, or ask your developer to add it.

<?php
/**
 * Show the mobile advanced search on touch devices that report themselves
 * as desktop - iPadOS Safari, Android tablets in desktop mode, phones with
 * "Request desktop site" enabled.
 * Detection is based on hardware: touch pointer + non-desktop screen width.
 */
add_filter( 'wp_is_mobile', function ( $is_mobile ) {
    return $is_mobile || ! empty( $_COOKIE['wpresidence_is_touch'] );
} );

add_action( 'wp_head', function () {
    $server_mobile = wp_is_mobile() ? 1 : 0;
    ?>
    <script>
    (function () {
        try {
            var isTouch =
                window.matchMedia('(pointer: coarse) and (hover: none)').matches &&
                window.innerWidth < 1200;
            var hasCookie = document.cookie.indexOf('wpresidence_is_touch=1') !== -1;
            if (isTouch && !hasCookie) {
                document.cookie = 'wpresidence_is_touch=1; path=/; max-age=31536000; SameSite=Lax';
                if (!<?php echo (int) $server_mobile; ?>) {
                    location.reload();
                }
            } else if (!isTouch && hasCookie) {
                document.cookie = 'wpresidence_is_touch=; path=/; max-age=0; SameSite=Lax';
                if (<?php echo (int) $server_mobile; ?>) {
                    location.reload();
                }
            }
        } catch (e) {}
    })();
    </script>
    <?php
}, 1 );

After saving the file, clear your caches and open the site on the device in a fresh tab.

What should happen after adding the code?

On an affected phone or tablet the first page load may refresh once by itself. After that the mobile search appears normally. Real desktop and laptop visitors are not affected, because a mouse pointer does not match the touch test.

What if the problem continues on one device?

Open this link on the device that still fails:

https://www.whatismybrowser.com/detect/what-is-my-user-agent/

Copy the user agent and send it to support, together with the screen width of the device. This tells us exactly how that device identifies itself to your website.

Important notes

Add this code in a child theme or in a small custom plugin. Do not add it directly to the WPResidence theme files, because a theme update will overwrite it.

This workaround is only needed for devices that identify themselves as desktop. On a phone that already reports itself correctly, the code changes nothing and does no harm.

This is a customization, so it sits outside what we can test and maintain for you. Your developer should check it on your site.