diff --git a/course/format/templates/local/content.mustache b/course/format/templates/local/content.mustache
index ed049b92589..4a7f6608f60 100644
--- a/course/format/templates/local/content.mustache
+++ b/course/format/templates/local/content.mustache
@@ -158,7 +158,7 @@
         }
     }
 }}
-<div id="{{uniqid}}-course-format">
+<div id="course-format-{{uniqid}}">
     <h2 class="accesshide">{{{title}}}</h2>
     {{{completionhelp}}}
     <ul class="{{format}}" data-for="course_sectionlist">
@@ -202,6 +202,6 @@
 </div>
 {{#js}}
 require(['core_courseformat/local/content'], function(component) {
-    component.init('{{uniqid}}-course-format', {}, {{sectionreturn}});
+    component.init('course-format-{{uniqid}}', {}, {{sectionreturn}});
 });
 {{/js}}
diff --git a/course/format/templates/local/courseindex/cm.mustache b/course/format/templates/local/courseindex/cm.mustache
index befb520474b..8d0ca89dbd7 100644
--- a/course/format/templates/local/courseindex/cm.mustache
+++ b/course/format/templates/local/courseindex/cm.mustache
@@ -38,7 +38,7 @@
         {{^accessvisible}}dimmed{{/accessvisible}}
         {{#url}} d-flex {{/url}} {{^url}} d-flex-noedit {{/url}}
         {{#indent}} indented {{/indent}}"
-    id="{{uniqid}}-course-index-cm-{{id}}"
+    id="course-index-cm-{{id}}"
     data-for="cm"
     data-id="{{id}}"
     role="treeitem"
@@ -68,6 +68,6 @@
 </li>
 {{#js}}
 require(['core_courseformat/local/courseindex/cm'], function(component) {
-    component.init('{{uniqid}}-course-index-cm-{{id}}');
+    component.init('course-index-cm-{{id}}');
 });
 {{/js}}
diff --git a/course/format/templates/local/courseindex/courseindex.mustache b/course/format/templates/local/courseindex/courseindex.mustache
index a2009ac3b48..6842fb1a84c 100644
--- a/course/format/templates/local/courseindex/courseindex.mustache
+++ b/course/format/templates/local/courseindex/courseindex.mustache
@@ -99,13 +99,13 @@
     }
 
 }}
-<div id="{{uniqid}}-course-index" class="courseindex {{#editmode}} editing {{/editmode}}" role="tree">
+<div id="course-index" class="courseindex {{#editmode}} editing {{/editmode}}" role="tree">
     {{#sections}}
     {{> core_courseformat/local/courseindex/section }}
     {{/sections}}
 </div>
 {{#js}}
 require(['core_courseformat/local/courseindex/courseindex'], function(component) {
-    component.init('{{uniqid}}-course-index');
+    component.init('course-index');
 });
 {{/js}}
diff --git a/course/format/templates/local/courseindex/placeholders.mustache b/course/format/templates/local/courseindex/placeholders.mustache
index a2c563d2471..db15e4c237b 100644
--- a/course/format/templates/local/courseindex/placeholders.mustache
+++ b/course/format/templates/local/courseindex/placeholders.mustache
@@ -22,7 +22,7 @@
     Example context (json):
     {}
 }}
-<div data-region="loading-placeholder-content" aria-hidden="true" id="{{uniqid}}-course-index-placeholder">
+<div data-region="loading-placeholder-content" aria-hidden="true" id="course-index-placeholder">
     <ul class="media-list">
         <li class="media">
             <div class="media-body col-md-6 p-0 d-flex align-items-center">
@@ -52,6 +52,6 @@
 </div>
 {{#js}}
 require(['core_courseformat/local/courseindex/placeholder'], function(component) {
-    component.init('{{uniqid}}-course-index-placeholder');
+    component.init('course-index-placeholder');
 });
 {{/js}}
diff --git a/course/format/templates/local/courseindex/section.mustache b/course/format/templates/local/courseindex/section.mustache
index 42e910ea006..d32f27109eb 100644
--- a/course/format/templates/local/courseindex/section.mustache
+++ b/course/format/templates/local/courseindex/section.mustache
@@ -57,7 +57,7 @@
 }}
 <div
     class="courseindex-section {{#current}}current{{/current}}"
-    id="{{uniqid}}-course-index-section-{{id}}"
+    id="course-index-section-{{id}}"
     data-for="section"
     data-id="{{id}}"
     data-number="{{number}}"
@@ -119,6 +119,6 @@
 </div>
 {{#js}}
 require(['core_courseformat/local/courseindex/section'], function(component) {
-    component.init('{{uniqid}}-course-index-section-{{id}}');
+    component.init('course-index-section-{{id}}');
 });
 {{/js}}