Template with a editable sidebar

[Smilla]

I am trying to make a template with an editable sidebar. This template should be used for a lot of pages. When I edit the sidebar, I want the changes to show on all pages based on the template. Any suggestions how to do that?

[Queso]

Hello!

That's going to be something you'd want to do with CSS. Our Community here should be able to lend a hand with that, though we aren't able to help with it ourselves. What will you be using the sidebar for?

[Smilla]

Thank you, if you have a look at this example you'll see what I mean. I can of course make the sidebar with all its links and copy it to the pages where the sidebar should be but my problem to solve is what do I do when I want to change someting a add a new item to that sidabar. I have quite a few pages with different sidebars. 

[Adam7 · Accepted solution]

Have you looked at the Docs link at the top of the theme editor? It sounds like you want to add a content area which is global, so the same content is displayed on any page using the sidebar.

[TaylaM]

I am trying to add a sidebar to my page. I have created the new page layout called 'double' with this code:

<div class="content-wrapper">
    <div class="container">
        <div class="left">{left:content}</div>
        <div class="middle">{content}</div>
        <div class="right">{right:content}</div>
    </div>
</div><!-- end content-wrapper -->

Then, I added a CSS code:

/* Double Sidebar */
.main-wrap .container {
  display:flex;
  flex-wrap:nowrap;
}
.left {
  width:20%;
}
.middle {
  width:60%;
  padding:0 1.5em;
  box-sizing:border-box;
}
.right {
  width:20%;
}
@Media screen and (max-width:767px) {
  .main-wrap .container {
    flex-direction:column;
  }
  .left,
  .middle,
  .right {
    width:100%;
    margin-bottom:2em;
  }
  .left {
    order:2;
  }
  .middle {
    order:1;
  }
  .right {
    order:3;
  }
}​
 

When I save, I get the sidebars on the top and the bottom rather than on the sides.