Personalizzazione grafica portale ReeVo Cloud Box

  • Created:
  • / Author: Antonio Giannetto

Prima di iniziare

Per personalizzare la grafica del portale ReeVo Cloudvox devono essere considerate queste linee guida:

  • La pagina di Login deve includere l’icona “Powered by CTERA” e il copyright CTERA.
  • La dimensione del logo aziendale dovrebbe essere su sfondo trasparente in formato PNG. Le dimensioni raccomandata sono 210×70 pixels.
  • Il file css.css non può essere modificato, mentre il file skins.css può essere modificato a piacimento.
  • Alcuni riferimenti obbligatori a script js (identificati con un commento ideneo) non devono essere rimossi.
  • Il file login.html deve contenere i controlli indicati nella seguente tabella:
    Control ID Tags conesentiti Note
    LoginCtrl div, img, button Deve essere presente nella pagina login.html
    ctera-ctrl div Deve essere presente nella pagina login.html
  • La struttura di base delle cartelle è la seguente:
  • Il layout dell’interfaccia web del portale “End User” e del “Team Portal Administration Control Panel” non possono essere cambiate.

Personalizzazione del portale utente (End User Portal)

Pagina di Login

La pagina di Login del portale End User può essere personalizzata modificando il file login.html nella cartella “ctera_basic_skin/EndUser” e il file skins.css nella cartella “ctera_basic_skin/EndUser/css”.

Le personalizzazioni possibili sono le seguenti:

  • Logo

    Il logo di default è quello di CTERA che può essere modificato con un logo personalizzato.

  • Colori e sfondo

    Anche in questo caso un’immagine standard e uno schema di colori standard può essere sostituito a piacere.

  • Font e dimensione carattere

    I caratteri e la loro dimensione standard può essere modificata.

  • Footer links

    In assenza di personalizzazioni il link Support e About Us punteranno al sito web di CTERA, mentre il link Legal Information punterà alla licenza di utilizzo di CTERA.

La pagina può essere modificata a proprio piacimento come nell’esempio di seguito:

In aggiunta alle personalizzazioni possibili modificando i file, è possibile modificare altri parametri del portale End User (lingua, URL di support, etc.), utilizzando il menu presente nel Portale Amministratore: Settings > Virtual Portal Settings.
L’accesso web per l’utente

Le pagine del portale End User possono essere personalizzate nella loro totalità semplicemente modificando il file skins.css nella cartella “ctera_basic_skin/EndUser/css”, come nell’esempio di seguito:

Personalizzazione del pannello di controllo del Team (Team Portal Administrative Panel)

In aggiunte alle personalizzazioni indicate nel paragrafo precendete, è possibile personalizzare anche il pannello di controllo del Team modificando opportunamente il file skins.css nella cartella “ctera_basic_skin/css“.

Le personalizzazioni possibili sono le seguenti:

  • Logo

    Il logo di default è quello di CTERA che può essere modificato con un logo personalizzato.

  • Colori e sfondo

    Anche in questo caso un’immagine standard e uno schema di colori standard può essere sostituito a piacere.

  • Font e dimensione carattere

    I caratteri e la loro dimensione standard può essere modificata.

  • Footer links

    In assenza di personalizzazioni il link Support e About Us punteranno al sito web di CTERA, mentre il link Legal Information punterà alla licenza di utilizzo di CTERA.

Di seguito un esempio:

Personalizzazione Skin

Di seguito i passi per personalizzare il file .Skin

  • Scaricare il file contenente la personalizzazione (SKIN) di base: CTERA_Base_Skin.zip.
  • Rinominare l’estensione .skin in .zip, ed estrarre il contenuto in una cartella di lavoro.
  • Personalizzare il file skins.css come desiderato.
  • Personalizzare le immagini, modificando le immagini nella cartella “ctera_base_skin/EndUser/img” oppure aggiungendone di nuove ricordandosi di referenziarle nel codice.
  • Personalizzare la pagina di Login modificando il file “ctera_base_skin/EndUser/login.html“come desiderato.
Non modificare i seguenti file:

“ctera_base_skin/EndUser/css/css.css”

“ctera_base_skin/css/css.css”

gli script js nelle cartelle “ctera_base_skin/EndUser/js” o “ctera_base_skin/js”

  • Alla conclusione delle personalizzazioni, modificare il file MANIFEST.MF impostando il paramentro “name=” con il nome della Skin.
    Per esempio: name=SkinBaseReeVo
  • Selezionare tutti i file e le sottocartelle (non la cartella padre) nella cartella di lavoro e comprimere in formato ZIP avendo cura che il nome del file sia lo stesso del parametro “name=” del passaggio precedente.
    Per esempio: SkinBaseReeVo.zip
Per il corretto funzionamento è necessario che il nome del file ZIP sia identico al nome indicato nel file “MANIFEST.ME“.
  • Rinominare l’estensione da .zip in .skin, per esempio: SkinBaseReeVo.skin
  • Inviare il file al supporto ReeVo