Design Manager in SharePoint 2013: layout più semplici e pagine Master
In tutte le versioni precedenti, la creazione di pagine master e layout non era sicuramente facile per un designer considerando gli aspetti tecnici di esso. I progettisti dovrebbero comprendere SharePoint e quali componenti sono obbligatori nella pagina master e come vengono visualizzati per rendere vivi i loro progetti.
In SharePoint 2013, c’è una nuova funzionalità chiamata Design Manager che aiuterà a separare gli aspetti di progettazione dai requisiti tecnici per creare una pagina master. Designer non ha bisogno di sapere quali componenti sono necessari in una pagina master. Il Design Manager aiuta a creare la pagina principale da semplici file HTML e CSS. Il designer ora deve solo preoccuparsi del suo design e convertirlo in HTML, CSS e immagini. Una volta che questi artefatti sono pronti, il design manager può elaborarli per generare una pagina master.
Il processo per creare una pagina master è molto semplice:
1. Creare il layout che si desidera utilizzando l’editor HTML di vostra scelta.
2. Crea il file CSS che supporta il tuo progetto.
3. Aggiungi le immagini che fanno parte del tuo design.
4. Carica tutti i file nella galleria della pagina principale. (C’è un modo molto conveniente per farlo e apportare modifiche durante lo sviluppo e il tweaking del tuo HTML).
a. Aprire la galleria della pagina principale in Esplora risorse.
b. Copia la cartella html, CSS e Immagini nella galleria della pagina principale.
5. Quando si carica il file HTML, assegnare la pagina master HTML come tipo di contenuto. (facoltativo)
6. A tutti gli altri file può essere assegnato il tipo di contenuto dei file di progettazione. (facoltativo)
7. Vai alla pagina delle impostazioni del sito.
8. Fare clic su Design Manager nella categoria “Look & Feel”.
9. Oppure puoi fare clic sul pulsante Nuove azioni del sito a destra e fare clic su Gestione progetti.
10. Vai alle pagine principali di importazione.
11. Clicca sul link “Converti un file HTML in SharePoint master page”.
a. Si aprirà una finestra di dialogo per selezionare un file html dalla galleria della pagina principale.
b. Selezionare il file html appena caricato.
12. Una volta selezionato un file, SharePoint genererà una pagina master per quel progetto. Se si verificano errori durante il processo di conversione, ti avviserà.
13. A questo punto, la pagina master è stata generata.
14. Per personalizzare la pagina principale fare clic sul link “Conversione riuscita”.
a. Questo vi porterà a una pagina di anteprima. Come si può vedere dalla schermata qui sotto SharePoint ha convertito e creato la pagina master.
Aggiunta di componenti SharePoint alla pagina master utilizzando Snippets Manager:
1. Prima di personalizzare la pagina principale, nella finestra di Esplora risorse in cui è stata aperta la galleria pagina principale, aprire il file Html che hai caricato nell’editor di tua scelta.
2. Per aggiungere i componenti di SharePoint come la navigazione in alto e altri controlli, web part, fare clic sul collegamento Frammenti nell’angolo in alto a destra della pagina di anteprima.
3. Questo aprirà la pagina della galleria frammenti.
4. Supponiamo che tu voglia aggiungere la navigazione in alto alla tua pagina principale.
a. Fare clic sul pulsante di navigazione in alto nella barra multifunzione.
b. Questo creerà lo snippet HTML di cui hai bisogno.
c. Copiare il frammento negli appunti.
d. (È possibile personalizzare le proprietà del controllo di navigazione in alto e fare clic su “Aggiorna” per generare il nuovo snippet.
5. Passa al file html che hai aperto in un editor nel passaggio 1.
6. Incolla lo snippet html dove vuoi che la navigazione in alto appaia nel tuo progetto.
7. Salva il file html.
8. Aggiorna la pagina di anteprima nel tuo browser e vedrai che la pagina principale è stata generata di nuovo e le tue modifiche sono visibili.
9. In questo modo puoi creare e lavorare rapidamente sulla tua pagina principale.
10. Per pubblicare la pagina master, selezionare il file html nella galleria pagina master e pubblicarlo. Questo pubblicherà automaticamente anche il file di pagina principale e sarai in grado di impostare la pagina principale per il sito.
Schermata: la pagina master generata con la navigazione in alto.
Suggerimenti:
1. Il file html e la pagina master sono associati tra loro.
2. SharePoint non consente di eliminare la pagina master fino a quando l’associazione è ancora lì.
3. Per rimuovere l’associazione, vai alla galleria pagina principale.
a. Selezionare il file Html
b. Modifica proprietà
c. Deselezionare la casella di controllo “File associato”.
d. Salva
4. Ora puoi lavorare direttamente sulla pagina master modificandola.
5. Inoltre, mentre i file html e master sono associati, non è possibile pubblicare direttamente il file di pagina master. Devi selezionare il file html e pubblicarlo. Questo pubblicherà la pagina master e sarai in grado di impostare la pagina master per il sito.
6. Suggerimento: Una volta creata la pagina master in modo soddisfacente, disassociare il file html, impacchettare la pagina master in un wsp e quindi distribuirla negli ambienti di test e produzione.
Circa l’autore
Più da questo autore