Search results appearance on mobile

  • Resolved caruci

    (@caruci)


    4 years, 10 months ago

    Hi. I’m using the latest woocommerce and wp, storefront theme. I’m not sure if I’m posting in the right place, I don’t have a clue where to start :)).

    The issue is that on mobile search the results are not shown like on desktop search. They show up as full product description, so the client thinks only that product exists, doesn’t know to scroll and see that another product is below. I need the search results to show just the product title, image, price and shop now button, as it appears on category pages for example. I just don’t know where to begin to try and solve this. Thank you.

    • This topic was modified 4 years, 10 months ago by caruci.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)

  • Hi, currently your site is displaying the following message:

    Indisponibil datorit? unui program de mentenan?? programat. Revino ?n cateva minute.

    Are you able to fix that so that the content is viewable?

    Thread Starter caruci

    (@caruci)

    Yaeh, I’m updating a module, don’t know why it’s taking so long. Thank you, hopefully in a few minutes it’ll be ok again.

    LE: And… it’s ok :), it’s live again.

    • This reply was modified 4 years, 10 months ago by caruci.

    Yeah I see it live now, when looking at the search results and adjusting the browser width down to a mobile device the results show the same for me as they do on a wider screen. I don’t see any product descriptions showing up on the link you provided initially.

    Are you able to provide a screenshot of the issue you’re seeing? You can upload it to a site such as https://snipboard.io and share the link to the image here.

    Thread Starter caruci

    (@caruci)

    So, the first 4 images are how it shows on mobile search when several results are shown, but with product description. The last image is how products appear on the main page and how I need them to show also on search results page. Scaling down on desktop doesn’t modify the display, it’s ok, just searching directly on mobile devices. Now I’m thinking there mught be a different code for the search box or something…

    https://www.carucioare-copii.ro/magazin/1.jpg

    https://www.carucioare-copii.ro/magazin/2.jpg

    https://www.carucioare-copii.ro/magazin/3.jpg

    https://www.carucioare-copii.ro/magazin/4.jpg

    https://www.carucioare-copii.ro/magazin/5.jpg

    Thread Starter caruci

    (@caruci)

    Yep, a different search box is displayed on mobile devices, it was hidden on desktop by css, I’ve enabled it on desktop too, now. Yet I have no clue how to show the upper right one on mobile… I just don’t remember what I did to have both. :))

    • This reply was modified 4 years, 10 months ago by caruci.
    Thread Starter caruci

    (@caruci)

    I’ve managed to hide even from mobile the search form that was giving the results with full product description.

    #search-toggle, .search-form {
    display: none;
    }

    Now I guess I just need to show on mobile the ajax search box displayed on dektop. Is it easier to solve maybe? ??

    Hmm, try this CSS

    @media screen and (max-width: 568px) {
    .site-header .site-search {
        display: block;
    }
    .site-header .site-search .smart-search-results {
        width: 100% !important;
    }
}
    Thread Starter caruci

    (@caruci)

    Well, thank you. You seemed to inspire me, I did it! ?? Installed a different ajax search module and now it shows everything just right.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Search results appearance on mobile’ is closed to new replies.