Help with simple item page customisation

[donna....@canterbury.ac.nz]

Hi DSpace people,

I’m attempting to customise our simple item page in 7.6, but am failing miserably so far. I’ve been trying to follow the notes in https://wiki.lyrasis.org/display/DSDOC7x/User+Interface+Customization#UserInterfaceCustomization-CustomizethesimpleItempage and https://wiki.lyrasis.org/display/DSDOC7x/User+Interface+Customization#UserInterfaceCustomization-AddingComponentDirectoriestoyourTheme

I already have a local theme based on the dspace theme with some minor changes that are working. I’ve since copied the untyped-item.component directory into my local theme and edited untyped-item.component.ts and untyped-item.component.ts following the instructions. If I build at this point, I don’t get any errors, but I don’t see any changes in the UI.

My next step was to import the UntypedItemComponent into my theme’s eager-theme.module and declare it as an entry component as per the custom theme. If I build at this point, I get a list of errors about unknown properties and elements (an example follows)

Error: src/themes/ucrr/app/item-page/simple/item-types/untyped-item/untyped-item.component.html:4:5 - error NG8001: 'ds-mirador-viewer' is not a known element:

1. If 'ds-mirador-viewer' is an Angular component, then verify that it is part of this module.

2. If 'ds-mirador-viewer' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

4     <ds-mirador-viewer id="iiif-viewer"

      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

5                    [object]="object"

  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

6                    [searchable]="iiifSearchEnabled"

  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

7                    [query]="iiifQuery$ | async">

  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  src/themes/ucrr/app/item-page/simple/item-types/untyped-item/untyped-item.component.ts:20:16

    20   templateUrl: './untyped-item.component.html',

                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    Error occurs in the template of component UntypedItemComponent.

 

 

Can anyone provide guidance about where I’m going wrong? Would I be better off starting with the custom theme and stripping out everything I don’t need, instead of trying to add this component to the dspace theme?

Thanks again,

Donna

[Nicholas Woodward]

Hi Donna,

I recently customized the UntypedItemComponent in my custom theme and followed the notes you linked to, but I found that I had to add a few more things to eager-theme.module.ts to avoid those same errors. At the top of eager-theme.module.ts, in addition to importing the UntypedItemComponent, I had to import a few modules.

import { UntypedItemComponent } from './app/item-page/simple/item-types/untyped-item/untyped-item.component';
import { ItemPageModule } from '../../app/item-page/item-page.module';
import { DsoPageModule } from '../../app/shared/dso-page/dso-page.module';
import { ItemSharedModule } from '../../app/item-page/item-shared.module';

I also had to include the other modules in the NgModule imports.

@NgModule({
  imports: [
    CommonModule,
    SharedModule,
    SharedBrowseByModule,
    ResultsBackButtonModule,
    RootModule,
    NavbarModule,
    ItemPageModule,
    DsoPageModule,
    ItemSharedModule
  ],
  declarations: DECLARATIONS,
  providers: [
    ...ENTRY_COMPONENTS.map((component) => ({provide: component}))
  ],
})

Hope this helps,

Nick

[Donna Barber]

Thank you Nick! That’s exactly the answer I was looking for, and it’s working perfectly now 😊

 

Much appreciated!

Donna

 

From: dspac...@googlegroups.com <dspac...@googlegroups.com> On Behalf Of Nicholas Woodward
Sent: Friday, August 4, 2023 3:12 AM
To: DSpace Technical Support <dspac...@googlegroups.com>
Subject: [dspace-tech] Re: Help with simple item page customisation

 

You don't often get email from woodward.n...@gmail.com. Learn why this is important

--
All messages to this mailing list should adhere to the Code of Conduct: https://www.lyrasis.org/about/Pages/Code-of-Conduct.aspx
---
You received this message because you are subscribed to a topic in the Google Groups "DSpace Technical Support" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/dspace-tech/tPNjvkFDshU/unsubscribe.
To unsubscribe from this group and all its topics, send an email to dspace-tech...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/dspace-tech/d8132eb8-0dbb-4905-aed9-740bd8778a51n%40googlegroups.com.

This email may be confidential and subject to legal privilege, it may not reflect the views of the University of Canterbury, and it is not guaranteed to be virus free. If you are not an intended recipient, please notify the sender immediately and erase all copies of the message and any attachments.