DotNetCampania
Il primo portale campano dedicato allo sviluppo software con tecnologie Microsoft

Creazione di un sito web con Orchard - Terza Parte

Creazione di un sito web con Orchard - Terza Parte

Content Types

Creazione di un nuovo Content Type

Nella colonna sinistra della home page del sito web in esame, vengono visualizzate una serie di news che possono essere facilmente gestite da orchard creando un nuovo Content Type, cioè un nuovo tipo, che chiameremo News, che farà parte delle entità gestite dalla nostra dashboard. E possibile creare un nuovo content type accedendo alla dashboard, selezionando la voce Content, il tab Contet Type e clicccando sul pulsante Create new type.

Ci viene chiesto il nome che vogliamo dare alla nuova entità, che sarà utilizzato anche come suggerimento per l'identificativo dello stesso. Digitiamo News e confermiamo cliccando sul pulsante Create.

Ogni Content Type può essere definito da un insieme di Content Part e da un insieme di Field, dato che desideriamo creare successivamente una lista di news, indichiamo come content part da aggiungere al nostro type quella denominata Conteinable, che abilita il nostro nuovo tipo ad essere inserito all'interno di un contenitore (come le liste che vedremo tra poco) e che richiede necessariamente anche l'aggiunta della Part Common.

Cliccando sul tasto Save ci viene presentata la finestra per la gestione del nuovo Content Type, da cui possiamo aggiungere i Field necessari alla sua definizione. Cliccando sul pulsante Add Field, possiamo raggiungere la pagina per la creazione del nuovo campo, digitiamone il nome, Titolo, e indichaimo il tipo da utilizzate, attualmente l'unico installato, Text Field. Confermiamo cliccando sul tasto Save.

Per i restanti campi abbiamo bisogno di installare dei nuovi Field Type dalla Gallery, clicchiamo quindi sulla voce Modules, selezioniamo il Tab Gallery, nella casella di testo per la ricerca digitiamo la parola "field" e clicchiamo sul pulsante Search. Verrano visualizzati i vari field a disposizione  nella gallery di Orchard, installiamo DateTimeField e Html Field.

Tornando al nostro Content Type, possiamo adesso utilizzare i field installati per la crezione dei campi mancanti.

Aggiungendo quindi i field Contentuto (HtmlField) e Data (DateTimeField) abbiamo ultimato il nostro Content Type News.

Creazione di una lista

Possiamo adesso creare la lista di news che utilizzeremo per la nostra home page, cliccando sulla voce New List, settiamo il Title a News e specifichiamo che questa lista conterrà elementi di tipo News.

Creando una nuova News, selezionando la voce New News, potremo a questo punto associare la nuova entità alla lista appena creata grazie a un'apposita dropdownlist etichettata Add to. Digitiamo il contenuto della news, selezioniamo la data, indichiamo il titolo e salviamo cliccando sul pulsante Save.

Creazione di una Widget

La creazione della lista non ne determina l'automatica pubblicazione sul sito, anche perchè dobbiamo indicare dove vogliamo che venga visualizzata. Per fare questo dobbiamo creare una nuova Widget selezionando la voce Widgets dal menu principale della Dashboard, selezionare il layer su cui vogliamo lavorare, Default nel nostro caso perchè vogliamo che la lista delle news compaia in ogni pagina, e cliccare sul pulsante Add in corrispondenza della zona in cui vogliamo aggiungere la Widget, AsideFirst nel nostro caso visto che vogliamo che compaia nella colonna a sinistra rispetto al contenuto principale.

Selezioniamo il tipo di widget che vogliamo realizzare, un Container Widget in questo caso, definiamo un titolo, in questo caso Ultime News, e selezioniamo il contenitore da utilizzare, la lista News.

Cliccando sul tasto Salva otteniamo il risultato cercato:

Customizzazione del template per la Widget

Non ci resta che dare alla widget l'aspetto dettato dal template scelto dal cliente, utilizzando di nuovo i tool per designer messo a disposizione da Orchard. Lo scopo in questo caso è creare un alternate, un file cshtml alternativo da utilizzare per il rendering della widget selezionata, che ci permetta di customizzare il modo in cui viene renderizzato il contenuto della widget stessa.

Torniamo quindi in WebMatrix e andiamo ad editare il file appena creato, sostituendo Display(items) con un foreach. Questo ci permette di non lasciare al comportamento di base della widget, che aggiungerebbe dei tag di contorno che creano rumore per il nostro template, il rendering degli elementi della lista.

Generiamo infine il template per il contenuto della lista, Content-News.cshtml...

... e editiamolo in modo da generare l'html del template scelto dal cliente:

Ed ecco il risultato finale:

Nel prossimo e ultimo articolo vedremo come ultimare il sito completando il template e aggiungendo un po' di moduli dalla gallery.

Recent Comments

Leave the first comment for this page.

Associazione Culturale DotNetCampania - C.F.: 95127870632

Powered by Community Server (Commercial Edition), by Telligent Systems