diff --git a/apps/datahub-e2e/src/e2e/datasetDetailPage.cy.ts b/apps/datahub-e2e/src/e2e/datasetDetailPage.cy.ts
index 0e9813850e..a45659c6f0 100644
--- a/apps/datahub-e2e/src/e2e/datasetDetailPage.cy.ts
+++ b/apps/datahub-e2e/src/e2e/datasetDetailPage.cy.ts
@@ -140,6 +140,16 @@ describe('dataset pages', () => {
             expect(text).not.to.equal('')
           })
       })
+      it('should display the read more button and expand description', () => {
+        cy.visit('/dataset/01491630-78ce-49f3-b479-4b30dabc4c69')
+        cy.get('datahub-record-metadata')
+          .find('[id="about"]')
+          .find('gn-ui-max-lines')
+          .as('maxLines')
+        cy.get('@maxLines').find('.ease-out').should('exist')
+        cy.get('[data-cy=readMoreButton]').click()
+        cy.get('@maxLines').find('.ease-in').should('exist')
+      })
       it('should display the thumbnail image and magnify', () => {
         cy.get('datahub-record-metadata')
           .find('[id="about"]')
diff --git a/apps/datahub/src/app/record/header-record/header-record.component.html b/apps/datahub/src/app/record/header-record/header-record.component.html
index 57c5637e7f..468272bcc0 100644
--- a/apps/datahub/src/app/record/header-record/header-record.component.html
+++ b/apps/datahub/src/app/record/header-record/header-record.component.html
@@ -32,7 +32,7 @@
     </div>
     <div
       *ngIf="metadata"
-      class="font-title text-[28px] max-w-screen-sm line-clamp-4 ml-4"
+      class="font-title text-[28px] max-w-screen-sm line-clamp-3 ml-4"
       [style.color]="foregroundColor"
     >
       {{ metadata.title }}
diff --git a/libs/ui/elements/src/lib/ui-elements.module.ts b/libs/ui/elements/src/lib/ui-elements.module.ts
index 83c6e654ca..274cbc06fe 100644
--- a/libs/ui/elements/src/lib/ui-elements.module.ts
+++ b/libs/ui/elements/src/lib/ui-elements.module.ts
@@ -10,7 +10,7 @@ import { DownloadItemComponent } from './download-item/download-item.component'
 import { DownloadsListComponent } from './downloads-list/downloads-list.component'
 import { ApiCardComponent } from './api-card/api-card.component'
 import { UiWidgetsModule } from '@geonetwork-ui/ui/widgets'
-import { UiLayoutModule } from '@geonetwork-ui/ui/layout'
+import { MaxLinesComponent, UiLayoutModule } from '@geonetwork-ui/ui/layout'
 import { TranslateModule } from '@ngx-translate/core'
 import { RelatedRecordCardComponent } from './related-record-card/related-record-card.component'
 import { MetadataContactComponent } from './metadata-contact/metadata-contact.component'
@@ -49,6 +49,7 @@ import { TimeSincePipe } from './user-feedback-item/time-since.pipe'
     ThumbnailComponent,
     TimeSincePipe,
     BadgeComponent,
+    MaxLinesComponent,
   ],
   declarations: [
     MetadataInfoComponent,
diff --git a/libs/ui/layout/src/lib/max-lines/max-lines.component.html b/libs/ui/layout/src/lib/max-lines/max-lines.component.html
index 2cdf3f4bbf..f6e70920b9 100644
--- a/libs/ui/layout/src/lib/max-lines/max-lines.component.html
+++ b/libs/ui/layout/src/lib/max-lines/max-lines.component.html
@@ -14,6 +14,7 @@
   *ngIf="showToggleButton"
   (click)="toggleDisplay()"
   class="text-secondary cursor-pointer pt-2.5"
+  data-cy="readMoreButton"
 >
   {{ (isExpanded ? 'ui.readLess' : 'ui.readMore') | translate }}
 </div>