Forum Discussion

qinglau's avatar
qinglau
Mentor
14 years ago

How to hide search drop down filter in mobile page

Hi All,

 

I am working on rebrand Mobile version of Lithium. In Search page, I would like to hide/remove the search drop down filters; please see the attachmenet.

 

First of all, i tried to apply CSS to hide the selection input field. It works, however, a whole blank row will still display. I am wondering whether there is a way to hide/remove the whole row.

 

Cheers,

Qing


8-9-2011 11-50-01 AM.png8-9-2011 12-00-30 PM.png

2 Replies

  • AdamN's avatar
    AdamN
    Khoros Oracle
    14 years ago

    Hi Qing,

     

    If you look carefully at your second image, you'll notice that the row actually isn't empty, because it still contains the submit button for the filters. So your CSS will need to account for that as well.

     

    You might try something like this instead:

    #lia-body .lia-content .lia-component-search-content form.lia-search-message-mobile {display: none;}

     

    A couple of caveats:

    1. You'll want to fully test this out to ensure that it's hiding everything you want to hide, while not hiding anything you don't want to hide.
    2. You and your team have probably already carefully weighed this decision, but I do want to call out that removing these options may make it more difficult for your mobile users to find the content they're looking for.

    I hope this helps!

     

  • qinglau's avatar
    qinglau
    Mentor
    14 years ago
    Hi AdamN,

    Thanks. I will also discuss with our UX team.

    Cheers,
    Qing