Return to previous page

Ajax Search mobile – fullscreen popup not working on mobile devices

This topic has 4 replies, 2 voices, and was last updated 6 days, 4 hours ago ago by Jack Richardson

Andrei Andrei

Participant

March 20, 2026 at 11:42

Hello,

We are using the Ajax Search in Header widget with the following configuration:
– Type: Separate
– Ajax Search: ON
– Popular Searches: ON
– Display Categories: ON
– Mobile Content: Image + Title

Issue on mobile devices:
When tapping the search icon on mobile, the search dropdown opens but it does not display as a full-screen popup. The search results are partially visible and the ‘View all results’ button is not accessible because it is hidden below the mobile keyboard or outside the visible area.

On desktop this works correctly. The problem is specific to mobile browsers (tested on iOS Safari and Android Chrome).

Questions:
1. Is there a setting in the Ajax Search widget to force a fullscreen popup mode on mobile?
2. How can we ensure the ‘View all results’ button is always visible and accessible on mobile?
3. Is there a recommended configuration for the Ajax Search widget specifically optimized for mobile UX?

Thank you.

Files is visible for topic creator and
support staff only.

#467592 Copied

3 Answers
Jack Richardson

Support staff

March 20, 2026 at 12:58
Hello @Andrei Andrei,

You may use an alternative widget for a full-width search, such as the Popup Search (https://prnt.sc/dkKF-B-XQRYC). You can hide the current Ajax Search widget on responsive layouts and display this one instead (https://prnt.sc/rDGNDpzHWtRO).

If you prefer to continue using the current widget, you can add the following custom CSS to improve its layout on mobile devices:

@media only screen and (max-width: 768px) { body:has(header .add-overlay-body-on-focus:focus, header .add-overlay-body-on-focus.focused, header .add-overlay-body-on-focus:focus-within) .et-mobile-panel-wrapper { transform: translateY(100%); } header .etheme-search-form .autocomplete-suggestions { max-height: calc(100vh - 100px) !important; } header .etheme-search-form .autocomplete-suggestions .etheme-search-form-more { position: sticky; bottom: 0; } }

Best regards,
Jack Richardson
The 8Theme’s Team
Content is visible for topic creator and
support staff only.
#467598 Copied
Andrei Andrei

Participant

March 20, 2026 at 13:29

Hi Jack,

Thank you for the suggestion. I’ve checked the widget panel in Elementor and I can’t find the Popup Search widget you mentioned. I only see Header Ajax Search and Ajax Search available (screenshot attached).

Could you clarify where exactly I should be looking for it, or if there’s something I need to enable first?

Thank you,
Andrei

#467600 Copied

Jack Richardson

Support staff

March 20, 2026 at 13:51

Hello @Andrei Andrei,

Please check whether the Popup Search widget is enabled in the Elements Manager section of the Elementor plugin settings (https://prnt.sc/ddqYGqYolJrj). You can find more information in their documentation: https://elementor.com/help/element-manager/

Best regards,
Jack Richardson
The 8Theme’s Team

#467602 Copied
Viewing 4 results - 1 through 4 (of 4 total)