Shopify sidebar menu: How to edit it in your Shopify stores
With the strong development of eCommerce, there are various brands that go to considerable efforts to guarantee that their online stores’ user experience and buyer’s journey are distinct. When a feature or design aspect on another site catches their eye, it’s usual for shops to take inspiration from it. You’ve probably seen elements on other sites that you’d like to use on your own. And, the sidebar menu is an example. If you’re running a Shopify store yet don’t know how to make changes to the Shopify sidebar menu as you want, this blog is for you. In this blog, ArrowTheme will instruct you in detail on all steps about editing it. So, let’s explore right now!
What about using the Shopify sidebar menu?
You can use sidebars in a variety of ways on a website, whether it’s an eCommerce Shopify store or a regular one. You can find them alongside articles and blog posts. And, they include a range of widgets or modules that include content such as:
- Social media badges
- Links to recent and popular content
- Content categories
- Calls to action and opt-ins
- Ad blocks
When it comes to ecommerce, the sidebar is less typically utilized as a content area. Some Shopify companies prefer to change the sidebar. So that site navigation is moved from the header to the left or right side of the page.
What’s more, others alter the Shopify sidebar to highlight product and shop information, provide easy links to collections, and provide a space for customers to utilize granular filters to narrow down their product searches.
Whatever you decide to place in the sidebar, keep in mind that it may or may not be included in your Shopify store. This is owing to the fact that themes are custom-coded to fit a specific layout and style. Some themes don’t support or provide any sort of sidebar menu or pane at all.
This isn’t a native feature of the Debut Shopify theme, which comes standard with every new store. Also, older themes created before Shopify incorporated the new parts feature are unlikely to include the sidebar. When customizing your Shopify theme, if you don’t see an option to edit the sidebar, it’s possible that the sidebar functionality wasn’t coded in.
Fortunately, just because your theme doesn’t have a sidebar option doesn’t mean you can’t build one. We’ll go into that a little more later in the essay. Because some of the most popular Shopify themes offer sidebar functionality, we’ll start there.
Try the high converting Shopify themes for your eCommerce websites:
Storepify – Minimal Multipurpose Shopify Theme
Lusion – Multipurpose eCommerce Shopify Theme
How to edit the Shopify sidebar menu in your Shopify stores?
Before we get started, keep in mind that Shopify themes are likely to be coded differently, thus the option to add or alter the sidebar may work differently. To alter the sidebar of your theme’s pages, most themes with sidebar functionality will take you along a similar road. We will be using the Parallax theme from Out of the Sandbox in this example. Now, let’s refer to several steps that instruct you to alter the Shopify sidebar menu below!
#1. Go to your Shopify account and go to the Themes area
Coming to the first step, to get to this page, you must go to the left menu. And, select “Online Store”, then “Themes.”
#2. Select the button “Customize” from the drop-down menu
In the main window, locate your currently active theme and click “Customize” to launch the customization window.
#3. Select your page
You should notice a downward arrow in the upper left corner of your window to select the page you wish to edit. This usually takes you to the Home page.
So, you can choose the page where you want to update your sidebar by clicking the option like in the following image.
#4. Locate your sidebar choices
When you select your page, your Shopify sidebar menu’s options may appear in the “sections” area to the left. But, they may be coded into one of the sections. There is no sidebar shown in the settings in the following example utilizing parallax. In addition, if we go to the Collection section, though, we’ll see an option to alter the Sidebar in Shopify at the bottom of the area’s options.
Toggles for sidebar content are available in Parallax. You can utilize the “Add content” option below to add a variety of different content modules to the sidebar if you enable the sidebar. Collections, pages, categories, vendors, product types, content, and a designated navigation menu are all included.
When comparing the above image to the same Collections page section settings in the Debut theme, you’ll notice a significant change in options, as well as the absence of any sidebar option.
Simple, a free Shopify theme that uses sidebar navigation, is available. Then, you can play the sidebar option among the sections for specific pages if you follow the same modification methods as above.
Besides, change a “Sidebar” section in the above example for the Collections page template.
However, there is a drawback is that its customization is limited. The only choice for this sidebar is to select a menu because the site only uses it for navigation. Shopify does not allow you to add more parts to the sidebar.
When your Shopify theme doesn’t have a Shopify sidebar menu?
If you want to alter the sidebar in Shopify yet your theme doesn’t have any sidebar options, you should ask a prebuilt Shopify theme with a customizable sidebar for help. In fact, it is always one of the simplest ways that requires almost no coding.
Furthermore, in case you don’t want to completely rebuild your layout and simply want to add a sidebar, you may do it by changing and adding code to your Shopify theme’s template files.
Updating the specific template section file for the page that requires a sidebar, editing existing code and adding many lines of new code, and adding Liquid code to assign sections to your sidebar. Hence, you can add and edit them through your Shopify dashboard are all stages involved.
There’s no way to provide example code that works across the board. This is because the code changes from one theme to the next and from page template to page template.
Instead, you’ll need to become familiar with the HTML, CSS, and Liquid code used in Shopify layouts.
Moreover, if you wish to manage editing the code on your own, here are some wonderful resources and tutorials for you:
- Firstly, Shopify Partners Developer Resource Articles
- Secondly, Shopify Theme Code Customization Tutorials
- Shopify Liquid Cheat Sheet
To sum up, do you know how to edit the Shopify sidebar menu through things we instruct you in this blog? ArrowTheme hopes this blog will bring you the most useful information so you can work well with Shopify. If you have any question or face any problem when altering Shopify sidebar menu, let’s ArrowTheme know by filling out our CONTACT FORM. Then, we will resolve it for you.
Furthermore, we are running a big sale program that get up to 30% off for our Shopify website packages. Thus, don’t miss this opportunity, and all of your troubles will be treated at an affordable cost. Back-end Update Services, Front-end Update Services, and Custom Shopify Development are all available to you. With our support, you can easily and rapidly enhance your eCommerce website, which will help you attract more visitors.