====== Crea e modifica contenuti ====== **In questa sezione**: * impara a creare una nuova pagina; * impara a scrivere contenuti per quella pagina; * impara a descrivere i contenuti per migliorare la navigazione del sito e ottimizzare le ricerche; * impara come creare collegamenti ipertestuali; * imapara a salvare una pagina come //bozza//; * impara a pubblicare una pagina sul //sito pubblicato//. **Prima di iniziare** * Assicurati di essere nella sezione **Contenuto del sito** dal menu di navigazione principale. {{ :editors:pagine.png?direct&600 |}} ===== Creare una nuova pagina ===== Per creare una nuova pagina, innanzitutto scegli in che punto del sito vuoi crearla. Se stai creando una //"sottopagina"//, dal menu di navigazione sulla sinistra (il Pannello dei contenuti in cui sono elencate le pagine del sito) clicca sulla pagina madre sotto la quale vuoi la sottopagina. Se vuoi che la pagina compaia nel menu di navigazione principale del sito dovrai cliccare la radice del sito - il primo elemento elencato nel Pannello dei contenuti. In cima al Pannello dei contenuti trovi un bottone chiamato **Crea**. Cliccaci e comparirà un menu a tendina {{ :editors:selezione_436.png?direct& |}} Esistono diversi //tipi di pagina//, quello predefinito dovrebbe essere //"Pagina"// ma potresti volerne creare un altro (ad esempio una pagina della biblioteca è il tipo pagina //"Library Page"//), nel qual caso clicca sulla tendina e seleziona quello che intendi creare, quindi clicca il pulsante verde **Vai**. Come puoi notare verrà creata una nuova pagina con un nome predefinito (ad es. //"New Page"// nel caso di un tipo pagina //Pagina//). Noterai anche che ha un colore giallo. Le pagine elencate di colore giallo sono le pagine "nuove" che non sono ancora state pubblicate). E' sufficiente cliccare sulla nuova pagina dal Pannello dei contenuti per visualizzarla nella finestra principale e poterla editare. Non ti preoccupare se hai creato la pagina nel posto "sbagliato". Le pagine possono essere spostate e riordinate in qualsiasi momento. ===== Scrivere dei contenuti ===== Dal Pannello di editing, per editare il contenuto, potresti dover cliccare sulla linguetta **Contenuto** (se non fosse già selezionata). Qui sono presenti 3 aree di inserimento: Titolo, Testo, Meta-data {{ :editors:selezione_437.png?direct&600 |}} ==== Titolo ==== Qui si trova il campo **Nome della pagina**. Questo definisce il nome con cui sarà identificata la pagina nel CMS, ma verrà anche utilizzato come titolo, etichetta di navigazione e URL predefiniti (che possono comunque essere modificati manualmente). Immediatamente sotto si trova il campo **Etichetta di navigazione**. Questa sarà l'etichetta utilizzata per mostrare la pagina nei menu di navigazione del sito pubblicato. Se inserisci prima il **Nome della pagina**, questo verrà automaticamente copiato nell'etichetta di navigazione. Solitamente potrebbe essere una buona idea lasciare i due campi uguali, anche se non necessariamente deve esser così, per questo da qui potrai cambiare l'etichetta o il nome della pagina in qualsiasi momento. ==== Testo ==== Contiene il **Contenuto** della pagina, ovvero l'intero testo che poi sarà pubblicato nella pagina. Scrivi qui il testo che vuoi far comparire sul sito. Sentiti libero di utilizzare la barra di formattazione in cima a quest'area per formattare la pagina come preferisci. == Pagine widgetizzate == Alcune pagine sono state //widgetizzate//, ovvero è possibile strutturare il contenuto al loro interno tramite [[liquens:widgets|widget]]. A queste pagine, in fase di creazione, viene automaticamente aggiunto un [[liquens:widgets#contenuto_della_pagina|widget di tipo Contenuto della pagina]] che mostra il Testo della pagina. ===== Formattare il contenuto ===== Questa è la barra di formattazione {{ :editors:selezione_438.png?direct& |}} Generalmente la maggior parte degi pulsanti della barra funzionano come funzionano in un editor di testo qualsiasi. Tuttavia ci sono alcune eccezioni. Per esempio, la tendina //Stili// vi permette di aggiungere certi stili alla pagina. Questo è principalmente utilizzato per aggiugnere stili all'immagine piuttosto che a contenuto scaricabile, come link a documenti PDF o Word, fogli di calcolo Excel, o immagini. Oppure potrebbe servirvi, ad esempio, per aggiungere dei colori al testo. La tendina //Formato// ti permette invece di selezionare il formato del paragrafo secondo gli stili HTML. La maggior parte dei paragrafi sarà nel formato comune //paragrafo// ma esistono comunque 6 livelli di //intestazione// ed altre possibilità. Le intestazioni rappresentano l'organizzazione del documento. L'intestazione 1 (H1) è considerata il livello più alto del documento, mentre l'intestazione 6 il livello più basso. Usanto il formato //Intestazione//, i paragrafi selezionati verranno automaticamente marcati come intestazioni del tipo selezionato. In questo modo, se in futuro vorrai modificare gli stili della pagina, i tuoi web designer dovranno cambiare la definizione dello stile intestazione in un solo posto, piuttosto che modificare tutte le intestazioni utilizzate nelle singole pagine. Questo permette di risparmiare un sacco di tempo! Il bottone //Testo quotato// ti permette di aggiungere una "citazione". Selezionando il testo e cliccando il bottone, il paragrafo verrà semplicemente rientrato dal margine, come avviene per le citazioni sui giornali. Infine, il pulsante //Inserisci riga orizzontale// inserirà una riga orizzontale nella pagina, e il pulsante //Inserisci caratteri speciali//, evidenziato dal simbolo dell'omega, è utilizzato per aggiungere caratteri speciali al testo. Questo è particolarmente utile per le parole straniere, come ad esempio //resumé//, nomi propri come //François// e umlauts come //Mötley Crüe//. C'è un altro bottone che richiede spiegazioni. E' il bottone chiamato //HTML//. Per addentrarti nel codice ed editare il codice sorgente della pagina direttamente, premendo il pulsante //HTML// potrai vedere e modificare il codice HTML della pagina. E' consigliabile farlo solo se hai una discreta conoscenza del linguaggio HTML. In ogni caso, potrebbe essere utile quando hai bisogno di agire direttamente sul codice della pagine per integrare, ad esempio, dei video da YouTube. == Fare copia&incolla da un programma di videoscrittura == Potresti voler inserire nella pagina del testo che magari hai già scritto in un programma di videoscrittura, come ad esempio Microsoft word. Normalmente puoi incollare qualsiasi testo da un "plain text editor" come ad esempio Notepad.exe nei sistemi Windows, TextEdit.app sui Mac, o gEdit per Ubuntu Linux, ecc. Tuttavia, incollare direttamente dalla maggior parte degli editor o altre applicazioni, comporta l'inserimento di codice formattato come //testo arricchito// che non funziona bene con il codice HTML utilizzato dai siti web. Silverstripe ha due soluzioni a questo problema. {{:editors:selezione_439.png?direct&|}} Il primo pulsante è //Incolla come testo semplice//. Incollando il testo in questo modo verrà rimossa tutta la formattazione preesistente. Il secondo è //Incolla da Word//, grazie al quale Silverstripe presnde il testo //arricchito// da Microsoft Word e cerca di tradurlo in codice HTML. In ogni caso questo funziona solo con Microsoft Word e non con altri programmi di videoscrittura come OpenOffice.ord, Word Perfect o Apple Pages. ===== Stili predefiniti ===== Utilizzando la tendina **Stili** è possibile assegnare degli stili predefiniti a porzioni di testo o interi paragrafi. DiscoveryNG propone 4 stili predefiniti: Information, Idea, Warning, Download. {{:editors:editor_styles.png?500|}} == Rimuovi stile == L'icona della //gomma da cancellare// può risultare particolarmente utile per rimuovere stili indesiderati. ===== Descrivere il tuo contenuto ===== Non si tratta solo di scrivere dei buoni contenuti in grado di informare i tuoi lettori. Hai anche bisogno di permettere ai tuoi lettori di trovare quello che stanno cercando. Puoi aiutare i tuoi lettori ha trovarlo aggiungendo //metadata//. I metadati sono blocchi specifici della pagina, normalmente nascosti alla maggior parte di browser, che i motori di ricerca possono utilizzare per classificare le pagine su internet. {{ :editors:selezione_440.png?direct&600 |}} Nel Pannello di editing della pagina che vuoi descrivere, all'interno della sezione **Contenuto** e accanto alla linguetta **Principale**, trovi la sezione **Meta-data**. In questa sezione, se vuoi, puoi cambiare l'URL della pagina per renderla più amichevole ai motori di ricerca. Puoi anche inserire una descrizione e delle parole chiave per la tua pagina. Se il tuo manager web ti ha chiesto di aggiungere alcuni metadati, è questo il posto giusto per farlo. ===== Inserire dei collegamenti ipertestuali nelle pagine ===== Per creare un link in una pagina, seleziona il testo che vuoi far diventare un link dall'area di editing (1), a premi il pulsante //Inserisci link// nella barra degli strumenti (2). Questo aprirà la //barra dei link// sulla parte destra dello schermo. ==== Creare un collegamento ad un'altra pagina del sito ==== {{ :editors:selezione_441.png?direct& |}} Per creare un link ad un'altra pagina del sito, seleziona **Pagina su questo sito** dalla lista di opzioni nella parte superiore della //barra dei link//. Puoi selezionare la pagina del sito che preferisci utilizzando il menu a tendina. Il campo //testo del collegamento// dovrebbe riempirsi automaticamente con il testo che hai selezionato nell'area di editing. Seleziona la casella //Apri il link in una nuova finestra?// se vuoi che il collegamento venga aperto in una nuova finestra del browser quando gli utenti lo cliccano. Infine, inserisci il link cliccando il pulsante **Inserisci link** nella parte bassa della barra laterale. ==== Creare un link ad una pagina esterna ==== {{ :editors:selezione_442.png?direct& |}} Per creare un collegamento ad un altro sito, seleziona **Un altro sito web** dalla lista delle opzioni in cima alla barra dei collegamenti. Puoi incollare o scrivere l'URL della pagina web che vuoi collegare nel campo **URL**. Il campo //testo del collegamento// dovrebbe riempirsi automaticamente con il testo che hai selezionato nell'area di editing. Seleziona la casella //Apri il link in una nuova finestra?// se vuoi che il collegamento venga aperto in una nuova finestra del browser quando gli utenti lo cliccano. Infine, inserisci il link cliccando il pulsante **Inserisci link** nella parte bassa della barra laterale. Le tipologie di link //interno// ed //esterno// utilizzano procedure differenti, perchè con Silverstripe, se una pagina viene spostata o cancellata, i link che puntano ad essa da altre pagine sono automaticamente modificati seconda la nuova situazione. Questo ti permette di spostare le pagine facilmente, senza doverti preoccupare della struttura del sito o dovendo controllare i //link rotti// Se inserisci l'URL di un link //interno// in un campo link //esterno//, Silvestripe di solito è abbastanza sveglio da cambiare automaticamente il link in //interno//. ==== Creare un link ad un indirizzo email ==== {{ :editors:selezione_443.png?direct& |}} Per creare un collegamento ad un indirizzo e-mail, seleziona **Indirizzo email** dalla lista delle opzioni in cima alla barra dei collegamenti. Puoi incollare o scrivere l'indirizzo e-mail che vuoi collegare nel campo **indirizzo email**. Il campo //testo del collegamento// dovrebbe riempirsi automaticamente con il testo che hai selezionato nell'area di editing. Infine, inserisci il link cliccando il pulsante **Inserisci link** nella parte bassa della barra laterale. Un'ulteriore opzione è creare un collegamento ad un file caricato sul sito (**scarica file**), come ad esempio un PDF, un file DOC, un video, insomma qualsiasi cosa che non è una pagina web. Siccome questo è un argomento un po' più avanzato, lo trovi alla pagina [[Lavorare con immagini e documenti]] ===== Salvare la pagina come Bozza ===== Per salvare la tua pagina come **Bozza**, clicca semplicemente il pulsante **Salva** (non **Salva e pubblica**, anche se è disponibile) nella parte inferiore destra del Pannello di editing. Salvare la pagina come bozza ti permette di vedere un'anteprima di come sarà pubblicata la pagina su un //Sito bozza//, disponibile solo per te e per gli atri redattori che hanno accesso al CMS, ma non visibile sul sito pubblicato. {{ :editors:selezione_444.png?direct& |}} Dopo aver salvato la pagina come bozza, puoi vedere l'anteprima cliccando il pulsante **Bozza del sito** nella parte inferiore dello schermo, sul lato sinistro della Barra delle viste. {{ :editors:selezione_445.png?direct& |}} **Ricordati di salvare subito e spesso** Una volta che decidi di pubblicare un testo sarà sufficiente cliccare il pulsante **Salva e pubblica** perchè la pagina compaia sul sito pubblicato. Per questo motivo fai attenzione a non fare errori imabarazzanti. Puoi verificare la pagina pubblicata cliccando sul link **Sito pubblicato** nella parte inferiore sinistra dello schermo. Se hai capito il flusso di pubblicazione, diviso tra //CMS// -> //Sito bozza// -> //Sito pubblicato//, non stupirti dei molti pulsanti che avrai a disposizione in ogni pagina. Servono a garantirti il pieno controllo su cosa e come vuoi pubblicare. {{ :editors:selezione_446.png?direct& |}}