# Understanding user interface elements in Discourse
**URL:** https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351
**Category:** Using Discourse
**Tags:** explanation, interface
**Created:** [December 3, 2018, 1:26pm UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351 "2018-12-03T13:26:04Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@Discourse](https://meta.discourse.org/u/Discourse)
#### Post date: [December 3, 2018, 1:26pm UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/1 "2018-12-03T13:26:04Z")
> đź”– This resource covers the names for each element of the Discourse user interface.
>
> 🙋 Required user level: All users
Here’s what Discourse’s interface looks like most of the time. Themes, theme components, and plugins may affect this layout.
Let’s break down the main parts, and then the main parts into smaller parts.
1. Header
2. Sidebar
3. Main content
# Header
1. Sidebar button/toggle (or Hamburger)
2. Logo
3. Top right icons:
a. Search
b. Chat toggle
c. Notifications Menu / Avatar menu
# Sidebar
1. Sections
2. New Section Button
3. Keyboard Shortcuts
# Main Content
1. Navigation / Nav bar
a. Category Selector
b. Tag selector
c. Navigation buttons
2. Topics list headers
3. Topics list
# Topic
1. Title
2. Category
3. Tags
4. Avatar
5. Username and Name
6. Edit History Button
7. Post Date
8. Post Actions
9. Reply to Post button
10. Topic Map
11. Topic Actions Buttons
12. Reply to Topic Button
13. Admin Wrench
14. Timeline
15. Reply to Topic Button
16. Notification State Button
# User Card
1. Location
2. Badge list
3. Avatar
4. Username
5. Name
6. Bio
7. Last Activity Stats
8. Website
9. Cakeday (Registration Anniversary)
10. New Personal Message Button
11. New Personal Chat Button
# Notifications menu
1. Notifications
2. All notifications
3. Replies and Mentions
4. Likes
5. Personal Messages
6. Bookmarks
7. Chat Notifications
8. Reviewable Items
9. Other Notifications
10. User Menu
11. See All Notifications Button
12. Dismiss Notifications Button
# Composer
1. Post Type Selector
2. Topic Title
3. Topic Category Selector
4. Topic Tags Selector
5. Formatting Toolbar
6. Text Area
7. Post Creation/Edition Button
8. Discard Button
9. Resizing Grip
10. Fullscreen Toggle
11. Minimize Toggle
12. Preview Panel
13. Preview Panel Toggle
> Last edited by @hugh 2024-06-28T00:04:48Z
>
> Last checked by @hugh 2024-06-28T00:04:11Z
>
> > **Check document**
> >
> > Perform check on document:
---
### Author:  [@Lew\_Grothe](https://meta.discourse.org/u/Lew_Grothe)
#### Post date: [July 10, 2023, 5:20am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/14 "2023-07-10T05:20:59Z")
Has someone created or is someone in the process of creating a similar guide for Discourse 3.x with sidebar navigation?
---
### Author:  [@albert\_vu](https://meta.discourse.org/u/albert_vu)
#### Post date: [July 10, 2023, 7:18am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/15 "2023-07-10T07:18:16Z")
This is such a godsend 🙌
---
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [July 11, 2023, 9:30am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/19 "2023-07-11T09:30:09Z")
I think we need to give this one a little refresh. Bear with us and we’ll see if we can put something together for you. 🙂
---
### Author:  [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [July 26, 2023, 10:00am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/21 "2023-07-26T10:00:03Z")
The guide was very outdated, so I updated it with new screenshots 🙂
It can be improved, so suggestions are welcome!
---
### Author:  [@Don](https://meta.discourse.org/u/Don)
#### Post date: [July 26, 2023, 10:15am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/22 "2023-07-26T10:15:53Z")
This is really great 🤗 Thanks @Canapin ❤
Little suggestion: Can it contains the composer and chat too? 🙂
---
### Author:  [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [July 26, 2023, 10:39am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/23 "2023-07-26T10:39:17Z")
11 and 12 from the notifications menu are missing.
And I noticed that in the header it is called avatar menu, but the separate heading says notifications menu
---
### Author:  [@jidanni](https://meta.discourse.org/u/jidanni)
#### Post date: [May 11, 2024, 11:36am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/24 "2024-05-11T11:36:52Z")
I’m very worried that this type of guide, no matter how well meant, is very much in danger of getting outdated, due to the (painstakingly) made screenshots and annotations. All I know is the same has been attempted for Facebook and YouTube, etc. but after a few months users can’t find certain items mentioned. I don’t have a better solution though.
---
### Author:  [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [May 11, 2024, 11:40am UTC](https://meta.discourse.org/t/understanding-user-interface-elements-in-discourse/103351/25 "2024-05-11T11:40:38Z")
Since it is a wiki, everybody can help when it needs an update. And even if some elements change, it is still helpful to know how the other elements are called.
Ultimately, any documentation can become outdated. If you don’t write documentation for this reason you have no documentation at all.