Change the product menu orientation

Instructions on how to change the product menu orientation from a right column to a left column for the Motivate theme.

Updated over a week ago

This article provides the code you need to easily move the product menu in the Motivate theme from the right side to the left side of the page, as pictured below:

Before (default - right side column)

After (updated - left side column)

Simply follow these instructions to make this change:

  1. Go to Settings > Theme

  2. Click on the CSS tab

  3. Click the edit button for Overrides

  4. Copy and paste this code into the Overrides

    .ch-content-wrapper {
    flex-direction: row-reverse;
    }

    .ch-sidenav {
    border-left: none;
    border-right: 1px solid;
    border-color: darken($color-card-bg, 5%);
    }

  5. Click Save to save the Overrides

  6. Click Save to save the theme changes

  7. Click Publish to publish the theme changes (please note this may take up to a minute)

Done! Now your product column shows up on the left hand side instead of the right hand side in the product layout.
โ€‹
โ€‹

Did this answer your question?