How can I reposition the search and account buttons on a mobile theme?

Hi!

We bought and published a new theme today for our store. It’s the “Capital” theme. On mobile version, we don’t like the placement of the “search button” (and the same for the “account button”). They both appear on the bottom of the screen when you scroll up, but when you scroll down it doesn’t appear at all.

I’m pretty sure I’ve tried everything possible before asking here, but I guess some code edit is required in this situation.

Our store: https://voggin.es/

All your help will be really appreciated!

For element placements double check theme settings for such options.

Have any actual customers complained about the site being hard to use in the default configuration?

The designers of that theme purposefully chose such defaults for features being on the bottom to increase usability of common actions on smaller devices because that is where most peoples thumbs can reach easily without phone fumbling to click stuff at the top of pages.

If those things are moved to the top they will then seem to eat even more visual space because they will be chunked up with the menu-button, the logo , and the cart button in one big top glob. Or entire header has to be redesigned to pick and choose what is shown at what sizes.

The scroll behavior is to get as much real estate back as possible when using the site, modern users understand these behaviors. A normal business reason to change such things is customers are an older/aging demographic unfamiliar with such interactions.

Hi @voggin ,

You can make it always appear by adding this code in your theme.liquid file before tag

.footer-tapbar:not(.search-open):not(.isOpen).out-of-view { transform: translateY(0%) !important; }