Search Field Hides Behind Announcement Bar on Mobile - Pixel Union Empire Theme

Store Design
,
1

This issue only happens on a mobile device.

When a search is performed and you then tap on the search field again, the search field will hide behind the announcement bar. When you start typing it will reappear, but why does it initially hide and is there a way to fix this? Please see uploaded video.

Steps to reproduce:

  • visit https://propmoney.com/

  • perform a search and go to the results page

  • once on the results page, tap on the search field

  • the search field will then hide behind the announcement bar

  • if you start typing the search field will reappear

Thank you.

@BSS-Commerce

2

Hi @thekenstar

This is Victor from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the

PageFlyVictor_2-1680656712412.png
PageFlyVictor_2-1680656712412.png406×878 5.87 KB

Hope this can help you solve the issue

Best regards,

Victor | PageFly

3

Hi, thank you for that. It resolves the issue but it creates the following issue on other pages, please see the two attached images.

IMG_1968.PNG
IMG_1968.PNG1290×2796 454 KB

IMG_1969.PNG
IMG_1969.PNG1290×2796 469 KB

4

Please help me try this code with the same instruction

{% if template contains 'search' %}
{% endif %}

. This will run the code for search page only

5

I tried that code but it ends up covering the line below the search field which is not ideal. We are currently testing the updated Empire 9.0 theme and it appears that the issue I am having has been resolved with that version. We will be updating to that version soon so we will just leave this issue alone. Your help is much appreciated, thank you Victor.