Jump to content

List view only in desktop


Cpup

Recommended Posts

Hi,

Is there a way of only showing the list view in desktop, but keeping the grid view on mobile and tablet. I've tried tagging out the toggle between the two. It works at first, but when I adjust the browser to mobile view, refresh and resize to desktop, it goes back to grid view on desktop and stays in grid view.

Thanks

Link to comment
Share on other sites

I read that you have hidden or removed the two small icons that switch the views between list and grid.

So, please try this

In content.category.php, find:

<div id="ccScroll">
   <ul class="small-block-grid-1 medium-block-grid-3 product_list" data-equalizer>
      {foreach from=$PRODUCTS item=product}

Change to:

<div id="ccScroll">
   <ul class="small-block-grid-1 medium-block-grid-3 large-block-grid-1 {* product_list *}" data-equalizer>
      {foreach from=$PRODUCTS item=product}

Find:

            <div class="row product_list_view">

Change to:

            <div class="row show-for-large-up{* product_list_view *}">

Find:

            <div class="hide-for-large-up product_grid_view hide">

Change to:

            <div class="hide-for-large-up{* product_grid_view *}{* hide *}">

This creates only the grid view for small and medium size widths, and list view for large size and wider.

But be aware that, even on small screens, the page will load in list view and switch immediately to grid view when the css gets applied (in the "blink of the eye" but still noticeable).

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...