📄Page Structure

Symfony html.twig file structure:

Symfony

index.html.twig

{% extends 'layouts/base.html.twig' %}
{% block title %}Home{% endblock %}
{% block stylesheets %}
    <!-- map-vector css -->
    <link rel="stylesheet" href="assets/css/plugins/jsvectormap.min.css">
{% endblock %}

{% block content %}
    {{ component('breadcrumb', { breadcrumb: 'Dashboard', title: 'Home' }) }}
          
    // main content here...

{% endblock %}
{% block javascripts %} 
    <!-- [Page Specific JS] start -->
    <script src="assets/js/plugins/jsvectormap.min.js"></script>
    <script src="assets/js/plugins/world.js"></script>
    <script src="assets/js/plugins/world-merc.js"></script>
    <!-- [Page Specific JS] end -->
{% endblock %}

Layout settings

You can change the default layout in the routers/routes.js file in the body tag

```javascript
// =======================================================
// -----------   Light Able Theme Configuration  -----------
// =======================================================
const caption_show = 'true'; // [ false , true ]
const dark_navbar = 'false'; // [ false , true ]
const preset_theme = 'preset-1'; // [ preset-1 to preset-10 ]
const dark_layout = 'false'; // [ false , true , default ]
const rtl_layout = 'false'; // [ false , true ]
const box_container = 'false'; // [ false , true ]
const version = 'v1.1.0';

if (rtl_layout == "true") {
  var rtltemp = "rtl"
} else {
  var rtltemp = "ltr"
}

if (dark_layout == 'true') {
  var darklayouttemp = "dark"
} else {
  var darklayouttemp = "light"
}
if (dark_navbar == 'true') {
  var darknavbartemp = "dark"
} else {
  var darknavbartemp = "light"
}

const layout = {
  pc_caption_show: caption_show,
  pc_preset_theme: preset_theme,
  pc_dark_navbar: dark_navbar,
  pc_dark_layout: dark_layout,
  pc_rtl_layout: rtl_layout,
  pc_box_container: box_container,
  pc_theme_version: version,
  bodySetup: 'data-pc-preset="' + preset_theme + '" data-pc-sidebar-theme="' + darknavbartemp + '" data-pc-sidebar-caption="' + caption_show + '" data-pc-direction="' + rtltemp + '" data-pc-theme="' + darklayouttemp + '"',
};
```

Attribute	Description
data-pc-preset= "preset-1"	To set the your primary theme color you can change ['preset-1' to 'preset-10'] for different color.
data-pc-sidebar-theme = "light"	To set the Light color left Sidebar.
data-pc-sidebar-theme = "dark"	To set the Light color dark Sidebar.
data-pc-sidebar-caption = "true"	To set the caption on.
data-pc-sidebar-caption = "false"	To set the caption off.
data-pc-direction = "ltr"	To set the layout direction left to right.
data-pc-direction = "rtl"	To set the layout direction right to left.
data-pc-theme = "light"	To set the layout theme light.
data-pc-theme = "dark"	To set the layout theme dark.