Community forum for knowledge and support

Updated 2 months ago

Enabling Mobile Search Component Across All Device Types

At a glance

The community member is trying to use the mobile search component from Application Shell 4 across all device types, but the search icon button only works on mobile devices. They have tried changing the visibility and interactions to include desktop devices, but without success. A comment suggests that the community member would be better off building the front-end of the interaction starting at desktop and working their way down, then attaching the interactions from the Application Shell component. The commenter advises against the community member's current approach, as it is "completely backwards from how Webflow works" and would require making style changes across multiple device breakpoints. The commenter suggests recreating the front-end experience on desktop first, then making tweaks for tablet and mobile, and finally attaching the interactions and adjusting the breakpoint for desktop.

Morning all,

I'd like to use the mobile search component from Application Shell 4, but so that it shows and works across all device types.

I've copied the component across and changed the visibility so that it shows on desktop, but the search icon button still only works on mobile devices.

I've also tried changing the interactions to include desktop devices, but with no luck.

Any idea how I can get this to work on desktop devices?

M
1 comment

you'd be likely better off building out the front-end of this interaction starting at desktop and working your way down, and then attaching the interactions that you want to steal from the application shell component.

Doing it the way you are doing it is completely backwards from how Webflow works and you'd have to go to mobile landscape, make a bunch of style changes, then to tablet and make those same style changes, and then again in desktop.

I would just "recreate" the frontend experience one time on desktop, make some tweaks from tablet down, and then attach the interactions and changing the breakpoint for the interactions like you did to desktop. In theory this should work. I can dive into it more in a video or something if you think that would be helpful - but take a stab at what I'm saying if I'm making any sense.

Add a reply
Sign up and join the conversation on Slack