> For the complete documentation index, see [llms.txt](https://enappd.gitbook.io/capacitor-full-app-ionic-angular/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://enappd.gitbook.io/capacitor-full-app-ionic-angular/features/startup-features/sidemenu-layouts.md).

# Sidemenu Layouts

Use various specially designed Sidemenu layouts

The app contains 5 different Sidemenu layouts which you can use in your apps.

### HTML code

The HTML code for the sidemenus is sitting in `app.component.html` itself, same as the main sidemenu. 

You can differentiate the Sidemenus by the `class="sidemenu-1"` and similar.

![](https://3608702775-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LsQWILyBp_9nWmIJ7TG%2F-LubHcolfosHFPtAz1Jw%2F-LubI4vu3Rr-061Kl3Jm%2Fassets_-La-kqVz2Uq1Ka0VUWZT_-LaG4B_wAgfEzoQz4Emi_-LaG4Ef1jBoxG-I9U2cs_Screen%20Shot%202019-03-18%20at%207.22.27%20PM.png?alt=media\&token=2f8936e7-1c81-43fc-8dea-e401ab1cdd84)

Similarly, the styles for each Sidemenu are sitting in `app.component.scss`

![](https://3608702775-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LsQWILyBp_9nWmIJ7TG%2F-LubHcolfosHFPtAz1Jw%2F-LubI4vxbeBy51XCig3o%2Fassets_-La-kqVz2Uq1Ka0VUWZT_-LaG4B_wAgfEzoQz4Emi_-LaG4HQ0lMbYFQUxpgvK_Screen%20Shot%202019-03-18%20at%207.23.48%20PM.png?alt=media\&token=1ba9189c-0e2d-43f3-a7f5-71b130aad34c)

{% hint style="info" %}
Currently, for display purpose, the Sidemenus are shown on the right hand side. But for your app usage, you can use it either on left or right side, by defining `side="end"` or `side="start"`
{% endhint %}

![](https://3608702775-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LsQWILyBp_9nWmIJ7TG%2F-LubHcolfosHFPtAz1Jw%2F-LubI4vyPtryuV1O6bCk%2Fassets_-La-kqVz2Uq1Ka0VUWZT_-LcVv6Yn80xy3CJx-z1f_-LcVvFebHTqm0Rtju9s9_sidemenu.gif?alt=media\&token=b55e7d60-0e13-4dfc-9e04-78b29b006f42)