Clicca quì per leggere il pdf

Transcript

Clicca quì per leggere il pdf
Come inserire contenuti in Joomla!
L'esempio presuppone che sia installato l'Editor JCE e il suo plug-in
plug JCE-MediaBox.
Per scrivere il nostro articolo andiamo su Contenuti-->Gestione
Contenuti
Articoli-->Nuovo articolo e
inseriamo il titolo, il testo e tutte le altre cose che vogliamo. Supponiamo di voler inserire nel
nostro articolo anche una immagine. Posizioniamo il cursore del mouse nel punto dove la
vogliamo inserire e clicchiamo sull'icona dell'editor
dell'edito raffigurante l'immagine.
Ci apparirà in una nuova finestra il pannello di Image Manager di JCE che possiamo vedere qui sotto:
Nel riquadro superiore vedremo tutte le impostazioni da dare
all'immagine, tipo le dimensioni, l'allineamento, il margine, il
bordo, l'eventuale effetto rollover, ecc.
Nella parte sottostante vedremo le cartelle e i file presenti
dentro la cartella images di Joomla! che possiamo aver caricato
via ftp o dalla gestione media.
Clicchiamo sul file image che intendiamo inserire
in
(parte
centrale nella figura e poi confermiamo con clic su “Insert”
sotto a destra.
In generale possiamo mettere come immagine dentro al testo
una miniatura quindi la dimensione orizzontale non dovrebbe
superare i 220 pixel. Clicchiamo sul pulsante
pulsant in alto a destra
“salva e chiudi”.
Se l’immagine da inserire non si trova nella cartella “images”
di Joomla ma in una cartella nel nostro computer la dobbiamo
caricare prima nel sito e poi inserire nell’articolo. Ecco che ci viene in soccorso il pulsantino
pulsantino per l'upload che vediamo
indicato con la freccia rossa. Cliccandolo si aprirà un nuovo popup a mezzo del quale potremo scegliere l'immagine da
uploadare in Joomla! e da inserire nel nostro articolo. Questa è una funzione che non ci è consentita dall'editor
dall'e
di
default.
Possiamo adesso vedere il risultato cliccando in alto a destra su "vedi sito" e caricando la pagina dove abbiamo
memorizzato l'articolo.
Come inserire "Leggi tutto" negli articoli
Per far si che un articolo sia presentato solo parzialmente e alla fine di questa parte ci sia il link "Leggi tutto..." che ti
permette di visualizzare l'articolo per intero, basta fare questo: nell'editor dell'articolo basta cliccare (posizionare il
cursore) nel punto in cui si vuole interrompere l'articolo
l'ar
e poi fare clic sul bottone Leggi tutto (situato in fondo). Vi
apparirà una linea grigia che indica dove l'articolo viene spezzato e quindi dove inizia il link "Leggi tutto".
NOTA: se si vuole spostare la linea, non bisogna far altro che cancellarla
cancellarla (come si cancella qualsiasi altro carattere) e
reinserirla nel nuovo punto.
1
Inserire un link ad un documento interno al sito
Adesso vediamo come inserire un link. Per prima cosa dobbiamo evidenziare una parola o una frase che vogliamo far
diventare un link. Quindi dobbiamo cliccare nel classico pulsantino dell'editor JCE, il simbolo della catenella che in
questo editor ha anche il segno più ad indicare una maggior potenza e versatilità.
Infatti questo è un gestore avanzato di link.
A differenza dell'editor di default, dove potevamo solo incollare un link che già conoscevamo, potremo qui navigare tra
i contenuti che abbiamo nel sito suddivisi per categorie ed articoli.
Potremo linkare un contatto, un web-links, e anche ogni voce di menù. Potremo ovviamente anche incollare
direttamente nell'apposito box un link esterno a Joomla.
Supponiamo di voler linkare un file pdf che non abbiamo ancora
caricato in una cartella dentro images, come dovevamo fare con
l'editor di default. Anche qui (riquadrato in rosso) ci viene in
soccorso il pulsantino dell'upload premendo il quale ci apparirà il
popup che ci permetterà di sfogliare e selezionare il file da
caricare. Potremo così decidere in quel momento in quale cartella
depositare il file e anche crearne una al volo. Ed ecco che in un sol
colpo abbiamo caricato nel nostro sito un documento che abbiamo
ordinatamente collocato in una cartella adatta e lo abbiamo linkato
nel nostro articolo. Anche questa cosa non la potevamo fare in
questo modo con l'editor di default.
Con questo editor è possibile anche fare diverse operazioni sui file,
tipo copiare, cancellare, rinominare.
Inserire un link esterno per esempio un link al sito “Tecnica della Scuola”
Come al solito scriviamo l’articolo quindi cerchiamo su Internet la pagina di nostro interesse che vogliamo linkare
dall’articolo e copiamo l’indirizzo dalla barra degli indirizzi, in questo caso: http://www.tecnicadellascuola.it/
Torniamo al nostro articolo, evidenziamo il termine che vogliamo punti alla pagina che si deve aprire, in questo caso
“Tecnica della Scuola” e poi clicchiamo sul simbolo della catenella (link). Si aprirà la finestra Link. Qui, nel Campo
URL incolliamo l’indirizzo precedentemente copiato, in alternativa con il pulsante a destra “Browse” possiamo
navigare alla ricerca dell’ URL che ci interessa. Nel Campo Text compare in automatico quello che avevamo
evidenziato nell’articolo. Più in basso nel campo “Target”, dalla finestra a tendina, selezioniamo “Open in new
window” in modo da far restare sul nostro sito i visitatori alla chiusura della pagina precedentemente aperta. Per finire
clik sul pulsante “Insert”. Torniamo automaticamente così al nostro articolo, e in alto a destra facciamo clik su “Salva e
chiudi”.
Per vedere il risultato cliccare in alto a destra su "vedi sito", aggiornare la pagina e controllare il corretto
funzionamento. Se tutto è andato per il verso giusto cliccando sul collegamento si aprirà in una nuova finestra la pagina
di “Tecnica della Scuola”.
Inserire immagini negli articoli e applicare link
Entra in Amministrazione dal pannello di controllo. Apri un articolo esistente cliccando sull’icona: Gestione articoli
oppure crea uno cliccando su Nuovo Articolo.
Fai clic nel punto del testo dove vuoi inserire l’immagine. Poi clicca sull’icona “Inserisci /modifica immagine”.
Si apre il pannello Image manager da dove è possibile gestire tutte le nostre immagini e i file multimediali.
Nel campo URL possiamo inserire direttamente l’indirizzo web dell’immagine nel caso si trovasse su un altro sito.
Il testo alternativo è quella scritta che compare quando passiamo il mouse sull’immagine ed è molto importante per i
motori di ricerca.
Nel campo dimensioni possiamo indicare appunto le dimensioni nel caso volessimo delle dimensioni diverse
dall’originale. Questa impostazione cambia solo il modo di visualizzare l’immagine sulla pagina web e non modifica le
dimensioni reali dell’immagine. E’ opportuno caricare sul sito solo immagini di dimensioni ridotte per velocizzare il
caricamento delle pagine e navigare in modo fluido.
L’allineamento indica dove deve scorrere il testo. Un’anteprima è visibile sul riquadro in alto a destra.
Il margine indica quanto spazio vuoto vuoi mettere a fianco di uno o più lati.
2
Nella parte inferiore il File manager ci mostra le immagini presenti sul sito. Seleziona l’immagine che vuoi inserire
cliccando sul Nome. I campi URL e Testo alternativo vengono compilati automaticamente. Per confermare clicca su
Inserisci.
Cliccando sull’immagine e trascinando le maniglie possiamo cambiare le dimensioni di visualizzazione. Anche i
parametri nel File Manager saranno aggiornati. Impostando però manualmente le dimensioni avrai un controllo più
preciso. Clicca su aggiorna se vuoi salvare le modifiche. Clicca su Salva se vuoi salvare le modifiche all’articolo.
Vediamo il risultato nel sito.
Ora applichiamo un LINK per mostrare l’immagine originale con l’effetto pop-up.
Torna in back-end, seleziona l’immagine con un clic e poi clicca sull’icona “Inserisci/modifica link”. Si apre la finestra
per inserire i collegamenti. Ci sono diverse opzioni. E’ possibile linkare voci di menu, singoli articoli, contatti etc. In
alto a destra ci sono due icone. Clicchiamo la prima delle due, quella per linkare una immagine già presente sul sito. Si
apre nuovamente il File Manager visto in precedenza. Naviga tra le cartelle e seleziona l’immagine che vuoi venga
aperta con un clic. Clicca sul nome e poi, per confermare, su Inserisci in fondo a destra. Il campo URL è stato compilato
automaticamente con l’indirizzo dell’immagine. Nella parte inferiore della scheda, zona attributi, scrivi qualche cosa di
rappresentativo nel campo titolo. Invece nel campo Obiettivo (Target) dalla finestra a tendina scegli “Apri in una nuova
finestra”
Applichiamo adesso l’effetto pop-up
Vai alla scheda “Popups”, in alto. Nel campo “Tipo” dalla finestra a tendina seleziona “JCE MediaBox Popups”. Per
confermare il tutto clicca sul pulsante Inserisci. Clicca su Salva e vai a guardare il risultato nel front-end ricordandoti di
aggiornare la pagina. Notare che quello che avevi scritto nel campo titolo viene visualizzato sotto l’immagine.
Proviamo a linkare un video di youtube
Possiamo applicare l’effetto pop-up anche ad un link di solo testo.
Vediamo come. Torna in back-end. Scrivi qualcosa e selezionalo oppure seleziona una parte di testo già presente.
Clicca nuovamente sull’icona per inserire il link.
Proviamo a linkare un video di YouTube. Ci serve solo l’indirizzo della pagina di YouTube che contiene il video. Apri
la pagina di YouTube in una nuova scheda o in una nuova finestra del browser (si consiglia di usare sempre Firefox).
Clicca su “Condividi”. Ci appare il link al video in evidenza ma questo è il link corto che non sempre funziona. Quindi
visualizziamo le altre opzioni e attiviamo la casella “Link lungo”. Adesso puoi copiare il link lungo. Torna al tuo backend e incolla il Link nel Campo URL. Adesso scrivi qualcosa nel campo Titolo. Quindi vai alla scheda “Popups”, in
alto. Nel campo “Tipo” dalla finestra a tendina seleziona “JCE MediaBox Popups”. Infine clicca su Inserisci per
confermare il tutto. Controlliamo le modifiche nel sito. Aggiorna la pagina e clicca sul link appena inserito. Come puoi
vedere, se tutto è andato liscio, viene visualizzato solo il video in una finestra pop-up. Quello che hai scritto nel campo
titolo viene visualizzato sotto il player.
Esempio di collegamento semplice – Non pop-up
Se vuoi inserire un semplice collegamento che cliccandoci sopra apra una qualsiasi pagina web non applicare la classe
jcepopup vista in precedenza e otterrai un semplice link web senza l’effetto pop-up. Il risultato sarà un link diretto alla
pagina che avrai indicato nel campo URL.
Come inserire immagini dal nostro computer
Torna la pannello di amministrazione per modificare di nuovo il tuo articolo. Fai clic in un punto del testo dove vuoi
inserire l’immagine. Clicca sull’icona per inserire l’immagine. Scegli con un clic la cartella dove vuoi caricare la tua
immagine. Per caricare una foto dal tuo computer devi cliccare sull’icona, a fianco del punto interrogativo, con una
freccia in su. Si apre una piccola finestra. Clicca sul pulsante Browse. Cerca tra le cartelle del tuo computer e seleziona
l’immagine da caricare. Poi clicca su “apri” o doppio clic sulla selezione. Ripeti questa azione se vuoi selezionare un
altro file da caricare. Clicca su Upload per avviare il caricamento. Attenzione il file non deve essere maggiore di 10 Mb.
Ora l’immagine è stata caricata nella cartella prescelta. Inseriscila nell’articolo con la stessa procedura di prima.
Ricordati di salvare le modifiche all’articolo. Portati in front-end per vedere il risultato.
Per provare il funzionamento di Joomla collegarsi al seguente indirizzo:
http://www.jowe.it/supporto/joomla-demo.html
3