Changing the layout of the product category page by editing an XML file

You want to display the left bar on category pages, but you are selecting 2 columns with right bar layout in Admin -> Categories -> Update Layout XML. You have to select 2 columns with left bar.

Although, if you want to show all category pages as 2 columns with left sidebar, it's better to do this with catalog_category_view.xml.

This is default for Magento 2, unless your theme overrides it in a custom catalog_category_view.xml.

So your left sidebar should show, but the html should be like this:

<div class="columns">
    <div class="column main">
    // main content
    <div class="sidebar sidebar-main">
    // sidebar content

If you want to change the html classes of these containers, do this in catalog_category_view.xml:

<referenceContainer name="columns" htmlClass="row" />
<referenceContainer name="div.sidebar.main" htmlClass="hidden-xs col-sm-3" />
<referenceContainer name="main" htmlClass="col-xs-12 col-sm-9" />


If you want to show the category navigation in the sidebar on all category pages, insert this into catalog_catalog_view.xml:

<move element="catalog.topnav" destination="sidebar.main"/>