Forums › Forums › Search & Filter Pro › Different Filter Settings For Desktop & Mobile

Tagged: , ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Anonymous
    (Private)  June 21, 2018 at 9:50 am #180923

    Quick update… The Read More toggle is pure CSS (As found at https://codepen.io/Idered/pen/AeBgF) so can’t be a script error.

    The page I’m using the Search & Filter on is http://www.our-pub.co.uk/tpg
    The Read More works on mobile (because the mobile filter results are listed first in the HTML) but not on desktop.

    Trevor
    (Private)  June 21, 2018 at 3:50 pm #180961

    Addressing your first query (Is it possible to display the filter options differently depending on device?) the answer is no, sort of.

    What happens (please try) if you add that field twice to the form, once as a checkbox and once as a combobox dropdown?

    You could use CSS to hide one or the other (if they both have the same name, you can target them child #). Maybe that would work?

    Anonymous
    (Private)  June 21, 2018 at 4:59 pm #180982

    Thanks, that seems to have worked.
    I’d thought about trying to hide an additional filter using CSS but the filters had the same class and no ID. Never thought about using the child selector.
    Just in case anyone else is looking for this…
    After adding a second Category filter, the CSS I used (or variants of to show/hide mobile/desktop elements) was…

    form#search-filter-form-[XXXXX] li.sf-field-category:nth-child(2) {
    display: none;
}

    Needed to specify the li class or it was hiding other filters further down the list too.

    Thanks again,
    Mark.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)