Index: lams_admin/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_admin/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_admin/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_admin/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_admin/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_admin/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_admin/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_admin/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_admin/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_admin/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_admin/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_admin/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_admin/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_admin/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_admin/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_gradebook/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_gradebook/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_gradebook/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_gradebook/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_gradebook/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_gradebook/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_gradebook/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_gradebook/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_gradebook/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_gradebook/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_gradebook/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_gradebook/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_gradebook/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_gradebook/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_gradebook/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_learning/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_learning/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_learning/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_learning/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_learning/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_learning/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_learning/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_learning/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_learning/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_learning/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rc568507be7453ecbf1f7e0b10ccddbf2bdf60fe1 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_learning/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision c568507be7453ecbf1f7e0b10ccddbf2bdf60fe1)
+++ lams_learning/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,6 +2,7 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
@@ -50,13 +51,21 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
         <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
 	        <script>
 	            const LAMS_URL = '<lams:LAMSURL/>',
-	                decoderDiv = $('<div />');
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
 	            var commandWebsocketHookTrigger = null,
 	                commandWebsocketHook = null;
 	
@@ -85,25 +94,27 @@
     <body class="component">
 	    <div class="component-page-wrapper">
 	    	<c:if test="${showHeader}">
-				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
 					<div class="offcanvas-body">
-						<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
 						
 			            <span class="lams-logo mt-3">
-			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
 			            </span>
 					
 			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
 			                <div class="offcanvas-title py-3">
-			                	Support activities
+			                	<fmt:message key='label.support.activities'/>
 			                </div>
 			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
 			                </ul>
 			            </div>
 			
-						<div class="offcanvas-bar lcard pb-3">
+						<div class="offcanvas-bar lcard pb-3 mb-3">
 				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-				            	My progress
+				            	<fmt:message key='label.my.progress'/>
 				            </div>
 				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
 				            </ul>
@@ -113,7 +124,9 @@
 			</c:if>
 	
 			<div class="component-page-content">
-	            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
 	
 				<c:if test="${showHeader}">
 		            <header id="header" class="d-flex justify-content-between" role="banner">
@@ -122,39 +135,41 @@
 									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
 									aria-controls="component-offcanvas"
 									aria-labelledby="offcanvas-progress-bar-title"
-									title="Your lesson completion">
+									title="<fmt:message key='label.your.lesson.completion'/>">
 								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
 							</button>
 		
-		                    <h1 id="lesson-name" title="Lesson name"></h1>
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
 		                </div>
 		                
 		                <div class="top-menu">
 		                    <button id="profile-picture" class="no-decoration px-3" type="button"
-		                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
 		                    </button>
 		                    
 		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-		                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
 									aria-controls="component-offcanvas"
 									aria-labelledby="offcanvas-progress-bar-title"
-									title="Your lesson completion">
+									title="<fmt:message key='label.your.lesson.completion'/>">
 		                        <div class="row m-0">
 		                            <div class="col-6 text-start p-0">
-		                                Progress
+		                                <fmt:message key='label.progress'/>
 		                            </div>
-		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
 		                        </div>
 		                        <div class="progress mt-1 mb-2">
-		                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-		                                 aria-valuemin="0" aria-valuemax="100"></div>
-		                        </div>
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
 		                    </button>
 		                    
 		                    <c:if test="${not isIntegrationLogin}">
-		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
 		                    </c:if>
 		                </div>
 		            </header>
@@ -163,7 +178,7 @@
 	            <main class="p-3" id="component-main-content" tabindex="-1">
 	                <c:if test="${not empty title && !hideTitle}">
 	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
-	                    	<span title="Activity name">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
 	                    		<c:out value="${title}" escapeXml="true" />
 	                    	</span>
 	                    </${showHeader ? 'h2' : 'h1'} >
@@ -181,23 +196,26 @@
 		                <div class="modal-body">
 		                </div>
 		                <div class="modal-footer">
-		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
 		                </div>
 		            </div>
 		        </div>
 		    </div>
 		
-		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-		    </div>
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
 		
 		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
 		        <div class="d-flex">
 		            <div class="toast-body"></div>
-		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
 		        </div>
 		    </div>
 	    </c:if>
-
     </body>
 </lams:html>
Index: lams_learning/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_learning/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_learning/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_monitoring/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_monitoring/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_monitoring/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_monitoring/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_monitoring/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_monitoring/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_monitoring/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_monitoring/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_monitoring/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_monitoring/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_monitoring/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_monitoring/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_monitoring/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_monitoring/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_monitoring/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_assessment/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_assessment/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_assessment/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_assessment/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_assessment/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_assessment/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_assessment/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_assessment/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_assessment/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_assessment/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_assessment/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_assessment/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_assessment/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_assessment/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_assessment/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_chat/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_chat/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_chat/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_chat/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_chat/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_chat/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_chat/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_chat/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_chat/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_chat/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_chat/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_chat/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_chat/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_chat/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_chat/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_daco/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_daco/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_daco/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_daco/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_daco/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_daco/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_daco/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_daco/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_daco/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_daco/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_daco/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_daco/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_daco/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_daco/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_daco/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_doku/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_doku/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_doku/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_doku/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_doku/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_doku/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_doku/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_doku/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_doku/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_doku/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_doku/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_doku/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_doku/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_doku/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_doku/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_forum/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_forum/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_forum/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_forum/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_forum/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_forum/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_forum/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_forum/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_forum/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_forum/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_forum/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_forum/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_forum/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_forum/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_forum/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_gmap/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_gmap/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_gmap/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_gmap/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_gmap/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_gmap/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_gmap/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_gmap/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_gmap/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_gmap/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_gmap/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_gmap/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_gmap/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_gmap/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_gmap/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_images/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_images/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_images/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_images/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_images/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_images/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_images/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_images/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_images/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_images/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_images/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_images/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_images/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_images/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_images/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_imscc/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_imscc/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_imscc/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_imscc/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_imscc/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_imscc/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_imscc/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_imscc/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_imscc/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_imscc/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_imscc/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_imscc/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_imscc/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_imscc/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_imscc/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_lamc/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_lamc/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_lamc/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_lamc/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_lamc/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_lamc/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_lamc/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_lamc/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_lamc/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_lamc/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_lamc/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_lamc/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_lamc/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_lamc/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_lamc/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_laqa/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_laqa/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_laqa/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_laqa/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_laqa/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_laqa/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_laqa/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_laqa/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_laqa/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_laqa/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_laqa/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_laqa/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_laqa/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_laqa/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_laqa/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_larsrc/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_larsrc/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_larsrc/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_larsrc/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_larsrc/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_larsrc/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_larsrc/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_larsrc/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_larsrc/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_larsrc/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rc568507be7453ecbf1f7e0b10ccddbf2bdf60fe1 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_larsrc/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision c568507be7453ecbf1f7e0b10ccddbf2bdf60fe1)
+++ lams_tool_larsrc/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,6 +2,7 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
@@ -50,13 +51,21 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
         <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
 	        <script>
 	            const LAMS_URL = '<lams:LAMSURL/>',
-	                decoderDiv = $('<div />');
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
 	            var commandWebsocketHookTrigger = null,
 	                commandWebsocketHook = null;
 	
@@ -85,25 +94,27 @@
     <body class="component">
 	    <div class="component-page-wrapper">
 	    	<c:if test="${showHeader}">
-				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
 					<div class="offcanvas-body">
-						<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
 						
 			            <span class="lams-logo mt-3">
-			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
 			            </span>
 					
 			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
 			                <div class="offcanvas-title py-3">
-			                	Support activities
+			                	<fmt:message key='label.support.activities'/>
 			                </div>
 			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
 			                </ul>
 			            </div>
 			
-						<div class="offcanvas-bar lcard pb-3">
+						<div class="offcanvas-bar lcard pb-3 mb-3">
 				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-				            	My progress
+				            	<fmt:message key='label.my.progress'/>
 				            </div>
 				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
 				            </ul>
@@ -113,7 +124,9 @@
 			</c:if>
 	
 			<div class="component-page-content">
-	            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
 	
 				<c:if test="${showHeader}">
 		            <header id="header" class="d-flex justify-content-between" role="banner">
@@ -122,39 +135,41 @@
 									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
 									aria-controls="component-offcanvas"
 									aria-labelledby="offcanvas-progress-bar-title"
-									title="Your lesson completion">
+									title="<fmt:message key='label.your.lesson.completion'/>">
 								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
 							</button>
 		
-		                    <h1 id="lesson-name" title="Lesson name"></h1>
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
 		                </div>
 		                
 		                <div class="top-menu">
 		                    <button id="profile-picture" class="no-decoration px-3" type="button"
-		                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
 		                    </button>
 		                    
 		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-		                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
 									aria-controls="component-offcanvas"
 									aria-labelledby="offcanvas-progress-bar-title"
-									title="Your lesson completion">
+									title="<fmt:message key='label.your.lesson.completion'/>">
 		                        <div class="row m-0">
 		                            <div class="col-6 text-start p-0">
-		                                Progress
+		                                <fmt:message key='label.progress'/>
 		                            </div>
-		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
 		                        </div>
 		                        <div class="progress mt-1 mb-2">
-		                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-		                                 aria-valuemin="0" aria-valuemax="100"></div>
-		                        </div>
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
 		                    </button>
 		                    
 		                    <c:if test="${not isIntegrationLogin}">
-		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
 		                    </c:if>
 		                </div>
 		            </header>
@@ -163,7 +178,7 @@
 	            <main class="p-3" id="component-main-content" tabindex="-1">
 	                <c:if test="${not empty title && !hideTitle}">
 	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
-	                    	<span title="Activity name">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
 	                    		<c:out value="${title}" escapeXml="true" />
 	                    	</span>
 	                    </${showHeader ? 'h2' : 'h1'} >
@@ -181,23 +196,26 @@
 		                <div class="modal-body">
 		                </div>
 		                <div class="modal-footer">
-		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
 		                </div>
 		            </div>
 		        </div>
 		    </div>
 		
-		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-		    </div>
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
 		
 		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
 		        <div class="d-flex">
 		            <div class="toast-body"></div>
-		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
 		        </div>
 		    </div>
 	    </c:if>
-
     </body>
 </lams:html>
Index: lams_tool_larsrc/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_larsrc/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_larsrc/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_leader/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_leader/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_leader/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_leader/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_leader/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_leader/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_leader/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_leader/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_leader/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_leader/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_leader/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_leader/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_leader/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_leader/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_leader/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_mindmap/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_mindmap/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_mindmap/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_mindmap/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_mindmap/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_mindmap/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_mindmap/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_mindmap/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_mindmap/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_mindmap/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_mindmap/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_mindmap/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_mindmap/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_mindmap/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_mindmap/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_nb/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_nb/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_nb/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_nb/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_nb/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_nb/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_nb/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_nb/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_nb/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_nb/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -re35d32548668a6cc323a779ee6d9b5c0a567e147 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_nb/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision e35d32548668a6cc323a779ee6d9b5c0a567e147)
+++ lams_tool_nb/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,6 +2,7 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
@@ -50,13 +51,21 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
         <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
 	        <script>
 	            const LAMS_URL = '<lams:LAMSURL/>',
-	                decoderDiv = $('<div />');
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
 	            var commandWebsocketHookTrigger = null,
 	                commandWebsocketHook = null;
 	
@@ -87,7 +96,7 @@
 	    	<c:if test="${showHeader}">
 				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
 					<div class="offcanvas-body">
-						<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" 
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
 								aria-label="<fmt:message key='label.close' />" 
 								title="<fmt:message key='label.close' />"></button>
 						
@@ -103,7 +112,7 @@
 			                </ul>
 			            </div>
 			
-						<div class="offcanvas-bar lcard pb-3">
+						<div class="offcanvas-bar lcard pb-3 mb-3">
 				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
 				            	<fmt:message key='label.my.progress'/>
 				            </div>
Index: lams_tool_nb/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_nb/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_nb/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_notebook/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_notebook/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_notebook/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_notebook/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_notebook/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_notebook/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_notebook/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_notebook/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_notebook/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_notebook/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_notebook/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_notebook/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_notebook/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_notebook/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_notebook/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_pixlr/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_pixlr/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_pixlr/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_pixlr/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_pixlr/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_pixlr/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_pixlr/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_pixlr/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_pixlr/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_pixlr/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_pixlr/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_pixlr/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_pixlr/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_pixlr/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_pixlr/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_preview/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_preview/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_preview/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_preview/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_preview/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_preview/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_preview/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_preview/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_preview/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_preview/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_preview/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_preview/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_preview/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_preview/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_preview/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_sbmt/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_sbmt/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_sbmt/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_sbmt/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_sbmt/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_sbmt/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_sbmt/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_sbmt/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_sbmt/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_sbmt/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_sbmt/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_sbmt/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_sbmt/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_sbmt/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_sbmt/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_scratchie/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scratchie/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_scratchie/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_scratchie/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scratchie/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_scratchie/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_scratchie/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scratchie/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_scratchie/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_scratchie/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scratchie/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_scratchie/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_scribe/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scribe/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_scribe/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_scribe/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scribe/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_scribe/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_scribe/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scribe/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_scribe/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_scribe/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scribe/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_scribe/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_scribe/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_scribe/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_scribe/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_spreadsheet/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_spreadsheet/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_spreadsheet/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_spreadsheet/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_spreadsheet/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_spreadsheet/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_spreadsheet/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_spreadsheet/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_spreadsheet/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_spreadsheet/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_spreadsheet/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_spreadsheet/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_spreadsheet/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_spreadsheet/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_spreadsheet/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_survey/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_survey/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_survey/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_survey/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_survey/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_survey/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_survey/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_survey/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_survey/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_survey/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_survey/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_survey/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_survey/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_survey/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_survey/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_task/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_task/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_task/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_task/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_task/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_task/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_task/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_task/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_task/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_task/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_task/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_task/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_task/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_task/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_task/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_vote/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_vote/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_vote/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_vote/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_vote/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_vote/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_vote/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_vote/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_vote/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_vote/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_vote/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_vote/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_vote/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_vote/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_vote/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_whiteboard/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_whiteboard/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_whiteboard/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_whiteboard/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_whiteboard/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_whiteboard/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_whiteboard/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_whiteboard/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_whiteboard/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_whiteboard/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_whiteboard/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_whiteboard/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_whiteboard/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_whiteboard/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_whiteboard/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_wiki/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_wiki/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_wiki/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_wiki/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_wiki/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_wiki/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_wiki/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_wiki/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_wiki/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_wiki/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_wiki/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_wiki/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_wiki/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_wiki/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_wiki/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_tool_zoom/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_zoom/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_zoom/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_tool_zoom/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_zoom/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_tool_zoom/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_tool_zoom/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_zoom/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_tool_zoom/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_tool_zoom/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_zoom/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_tool_zoom/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_tool_zoom/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_tool_zoom/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_tool_zoom/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"
Index: lams_www/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_www/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_www/web/WEB-INF/tags/Comments.tag	(.../Comments.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -15,7 +15,6 @@
 <%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
 <%@ attribute name="embedInAccordian" required="false" rtexprvalue="true"%>
 <%@ attribute name="accordionTitle" required="false" rtexprvalue="true"%>
-<%@ attribute name="bootstrap5" required="false" rtexprvalue="true"%>
 
 <c:if test="${empty width}">
 	<c:set var="width" value="100%" />
@@ -73,7 +72,7 @@
 
 <script>
 	$(document).ready(function(){
-		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&newUI=${bootstrap5}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
+		var url='<lams:LAMSURL/>comments/init.do?externalID=${toolSessionId}&externalSecondaryID=${toolItemId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}&anonymous=${anonymous}';
 		
 		<c:choose>
 			<c:when test="${embedInAccordian}">
Index: lams_www/web/WEB-INF/tags/LeaderDisplay.tag
===================================================================
diff -u -r0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_www/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 0ebe63b978acffe32a0c7e4a2cd63cfadf73cc96)
+++ lams_www/web/WEB-INF/tags/LeaderDisplay.tag	(.../LeaderDisplay.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -9,22 +9,21 @@
 <%@ attribute name="userId" required="true" rtexprvalue="true"%>
 
 <c:if test="${empty idName}">
-	<c:set var="idName" value="alert-leader${userId}" />
+	<c:set var="idName" value="alert-leader-${userId}" />
 </c:if>
 
 <c:if test="${empty messageKey}">
 	<c:set var="messageKey" value="label.group.leader" />
 </c:if>
 
-<div class="row g-0">
-	<div class="col-12 offset-sm-2 col-sm-8">
-		<div id="${idName}" class="alert alert-info leader-display">
-			<span class="fs-5 fw-bold">
-				<fmt:message key="${messageKey}">
-					<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
-				</fmt:message>&nbsp;
-				<lams:Portrait userId="${userId}"/>
-			</span>
-		</div>
+<div id="${idName}" class="col-12 offset-sm-2 col-sm-8">
+	<div class="alert alert-info leader-display text-center">
+		<span class="fs-5 fw-semibold">
+			<fmt:message key="${messageKey}">
+				<fmt:param><c:out value="${username}" escapeXml="true"/></fmt:param>
+			</fmt:message>
+			&nbsp;
+			<lams:Portrait userId="${userId}"/>
+		</span>
 	</div>
 </div>
Index: lams_www/web/WEB-INF/tags/Notebook.tag
===================================================================
diff -u -r955865d255f86a5447f729ec1ce573b2b6f94b27 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_www/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 955865d255f86a5447f729ec1ce573b2b6f94b27)
+++ lams_www/web/WEB-INF/tags/Notebook.tag	(.../Notebook.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -85,7 +85,7 @@
 					<div class="row g-0"><div class="col-12"></div></div>
 					<lams:Comments toolSessionId="${toolSessionID}"
 								   toolSignature="lanb11" likeAndDislike="${likeAndDislike}" readOnly="true"
-								   pageSize="10" sortBy="1" bootstrap5="true"/>
+								   pageSize="10" sortBy="1"/>
 				</c:if>
 			</c:if>
 		
Index: lams_www/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -rb6e8dca20bffba9ce751b917ab4af7b252115f67 -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_www/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision b6e8dca20bffba9ce751b917ab4af7b252115f67)
+++ lams_www/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -2,10 +2,15 @@
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
 
 <%@ attribute name="toolSessionID" required="true" rtexprvalue="true"%>
 <%@ attribute name="title" required="false" rtexprvalue="true"%>
 <%@ attribute name="refresh" required="false" rtexprvalue="true"%>
+<%@ attribute name="hideHeader" required="false" rtexprvalue="true"%>
+<c:set var="showHeader">${empty hideHeader ? true : false }</c:set>
+<%@ attribute name="hideTitle" required="false" rtexprvalue="true"%>
+<c:set var="hideTitle">${empty hideTitle ? false : true }</c:set>
 <%@ attribute name="lessonID" required="false" rtexprvalue="true"%>
 
 <c:set var="lams"><lams:LAMSURL /></c:set>
@@ -46,146 +51,171 @@
         <script src="<lams:LAMSURL/>includes/javascript/bootstrap5.bundle.min.js"></script>
         <lams:JSImport src="learning/includes/javascript/gate-check5.js" />
         <lams:JSImport src="includes/javascript/websocket.js" />
-        <lams:JSImport src="learning/includes/javascript/learnerPage.js" />
         <lams:JSImport src="includes/javascript/dialog5.js" />
         <lams:JSImport src="includes/javascript/common.js" />
-        <script>
-            const LAMS_URL = '<lams:LAMSURL/>',
-                decoderDiv = $('<div />');
-            var commandWebsocketHookTrigger = null,
-                commandWebsocketHook = null;
-
-            $(document).ready(function (){
-                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
-            		lessonID = ${empty lessonID ? 'null' : lessonID};
-                initLearnerPage(toolSessionID, lessonID);
-            });
-
-            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
-                let currentTime = new Date().getTime(),
-                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
-                // check if autosave does not happen too often
-                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
-                    // this label is required only in tool which implement autosave
-                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
-                    return false;
-                }
-                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
-                return true;
-            }
-        </script>
+        <c:if test="${showHeader}">
+        	<lams:JSImport src="learning/includes/javascript/learnerPage.js" />
+	        <script>
+	            const LAMS_URL = '<lams:LAMSURL/>',
+	                decoderDiv = $('<div />'),
+	                LABEL_CLICK_TO_OPEN = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.click.to.open' /></spring:escapeBody>",
+	                LABEL_SUPPORT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.support.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.activity' /></spring:escapeBody>",
+	                LABEL_CURRENT_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.activity' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_ACTIVITY = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.activity' /></spring:escapeBody>",
+	                LABEL_COMPLETED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.completed.gate' /></spring:escapeBody>",
+	                LABEL_CURRENT_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.current.gate' /></spring:escapeBody>",
+	                LABEL_NOT_STARTED_GATE = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='label.not.started.gate' /></spring:escapeBody>";
+	            var commandWebsocketHookTrigger = null,
+	                commandWebsocketHook = null;
+	
+	            $(document).ready(function (){
+	                const toolSessionID = ${empty lessonID ? toolSessionID : 'null'},
+	            		lessonID = ${empty lessonID ? 'null' : lessonID};
+	                initLearnerPage(toolSessionID, lessonID);
+	            });
+	
+	            function preventLearnerAutosaveFromMultipleTabs(autosaveInterval) {
+	                let currentTime = new Date().getTime(),
+	                    lamsAutosaveTimestamp = +localStorage.getItem('lamsAutosaveTimestamp');
+	                // check if autosave does not happen too often
+	                if (autosaveInterval > 0 && lamsAutosaveTimestamp && lamsAutosaveTimestamp + autosaveInterval/2 > currentTime) {
+	                    // this label is required only in tool which implement autosave
+	                    alert('<fmt:message key="label.prevent.learner.autosave.mutliple.tabs" />');
+	                    return false;
+	                }
+	                localStorage.setItem('lamsAutosaveTimestamp', currentTime);
+	                return true;
+	            }
+	        </script>
+        </c:if>
     </lams:head>
 
     <body class="component">
-    <div class="component-page-wrapper">
-		<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="Side menu">
-			<div class="offcanvas-body">
-				<button type="button" class="btn-close float-end" data-bs-dismiss="offcanvas" aria-label="Close"></button>
-				
-	            <span class="lams-logo mt-3">
-	                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="false"/>
-	            </span>
+	    <div class="component-page-wrapper">
+	    	<c:if test="${showHeader}">
+				<div class="offcanvas offcanvas-start" tabindex="-1" id="component-offcanvas" aria-label="<fmt:message key='label.side.menu' />">
+					<div class="offcanvas-body">
+						<button type="button" class="btn-close float-end me-1" data-bs-dismiss="offcanvas" 
+								aria-label="<fmt:message key='label.close' />" 
+								title="<fmt:message key='label.close' />"></button>
+						
+			            <span class="lams-logo mt-3">
+			                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="<fmt:message key='label.lams.logo' />" aria-hidden="false"/>
+			            </span>
+					
+			            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
+			                <div class="offcanvas-title py-3">
+			                	<fmt:message key='label.support.activities'/>
+			                </div>
+			                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
+			                </ul>
+			            </div>
 			
-	            <div id="offcanvas-support-bar" class="offcanvas-bar lcard d-none pb-3">
-	                <div class="offcanvas-title py-3">
-	                	Support activities
-	                </div>
-	                <ul id="support-bar-items" class="progress-bar-items list-group text-start">
-	                </ul>
-	            </div>
+						<div class="offcanvas-bar lcard pb-3 mb-3">
+				            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
+				            	<fmt:message key='label.my.progress'/>
+				            </div>
+				            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
+				            </ul>
+			            </div>
+					</div>
+				</div>
+			</c:if>
 	
-				<div class="offcanvas-bar lcard pb-3">
-		            <div class="offcanvas-title py-3" id="offcanvas-progress-bar-title">
-		            	My progress
+			<div class="component-page-content">
+	            <a href="#component-main-content" class="visually-hidden-focusable p-2">
+	            	<fmt:message key='label.skip.to.main.content'/>
+	            </a>
+	
+				<c:if test="${showHeader}">
+		            <header id="header" class="d-flex justify-content-between" role="banner">
+		                <div class="d-flex">
+							<button class="no-decoration" id="hamb" type="button" accesskey="p" 
+									data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+								<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+							</button>
+		
+		                    <h1 id="lesson-name" title="<fmt:message key='label.lesson.name'/>"></h1>
+		                </div>
+		                
+		                <div class="top-menu">
+		                    <button id="profile-picture" class="no-decoration px-3" type="button"
+		                            onclick="javascript:showMyPortraitDialog()" title="<fmt:message key='label.your.portrait'/>" >
+		                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="<fmt:message key='label.your.portrait'/>">
+		                    </button>
+		                    
+		                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
+		                    		data-bs-toggle="offcanvas" 
+		                    		data-bs-target="#component-offcanvas"
+									aria-controls="component-offcanvas"
+									aria-labelledby="offcanvas-progress-bar-title"
+									title="<fmt:message key='label.your.lesson.completion'/>">
+		                        <div class="row m-0">
+		                            <div class="col-6 text-start p-0">
+		                                <fmt:message key='label.progress'/>
+		                            </div>
+		                            <div class="col-6 text-end p-0" id="progress-bar-widget-value"></div>
+		                        </div>
+		                        <div class="progress mt-1 mb-2">
+		                        	<div class="progress-bar bg-success" role="progressbar"
+		                            		aria-valuemin="0" 
+		                        			aria-valuemax="100"></div>
+		                    	</div>
+		                    </button>
+		                    
+		                    <c:if test="${not isIntegrationLogin}">
+		                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" 
+		                    			title="<fmt:message key='label.close.and.return'/>"></a>
+		                    </c:if>
+		                </div>
+		            </header>
+	            </c:if>
+	
+	            <main class="p-3" id="component-main-content" tabindex="-1">
+	                <c:if test="${not empty title && !hideTitle}">
+	                    <${showHeader ? 'h2' : 'h1'} class="mb-3">
+	                    	<span title="<fmt:message key='label.activity.name'/>">
+	                    		<c:out value="${title}" escapeXml="true" />
+	                    	</span>
+	                    </${showHeader ? 'h2' : 'h1'} >
+	                </c:if>
+					
+	                <jsp:doBody/>
+	            </main>
+	        </div>
+	    </div>
+	
+		<c:if test="${showHeader}">
+		    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
+		        <div class="modal-dialog  modal-dialog-centered">
+		            <div class="modal-content">
+		                <div class="modal-body">
+		                </div>
+		                <div class="modal-footer">
+		                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">
+		                    	<fmt:message key='label.cancel'/>
+		                    </button>
+		                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">
+		                    	<fmt:message key='label.confirm'/>
+		                    </button>
+		                </div>
 		            </div>
-		            <ul id="progress-bar-items" class="progress-bar-items list-group text-start">
-		            </ul>
-	            </div>
-			</div>
-		</div>
-
-		<div class="component-page-content">
-            <a href="#component-main-content" class="visually-hidden-focusable p-2">Skip to main content</a>
-
-            <header id="header" class="d-flex justify-content-between" role="banner">
-                <div class="d-flex">
-					<button class="no-decoration" id="hamb" type="button" accesskey="p" 
-							data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-						<i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
-					</button>
-
-                    <h1 id="lesson-name" title="Lesson name"></h1>
-                </div>
-                
-                <div class="top-menu">
-                    <button id="profile-picture" class="no-decoration px-3" type="button"
-                            onclick="javascript:showMyPortraitDialog()" title="Your portrait" >
-                        <img class="portrait-sm portrait-round" src="${pageLearnerPortraitSrc}" alt="Your profile portrait">
-                    </button>
-                    
-                    <button type="button" id="progress-bar-widget" class="no-decoration d-none d-sm-none d-md-block"
-                    		data-bs-toggle="offcanvas" data-bs-target="#component-offcanvas"
-							aria-controls="component-offcanvas"
-							aria-labelledby="offcanvas-progress-bar-title"
-							title="Your lesson completion">
-                        <div class="row m-0">
-                            <div class="col-6 text-start p-0">
-                                Progress
-                            </div>
-                            <div class="col-6 text-end p-0" id="progress-bar-widget-value">
-                            </div>
-                        </div>
-                        <div class="progress mt-1 mb-2">
-                            <div class="progress-bar bg-success" role="progressbar" aria-label="Progress bar widget"
-                                 aria-valuemin="0" aria-valuemax="100"></div>
-                        </div>
-                    </button>
-                    
-                    <c:if test="${not isIntegrationLogin}">
-                    	<a href="/" id="return-to-index" class="btn-close btn-sm float-end ms-3" title="Close and return to the course page"></a>
-                    </c:if>
-                </div>
-            </header>
-
-            <main class="p-3" id="component-main-content" tabindex="-1">
-                <c:if test="${not empty title}">
-                    <h2 class="mb-3">
-                    	<span title="Activity name">
-                    		<c:out value="${title}" escapeXml="true" />
-                    	</span>
-                    </h2>
-                </c:if>
-				
-                <jsp:doBody/>
-            </main>
-        </div>
-    </div>
-
-    <div id="confirmationDialog" class="modal dialogContainer fade" tabindex="-1" role="dialog">
-        <div class="modal-dialog  modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-body">
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" id="confirmationDialogCancelButton">Cancel</button>
-                    <button type="button" class="btn btn-primary" id="confirmationDialogConfirmButton">Confirm</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container">
-    </div>
-
-    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
-        <div class="d-flex">
-            <div class="toast-body"></div>
-            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-        </div>
-    </div>
-
+		        </div>
+		    </div>
+		
+		    <div class="toast-container position-fixed top-0 start-50 translate-middle-x p-3" id="toast-container"></div>
+		
+		    <div id="toast-template" class="toast align-items-center bg-white" role="alert" aria-live="assertive" aria-atomic="true">
+		        <div class="d-flex">
+		            <div class="toast-body"></div>
+		            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" 
+		            		aria-label="<fmt:message key='label.close'/>"></button>
+		        </div>
+		    </div>
+	    </c:if>
     </body>
 </lams:html>
Index: lams_www/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f -r76e2ef1e524594fd572167511caaf8c713027922
--- lams_www/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 08f3c0dbe338d8b4ce9590bd1efd24a8d301e00f)
+++ lams_www/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
@@ -196,8 +196,8 @@
 					<div class="d-flex align-items-center">
 						<div class="flex-grow-1">
 							<textarea name="comment" rows="2" id="comment-textarea-${itemRatingDto.itemId}" class="form-control comment-textarea"
-									placeholder="<fmt:message key="label.comment.textarea.tip"/>"
-									aria-label="<fmt:message key="label.comment.textarea.tip"/>"></textarea>
+									placeholder="<fmt:message key="label.rating.textarea.tip"/>"
+									aria-label="<fmt:message key="label.rating.textarea.tip"/>"></textarea>
 						</div>
 						<div>
 							<button class="btn btn-secondary btn-sm add-comment add-comment-new ms-2"