# Displaying Units in the course outline on course homepage in LMS

**URL:** <https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191>\
**Category:** Design\
**Tags:** tutor, olive\
**Created:** [June 11, 2024, 11:26am UTC](https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191 "2024-06-11T11:26:07Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![harout7](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.openedx.org/harout7/32/5369_2.png) [@harout7](https://discuss.openedx.org/u/harout7)\
**Post date:** [June 11, 2024, 11:26am UTC](https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191/1 "2024-06-11T11:26:07Z")

</div>

I’m working on adding units to the course outline displayed on the course homepage in Open edX’s Olive release, using the Learning MFE.  
In previous releases, I was able to achieve this by editing the file:

```auto
openedx/features/course_experience/templates/course_experience/course-outline-fragment.html

```

However, I couldn’t locate the `course-outline-fragment.html` file or its equivalent in the Olive release

Could anyone provide guidance on how to add units to the course outline in Olive release ?

---

<div class="post-metadata">

**Author:** ![annesulpico](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.openedx.org/annesulpico/32/6497_2.png) [@annesulpico](https://discuss.openedx.org/u/annesulpico)\
**Post date:** [June 11, 2024, 12:28pm UTC](https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191/2 "2024-06-11T12:28:14Z")

</div>

In the Olive release of Open edX, the platform has transitioned to using Micro-Frontends (MFEs) for many of its functionalities, including the course outline. This means that the traditional method of editing HTML templates directly is no longer applicable.

To add units to the course outline in the Olive release using the Learning MFE, you should follow these steps:

- Access Open edX Studio
- Navigate to the Course you are working on.
- Edit the Course Outline:
  - In the course outline, you can add sections, subsections, and units directly through the Studio interface.
  - Click on “Outline” in the course navigation menu.
  - Use the “New Section” and “New Subsection” buttons to add new sections and subsections.
  - Within each subsection, you can add units by clicking on “New Unit”.

---

<div class="post-metadata">

**Author:** ![harout7](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.openedx.org/harout7/32/5369_2.png) [@harout7](https://discuss.openedx.org/u/harout7)\
**Post date:** [June 11, 2024, 12:47pm UTC](https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191/3 "2024-06-11T12:47:25Z")

</div>

Hi @annesulpico thanks for your reply.

I understand how to add sections, subsections, and units via Studio, my question is specifically about modifying the course outline on the course homepage in the LMS view to include units when it expands.

When you create a course and visit course homepage in LMS and click expand all the current outline displays sections and subsections only

```auto
Course Outline
└── Section 1
    └── Subsection 1.1
    └── Subsection 1.2
└── Section 2
    └── Subsection 2.1
    └── Subsection 2.2

```

I want to change it so it displays units too

```auto
Course Outline
└── Section 1
    └── Subsection 1.1
        └── Unit 1.1.1
        └── Unit 1.1.2
    └── Subsection 1.2
        └── Unit 1.2.1
        └── Unit 1.2.2
└── Section 2
    └── Subsection 2.1
        └── Unit 2.1.1
        └── Unit 2.1.2
    └── Subsection 2.2
        └── Unit 2.2.1
        └── Unit 2.2.2

```

---

<div class="post-metadata">

**Author:** ![vivek](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.openedx.org/vivek/32/6825_2.png) [@vivek](https://discuss.openedx.org/u/vivek)\
**Post date:** [June 11, 2024, 12:58pm UTC](https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191/4 "2024-06-11T12:58:59Z")

</div>

hi @harout7 ,  
i got your point , to achive this you need to change in `src/course-home/outline-tab/OutlineTab.jsx`  
in Learning Mfe  
and to change api reponse you can check `getOutlineTabData` in `src/course-home/data/api.js`

---

<div class="post-metadata">

**Author:** ![harout7](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.openedx.org/harout7/32/5369_2.png) [@harout7](https://discuss.openedx.org/u/harout7)\
**Post date:** [June 25, 2024, 9:46am UTC](https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191/5 "2024-06-25T09:46:58Z")

</div>

Thank you @vivek for your help to summarize the solution

1- in `lms/djangoapps/course_home_api/outline/serializers.py ` Remove the conditional check: `children = block.get('children', []) if block_type != 'sequential' else []`. This check was preventing the serializer from descending past sequential blocks

2- Edit: `src/course-home/outline-tab/SequenceLink.jsx`

3- Add new component: `src/course-home/outline-tab/UnitLink.jsx`

4- Edit: `src/course-home/outline-tab/Section.jsx`

After making the changes build the mfe image and start tutor local this will add units to the course outline on course home page.

---

<div class="post-metadata">

**Author:** ![twlichty](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.openedx.org/twlichty/32/3653_2.png) [@twlichty](https://discuss.openedx.org/u/twlichty)\
**Post date:** [December 6, 2024, 11:12am UTC](https://discuss.openedx.org/t/displaying-units-in-the-course-outline-on-course-homepage-in-lms/13191/6 "2024-12-06T11:12:59Z")

</div>

Is there any chance you can post more details about what you did in steps 2 - 4?