Symfony Folder Structure
- Admin
-
templates
- components
-
layouts
- _body.html.twig / Body tag with attributes is stored in this common file.
- _footer.html.twig
- _head-css.html.twig / added common css files link in this file.
- _horizontal.html.twig / horizontal layout set in this file.
- _main.html.twig
- _menu.html.twig
- _right-sidebar.html.twig / Contain the right sidebar theme customization HTML code.
- _sidebar.html.twig / Sidebar menu-related code is in this file.
- _topbar.html.twig / Topbar-related code is in this file.
- _vendor-scripts.html.twig / Common js files are linked in this file.
- base.html.twig
- layouts-horizontal.html.twig
- layouts-vertical.html.twig
- layouts-without-nav.html.twig
- All HTML twig pages
Symfony file structure
{% extends 'layouts/base.html.twig' %}
{% block title %}Test Page{% endblock %}
{% block stylesheets %}
{% endblock %}
{% block content %}
{{ component('breadcrumb', { pagetitle: 'Skote', title: 'Test Page' }) }}
<div>
</div>
{% endblock %}
{% block javascripts %}
{% endblock %}
<script src="assets/js/app.js">
{% endblock %}
Layout setup
You can set the default layout in the templates/layouts/_main.html.twig
file in the html tag.
<html data-topbar="light" data-layout-size="boxed">
data-sidebar-size="small" | To set small layout size. |
---|---|
data-layout-size="boxed" | To set boxed layout size. |
data-bs-theme="light" | To set Light layout mode. |
data-bs-theme="dark" | To set Dark layout mode. |
data-topbar="light" | To set the Light color of Topbar. |
data-topbar="dark" | To set the dark color of Topbar. |
data-topbar="colored" | To set the colored Topbar. |