View Single Post
  #4  
Old 05-11-2016, 06:40 AM
Tara K's Avatar
Tara K Tara K is offline
 
Join Date: Apr 2016
Posts: 43
Default

Hello,
Quote:
Originally Posted by Loopty Loo Designs View Post
We need the store to the right for the desktop version because we have vertical categories to the left. We put in the following codes that was supposed to disable that for the mobile version but it isn't consistently working. Also, every page seems to function fine except the last "place order" screen - it is the only one to the right. But once you get to the page and let's say decide to go back to another page in our store, it stays stuck to the right because you have viewed that place order screen. If you close out of the page and go back into our store, it is correct again. So it must be something with the "place order" screen.

/* Move Ecwid store to the right */
.ecwid-productBrowser {
margin-left: 215px !important;
min-height: 300px;
}


/* Disable the changes above for Mobile */
@media screen and (max-width: 320px) {
.ecwid-categories-vertical {
display: none;
}
.ecwid-productBrowser {
margin-left: 15px !important;
min-height: 0px;
}
}

What do we need to change? On the desktop we need the store to the right so our consumers can use the vertical categories on the left, but on the mobile version, we don't have the vertical categories.
Thank you for the explanations. You can set two rules for the widgets “Horizontal menu” and “Vertical menu”. The first rule will hide Vertical menu if screen width is less than, f.ex., 680. The second rule will show Horizontal menu if customers browses your store via a mobile device.

So when browsing the store on a desktop, your customers will see Vertical menu, and on a narrowed browser or a mobile device they will see Horizontal menu.

Here is the code:

Code:
@media screen and (min-width: 680px) {
.horizontal-menu {
    display: none !important;
}
}

@media screen and (max-width: 680px) {
.ecwid-categories-vertical {
    display: none !important;
}
}

Please let me know if this works for you.