Robust Admin use JADE as template engine to generate pages and whole template quickly using node js, for getting start with JADE usage & template generating process please refer template documentation.
JADE Variables
This table contains required JADE variables to generate 3 column left sticky sidebar layout.
| Variable |
Value |
Description |
contentLayout |
'content-left-sidebar' |
You need to set contentLayout variable value as 'content-left-sidebar' in pageConfig block. |
sidebarSticky |
true |
You need to set sidebarSticky variable value as true in pageConfig block to enable left sticky sidebar. |
JADE Code
To generate content left sticky sidebar layout page or template, you need to use following JADE code.
- Line no 20-24:
pageConfig block has a template specific configuration variables, in that for 3 column layout need to define variable - var contentLayout = 'content-left-sidebar'
- Line no 25: To make left sticky sidebar
pageConfig block also require - var sidebarSticky = true configuration variables, set value as true to enable it.
- Line no 36-37:
content block has content section html file included include ../contents/layout-content-left-sticky-sidebar.html, which can be customizable on page level.
- Line no 39-40:
sidebar block has sidebar section html file included include ../contents/sidebar-common.html, which can be customizable on page level.
If you want to use this layout on page level you need to define it on page it self. This template has one example jade file for content left sticky sidebar layout-content-left-sticky-sidebar.jade, however you can use it on template level but it will generate whole template as a content left sticky sidebar.
block pageVars
- var pageTitle = "Content Left Sticky Sidebar"
- var pageSubTitle = "content layout with left sticky sidebar"
- var description = "The content layout page structure with navigation, content area and left sticky sidebar."
- var activeMenu = "content-left-sticky-sidebar"
extends template
block pageConfig
- var templateCustom = "vertical-layout vertical-menu" //- OPTIONS: menu-flipped
- var dataMenu = "vertical-menu"
- var boxedLayout = false //- OPTIONS:- true, false
- var contentLayout = 'content-left-sidebar'
- var sidebarSticky = true
//-OPTIONS:- true, false | For sticky(floating) sidebar, will affect only if there is a sidebar
append breadcrumbs
include ../includes/mixins
+breadcrumbs([{url:"index.html",name:"Home"},{url:"#",name:"Starters"}, {name:"Content Left Sidebar Sticky"}])
append page-header
include page-headers/breadcrumb-top
//- Include page content in content block
append content
include ../contents/layout-content-left-sticky-sidebar.html
append sidebar
include ../contents/sidebar-common.html
//- Page specific dependency
//------------------------------
//- Add custom page specific CSS
block pagecss
link(rel='stylesheet', type='text/css', href='robust-assets/css/plugins/ui/prism.min.css')
//- Add custom page specific JS
block pagejs
script(src='robust-assets/js/plugins/ui/prism.min.js', type='text/javascript')
