Left Menu

Left menu contains below code to display menu

<aside class="left-side sidebar-offcanvas">
            <section class="sidebar purplebg">

                <div class="nav_icons">
                    <ul class="sidebar_threeicons">
                        <li><a target="_blank" href="form_builder.html"><i class="livicon" data-name="hammer" title="Form Builder 1" data-loop="true" data-color="#42aaca" data-hc="#42aaca" data-s="25"></i></a>
                        </li>
                        <li><a target="_blank" href="form_builder2.html"><i class="livicon" data-name="list-ul" title="Form Builder 2" data-loop="true" data-color="#e9573f" data-hc="#e9573f" data-s="25"></i></a>
                        </li>
                        <li><a target="_blank" href="buttonbuilder.html"><i class="livicon" data-name="vector-square" title="Button Builder" data-loop="true" data-color="#f6bb42" data-hc="#f6bb42" data-s="25"></i></a>
                        </li>
                    </ul>
                </div>
                <div class="clearfix"></div>

                <!-- sidebar menu: : style can be found in sidebar.less -->
                <ul class="sidebar-menu" id="slimscrollside">
                    <li class="blueborder">

                        <a target="_blank" href="index.html"> <i class="livicon" data-name="home" data-c="#e9573f" data-hc="#e9573f" data-size="18" data-loop="true"></i>
                            <span>Dashboard</span>
                        </a>

                    </li>
                    <li class="treeview redborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="medal" data-size="18" data-c="#42aaca" data-hc="#42aaca" data-loop="true"></i>
                            <span>Builders</span>
                            <small class="badge bg-red" style="margin-left:40px;">3</small>
                            <i class="fa fa-plus pull-right" style="margin-top:5px;"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="form_builder.html"><i class="fa fa-angle-double-right"></i>Form Builder</a>
                            </li>
                            <li><a target="_blank" href="form_builder2.html"><i class="fa fa-angle-double-right"></i>Form Builder 2</a>
                            </li>
                            <li><a target="_blank" href="buttonbuilder.html"><i class="fa fa-angle-double-right"></i>Button Builder</a>
                            </li>
                        </ul>
                    </li>
                    <li class="treeview goldborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="doc-portrait" data-c="#F6BB42" data-hc="#F6BB42" data-size="18" data-loop="true"></i>
                            <span>Forms</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="form_controls.html"><i class="fa fa-angle-double-right"></i>Form Controls</a>
                            </li>
                            <li><a target="_blank" href="editor.html"><i class="fa fa-angle-double-right"></i>Form Editors</a>
                            </li>
                            <li><a target="_blank" href="validation.html"><i class="fa fa-angle-double-right"></i>Form Validation</a>
                            </li>
                            <li><a target="_blank" href="formelements.html"><i class="fa fa-angle-double-right"></i>Form Elements</a>
                            </li>
                            <li><a target="_blank" href="formwizard.html"><i class="fa fa-angle-double-right"></i>Form Wizards</a>
                            </li>
                            <li><a target="_blank" href="accordionformwizard.html"><i class="fa fa-angle-double-right"></i>Accordion Wizards</a></li>
                        </ul>
                    </li>

                    <li class="treeview palegreenborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="brush" data-c="#37bc9b" data-hc="#37bc9b" data-size="18" data-loop="true"></i>
                            <span>UI Features</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="color.html"><i class="fa fa-angle-double-right"></i>Color Picker Slider</a>
                            </li>
                            <li><a target="_blank" href="buttons.html"><i class="fa fa-angle-double-right"></i>Buttons</a>
                            </li>
                            <li><a target="_blank" href="advanced_buttons.html"><i class="fa fa-angle-double-right"></i>Advanced Buttons</a>
                            </li>
                             <li><a target="_blank" href="tabs_accordions.html"><i class="fa fa-angle-double-right"></i>Tabs and Accordions </a>
                            </li>
                            <li><a target="_blank" href="panels.html"><i class="fa fa-angle-double-right"></i>Panels</a>
                            </li>
                            <li><a target="_blank" href="icon.html"><i class="fa fa-angle-double-right"></i>Font Icons</a>
                            </li>
                            <li><a target="_blank" href="grid.html"><i class="fa fa-angle-double-right"></i>Grid Layout</a>
                            </li>
                            <li><a target="_blank" href="carousel.html"><i class="fa fa-angle-double-right"></i>Carousel</a>
                            </li>
                            <li>
                                <a target="_blank" href="advanced_modals.html"> <i class="fa fa-angle-double-right"></i>Advanced Modals</a>
                            </li>
                            <li><a target="_blank" href="tagsinput.html"><i class="fa fa-angle-double-right"></i>Tags Input</a>
                            </li>
                            <li><a target="_blank" href="nestable.html"><i class="fa fa-angle-double-right"></i>Nestable List</a>
                            </li>
                            <li><a target="_blank" href="toastr.html"><i class="fa fa-angle-double-right"></i>Toastr Notifications</a>
                            </li>
                            <li><a target="_blank" href="session_timeout.html"><i class="fa fa-angle-double-right"></i>Session Timeout</a>
                            </li>
                            <li><a target="_blank" href="portlet_draggable.html"><i class="fa fa-angle-double-right"></i>Draggable Portlets</a>
                            </li>
                        </ul>
                    </li>
                    <li class="treeview blueborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="lab" data-c="#e9573f" data-hc="#e9573f" data-size="18" data-loop="true"></i>
                            <span>UI Components</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="general.html"><i class="fa fa-angle-double-right"></i>General Components</a>
                            </li>
                            <li><a target="_blank" href="pickers.html"><i class="fa fa-angle-double-right"></i>Pickers</a>
                            </li>
                            <li><a target="_blank" href="x-editable.html"><i class="fa fa-angle-double-right"></i>X-editable</a>
                            </li>
                            <li><a target="_blank" href="timeline.html"><i class="fa fa-angle-double-right"></i>Timeline</a>
                            </li>
                            <li><a target="_blank" href="transitions.html"><i class="fa fa-angle-double-right"></i>Transitions</a>
                            </li>
                            <li><a target="_blank" href="sliders.html"><i class="fa fa-angle-double-right"></i>Sliders</a></li>
                            <li><a target="_blank" href="knob.html"><i class="fa fa-angle-double-right"></i>Circles Sliders</a></li>
                        </ul>
                    </li>
                    <li class="treeview redborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="table" data-c="#42AACA" data-hc="#42AACA" data-size="18" data-loop="true"></i>
                            <span>DataTables</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="tables.html"><i class="fa fa-angle-double-right"></i>Simple tables</a>
                            </li>
                            <li><a target="_blank" href="datatables.html"><i class="fa fa-angle-double-right"></i>Data Tables</a>
                            </li>
                            <li><a target="_blank" href="advdatatables.html"><i class="fa fa-angle-double-right"></i>Advanced Data Tables</a>
                            </li>
                        </ul>
                    </li>

                    <li class="treeview goldborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="barchart" data-size="18" data-c="#f6bb42" data-hc="#f6bb42" data-loop="true"></i>
                            <span>Charts</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="charts.html"><i class="fa fa-angle-double-right"></i>Flot Charts</a>
                            </li>
                            <li><a target="_blank" href="piecharts.html"><i class="fa fa-angle-double-right"></i>Pie Charts</a>
                            </li>
                            <li><a target="_blank" href="advanced_charts.html"><i class="fa fa-angle-double-right"></i>Advanced Charts</a></li>
                        </ul>
                    </li>
                    <li class="palegreenborder">
                        <a target="_blank" href="calendar.html">
                            <i class="livicon" data-c="#37BC9B" data-hc="#37BC9B" data-name="calendar" data-size="18" data-loop="true"></i>
                            <span>Calendar</span>
                        </a>
                    </li>
                    <li class="treeview blueborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="image" data-c="#E9573F" data-hc="#E9573F" data-size="18" data-loop="true"></i>
                            <span>Gallery</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="gallery.html"><i class="fa fa-angle-double-right"></i>Masonry Gallery</a><li><a target="_blank" href="dropzone.html"><i class="fa fa-angle-double-right"></i>Dropzone</a>
                            </li>
                            </li>
                            <li><a target="_blank" href="imagecropping.html"><i class="fa fa-angle-double-right"></i>Image Cropping</a>
                            </li>
                            <li>
                                <a target="_blank" href="multiple_upload.html"> <i class="fa fa-angle-double-right"></i>Multiple File Upalod</a>
                            </li>
                            <li><a target="_blank" href="imgmagnifier.html"><i class="fa fa-angle-double-right"></i>Image Magnifier</a>
                            </li>
                             <li><a target="_blank" href="dropzone.html"><i class="fa fa-angle-double-right"></i>Dropzone</a>
                            </li>
                        </ul>
                    </li>


                    <li class="treeview redborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="users" data-size="18" data-c="#42AACA" data-hc="#42AACA" data-loop="true"></i>
                            <span>Users</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="users.html"><i class="fa fa-angle-double-right"></i>Users</a>
                            </li>
                            <li><a target="_blank" href="adduser.html"><i class="fa fa-angle-double-right"></i>Add New User</a>
                            </li>
                            <li><a target="_blank" href="view_user.html"><i class="fa fa-angle-double-right"></i>View User</a>
                            </li>
                            <li><a target="_blank" href="deleted_users.html"><i class="fa fa-angle-double-right"></i>Deleted Users</a>
                            </li>
                        </ul>
                    </li>

                    <li class="treeview goldborder">
                        <a target="_blank" href="#">
                            <i class="livicon" data-name="map" data-c="#f6bb42" data-hc="#f6bb42" data-size="18" data-loop="true"></i>
                            <span>Maps</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="googlemaps.html"><i class="fa fa-angle-double-right"></i>Google Maps</a>
                            </li>
                            <li><a target="_blank" href="vectormaps.html"><i class="fa fa-angle-double-right"></i>Vector Maps</a>
                            </li>
                        </ul>
                    </li>
                    <li class="treeview palegreenborder active">

                        <a target="_blank" href="#">
                            <i class="livicon" data-name="flag" data-c="#37bc9b" data-hc="#37bc9b" data-size="18" data-loop="true"></i>
                            <span>Pages</span>
                            <i class="fa fa-plus pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a target="_blank" href="lockscreen.html"><i class="fa fa-angle-double-right"></i>Lockscreen</a>
                            </li>
                            <li><a target="_blank" href="invoice.html"><i class="fa fa-angle-double-right"></i>Invoice</a>
                            </li>
                            <li><a target="_blank" href="login.html"><i class="fa fa-angle-double-right"></i>Login</a></li> <li><a target="_blank" href="login2.html"><i class="fa fa-angle-double-right"></i>Login 2</a>
                            </li><li><a target="_blank" href="login.html#toregister"><i class="fa fa-angle-double-right"></i>Register</a></li>

                             <li><a target="_blank" href="404.html"><i class="fa fa-angle-double-right"></i>404 Error</a>
                            </li>
                            <li><a target="_blank" href="500.html"><i class="fa fa-angle-double-right"></i>500 Error</a></li>
                            <li  class="active" id="active"><a target="_blank" href="blank.html"><i class="fa fa-angle-double-right"></i>Blank Page</a>
                            </li>
                        </ul>
                    </li>
                </ul>

            </section>
            <!-- /.sidebar -->
</aside>