Show sidebar on Web Pages

Hi,

Is there any way to show sidebar on custom Web Pages that I create on /www folder ?

Thanks

Hi @aldoblack,

if you create the web page from the webpage function, there is a function for the sidebar. Simply define your sidebar and use it.

Create a new web page from Website


Save webpage and create a sidebar definition

Define the sidebar and save

Make sure to check “Show sidebar” and “Published” and check the new site…

Hope this helps…

I wanted to do this in code, not in ERPNext. But Thanks anyway,

Hi @aldoblack,

in that case, that might be helpful (put inside the <div class="container">):

<div class="page-container" id="page-website-with-sidebar" 
   data-path="website-with-sidebar" data-doctype="Web Page">
  <div class="sidebar-block">
    <div class="web-sidebar">
      <!-- <div class="your-account-info-sidebar">
      <div class="row">
        <div class="col-xs-2">
          <span class="user-image-sidebar"></span>
        </div>
        <div class="col-xs-10">
          <div class="web-sidebar-user">Max Power</div>
            <a href="/?cmd=web_logout">
              <div class="text-muted small">Logout</div>
            </a>
          </div>
        </div>
      </div> -->
      <div class="sidebar-items">
        <ul class="list-unstyled">	
          <li class="sidebar-item">
            <a href="/blog" class="gray ">Blog</a>
          </li>	
            <li class="sidebar-item">
              <a href="/me">My Account</a>
            </li>	
          </ul>
        </div>
      </div> 
    </div>
    <div class="page-content with-sidebar">
      <div class="page-content-wrapper">
        <div class="row page-head">
          <div class='col-sm-12'></div>
          <div class="col-sm-8 col-xs-6">
            <h1>Website with sidebar</h1>
          </div>
          <div class="col-sm-4 col-xs-6"></div>
        </div>
        <div class="page_content">
          <div class="webpage-content">
            <article class="web-page-content" id="website-with-sidebar" style="text-align: Left">
This is a webpage with a sidebar<br>
            </article>
          </div>
        </div>
      </div>
      <!-- sidebar ends -->
    </div>
  </div>
</div>

Hope this helps.

All you have to do is just put

context.show_sidebarar = 1

on python code of web page and it show automatically.

1 Like