bootstrap-layout/docs/src/html/pages/sidebar/toggle.html

Bootstrap layout with sidebar navigation, sidebar skins, sidebar transition, custom scrollbars, sidebar menus and other advanced features and utilities

---
title: Sidebar toggle
slug: sidebar/toggle
path: ../
---
{% extends "layouts/default.html" %}

{% block page %}
<h1>{{ title }}</h1>

<div class="card card-block">
  <ul class="nav nav-pills">
    <li class="nav-item">
      <a href="#usage" data-toggle="pill" class="nav-link active">Usage</a>
    </li>
    <li class="nav-item">
      <a href="../demo/layout-basic.html" target="_blank" class="nav-link">Demo</a>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane active" id="usage">
      <blockquote>
        Add the <code>data-toggle="sidebar"</code> and <code>data-target="#sidebar-id"</code> attributes to any element.
      </blockquote>

      {% include 'code/sidebar-toggle/button.html' %}
    </div>
  </div>
</div>

<h2>JavaScript</h2>
<div class="card card-block">
  <ul class="nav nav-pills">
    <li class="nav-item">
      <span class="nav-link active">Methods</span>
    </li>
  </ul>
  {% include 'reference/js/methods/sidebar-toggle.html' %}
</div>
{% endblock %}