Layout DSpace 7.6

DSpace
#1

Enquanto configuro o DSpace 7.6 aqui, notei que vocês também utilizam o DSpace para o repositório digital. Gostaria de saber se existe a possibilidade de compartilharem o layout que vocês utilizam, inclusive vi que o IFG também utiliza. Também, gostaria de saber se este layout é compatível com o 7.6. Grato!

1 curtida
#2

Olá @danielcanoli ,

Dependendo da instituição que está instalando o DSpace, pode ser que segue algum padrão de layout e identidade visual, como o caso das entidades do Governo Federal, que seguem o Padrão Digital de Governo, sendo o Design System. Em relação ao DSpace 7, estamos estudando os aspectos de layout.

#3

é para o Instituto Federal do Tocantins

#4

Atualmente estamos estudando a aplicação do layout no Angular, que é a tecnologia utilizada no DSpace 7, diferente da versão 5.7 que é utilizada no Repositório do IFG.

#5

Olá boa tarde,

Esses são alguns passos iniciais para implantar o layout no angular do DSpace 7:

  • Fazer uma cópia do diretório custom localizado em: dspace-angular/src/themes/custom. Dentro desse diretório criado terá os componentes angular localizados dentro de app, por exemplo para o cabeçalho o diretório (header) e rodapé o diretório (footer), cada um desses diretórios possuem seus arquivos(html, scss e ts).

  • No arquivo dspace-angular/angular.json aproximadamente linha 57 dentro de “styles” adicione seu tema, por exemplo o diretório (meutema):

{
     "input": "src/themes/meutema/styles/theme.scss",
     "inject": false,
     "bundleName": "meutema-theme"
},
  • No arquivo dspace-angular/config/config.prod.yml aproximadamente linha 282 adiciona seu tema em themes (nome do diretório do tema que foi criado). Exemplo:
themes:
  - name: meutema
  • Em dspace-angular/src/eager-themes.module.ts crie o module do seu tema, exemplo para meutema:

import { NgModule } from ‘@angular/core’;
import { EagerThemeModule as DSpaceEagerThemeModule } from ‘./dspace/eager-theme.module’;
import { EagerThemeModule as MeutemaEagerThemeModule } from ‘./meutema/eager-theme.module’;
// import { EagerThemeModule as CustomEagerThemeModule } from ‘./custom/eager-theme.module’;

/**
 * This module bundles the eager theme modules for all available themes.
 * Eager modules contain components that are present on every page (to speed up initial loading)
 * and entry components (to ensure their decorators get picked up).
 *
 * Themes that aren't in use should not be imported here so they don't take up unnecessary space in the main bundle.
 */
@NgModule({
  imports: [
    DSpaceEagerThemeModule,
    MeutemaEagerThemeModule,
    // CustomEagerThemeModule,
  ],
})
export class EagerThemesModule {
}

  • Pode inserir folhas de estilo do seu tema em dspace-angular/src/themes/meutema/styles

  • Pode inserir imagens do seu tema em dspace-angular/src/themes/meutema/assets/images

Importante sempre ajustar o caminho no arquivo ts dos componentes (todos indicam app/nomedocomponente) alterar comentando e descomentando para buscar o html e scss do seu tema, por exemplo no header:

@Component({
  selector: 'ds-header',
  styleUrls: ['header.component.scss'],
  //styleUrls: ['../../../../app/header/header.component.scss'],
  templateUrl: 'header.component.html',
  //templateUrl: '../../../../app/header/header.component.html',
})

Nota: Ao finalizar as modificações é necessário realizar o build da aplicação para efetivar as mudanças.

3 curtidas
#6

então, eu consegui fazer algumas alterações no layout já do 7.6, mas uma das coisas que queria era usar aqueles índices que tem no layout de vcs (autor, assunto, áreas de conhecimento, tipo de documento, data de publicacao, tipo de acesso), logo abaixo da pesquisa. Por padrão, abaixo da pesquisa aparecem as comunidades e as publicações recentes.