Skip to end of metadata
Go to start of metadata

Sommario

Introduzione

Il look & feel di IRIS è basato sul framework Bootstrap a cui viene applicato un tema adattativo chiamato Londinium.

Il layout è a colonna singola o a doppia colonna (colonna di navigazione sulla sinistra, collassabile).

CSS e immagini

L’Ateneo può personalizzare gli stili CSS e le immagini (logo e immagini mostrate nella home page e nell’intestazione del portale pubblico). 

Le risorse si raggiungono con il percorso: "Visione completa" > Configurazione > Portale pubblico > CMS > Cartella “sr”.

La cartella “sr” ha la seguente struttura:

e contiene i seguenti file:

/sr/cineca/css/cineca.css
/sr/cineca/images/interface/logo_instance.png
/sr/cineca/images/interface/logo_iris_small_narrowed.png
/sr/cineca/images/wallpaper/au_slide1_w1000.jpg
/sr/cineca/images/wallpaper/au_slide2_w1000.jpg
/sr/cineca/images/wallpaper/au_slide..._w1000.jpg
/sr/cineca/images/wallpaper/news_1120x400_trasparent_01.png
/sr/cineca/images/wallpaper/news_1120x400_trasparent_02.png
/sr/cineca/images/wallpaper/news_1120x400_trasparent_...png
/sr/londinium/css/londinium-theme.css
/sr/londinium/css/styles.css

Esempi di css standard sono i seguenti:

cineca.css

londinium-theme.css

styles.css

ma per vedere i file aggiornati è più opportuno seguire il percorso sopraindicato e scaricare i file dalla propria installazione di IRIS.

Personalizzazione delle immagini

Nuove immagini possono essere sovrascritte a quelle precaricate, mantenendo però il nome originario e l’eventuale sequenza numerica riportata nel nome stesso.

L’immagine logo_instance.png corrisponde al logo mostrato in alto a destra della home page del portale pubblico e ha dimensioni indicative di 350x100 pixel.

L’immagine logo_iris_small_narrowed.png corrisponde al logo mostrato a sinistra in alto nell’intestazione e ha dimensioni indicative di 170x40 pixel.

Le immagini che ruotano in sequenza automatica (carosello) alla voce “Prodotti recenti” della home page del portale pubblico, hanno nome news_1120x400_trasparent_01.png, news_1120x400_trasparent_02.png, etc. e dimensioni come indicato nel nome del file (1120x400 pixel).

Le immagini che ruotano in sequenza automatica (carosello) al logout hanno nome au_slide1_w1000.jpg, au_slide2_w1000.jpg, etc. e dimensioni indicative di 800x400 pixel o più.

 

In verde le immagini personalizzabili nell'intestazione e nella home page del portale pubblico:

Personalizzazione dei CSS

La sequenza secondo cui i CSS sono chiamati nella costruzione delle pagine è:

  1. londinium-theme.css
  2. styles.css
  3. cineca.css

una regola CSS definita in cineca.css viene renderizzata per ultima, ovvero sostituisce una definizione precedente o la sovrascrive.

CSS: londinium-theme.css

Questo CSS contiene il reset degli stili e le formattazioni degli elementi principali, fra cui:

  • body
  • link
  • titoli
  • liste
  • navbar
  • menu dropdown
  • form
  • progress bar
  • alert
  • tooltip
  • popover
  • paginazioni
  • tabelle
  • thumbnail.

CSS: styles.css

Questo CSS contiene alcuni stili aggiuntivi o per funzionalità specifiche, fra cui:

  • widget
  • chart e statistiche
  • sidebar
  • navigazione
  • breadcrumb
  • footer
  • plugin
  • file upload
  • datatable
  • datepicker
  • editor WYSIHTML5
  • lightbox.

CSS: cineca.css

Questo CSS contiene stili aggiuntivi o di riscrittura rispetto ai precedenti.

Se ad esempio si vuole imporre un colore diverso dal bianco ai link di un dato livello di navigazione basta aggiungere in cineca.css la stessa classe utilizzata nei CSS precedenti, ma con un valore differente della proprietà color:

 

lasciando invariati, quando possibile, gli stili del tema in uso.

 

Personalizzazione delle news

Attraverso l'editing delle news è possibile personalizzare l'aspetto di alcune parti dell'archivio.

Per accedere all'editing delle news occorre accedere alla Visione Completa e quindi portarsi in Configurazione, Portale Pubblico, edit news.

 

Attraverso la form successiva è possibile scegliere quale contenuto modificare.

In particolare 

  • Testo statico di presentazione (top news) si riferisce al contenuto della home page;
  • Testo statico dopo componente: nuove immissioni si riferisce al testo che compare alla fine del processo di censimento di un nuovo prodotto;
  • Testo statico dopo componente: faccette si riferisce al contenuto della home page visualizzato dopo le faccette;
  • News desktop prodotti si riferisce alle note che si vogliono far visualizzare nel desktop prodotti degli utenti. Non sono personalizzabili per i sigoli utenti, quindi tutti vedono lo stesso testo. È utile, ad esempio, se si devono dare indicazioni sulle scadenze o sul modo di censire i prodotti;

Ad esempio, se si vuole inserire in home page un riquadro con i link utili occorre scegliere di "Testo statico dopo componente: faccette" e quindi cliccare sul pulsante modifica.

Attraverso la form successiva inserire il codice html per modificare il contenuto della news.

 

Quindi cliccare sul pulsante "Salva" per rendere effettive le modifiche.

Personalizzazione del titolo della home page

La modifica del titolo della home page è attuabile attraverso una richiesta all'Help Desk di IRIS.


Personalizzazione delle schede

Attraverso la funzionalità Layout Sheda è possibile modificare i metadati che compongono la visualizzazione delle schede per le varie tipologie di prodotto.

Per utilizzarlo occorre essere utenti amministratori in Visione Completa e portarsi in Configurazione, Prodotti, Layout Scheda.


Attraverso la form successiva è possibile scegliere quale scheda modificare, scegliendo il tipo di visualizzazione (semplice o completa) e la tipologia di prodotto. Nell’esempio sottostante si sceglie di agire sulla scheda completa di tipo "Articolo in rivista".


 

Cliccando su Visualizza viene mostrato il set di metadati che compongono la scheda scelta. I metadati che hanno attiva la spunta "Mostra" sono quelli che vengono mostrati nella scheda selezionata.

 

Quando un campo ha la spunta "Mostra" attiva è possibile agire sul menu a tendina Tipologia per definirne il layout. Ad esempio, se si sceglie il layout date per il metadato date.issued, questo verrà visualizzato con la formattazione di una data (ad es. 10-feb-2015).

Una volta apportate le modifiche occorre cliccare sul tasto Salva a fondo pagina per renderle attive.

Infine, l'ordine in cui i metadati con la spunta "Mostra" attiva compaiono nella form di modifica ricalca quello in cui saranno visualizzati nella scheda. Questa lista è modificabile attraverso il drag&drop sui singoli metadati.




I campi Usato e In Uso sono a utilizzo interno del team HelpDesk di IRIS.


 

  • No labels