Docsity
Docsity

Prepara i tuoi esami
Prepara i tuoi esami

Studia grazie alle numerose risorse presenti su Docsity


Ottieni i punti per scaricare
Ottieni i punti per scaricare

Guadagna punti aiutando altri studenti oppure acquistali con un piano Premium


Guide e consigli
Guide e consigli


Guida per creare e personalizzare un sito web utilizzando WordPress, Dispense di Programmazione e Tecnologie Web

Istruzioni dettagliate per installare e configurare un sito web utilizzando WordPress. Il testo copre l'installazione di WordPress, la selezione e l'attivazione di un template, la modifica del layout e la creazione di pagine e menu. Inoltre, vengono discusse le modifiche avanzate del template e l'installazione di un plugin per la gestione di una galleria fotografica.

Tipologia: Dispense

2020/2021

Caricato il 29/03/2021

Lalallero
Lalallero 🇮🇹

1 documento

1 / 12

Toggle sidebar

Questa pagina non è visibile nell’anteprima

Non perderti parti importanti!

bg1
Premessa:
Le operazioni che andiamo a svolgere possono essere fatte seguendo percorsi diversi che portano
allo stesso risultato. Per inserire pagine, modificare e aggiungere menu e widget si possono seguire
strade diverse.
1 Installare wordpress nello spazio web.
Io ho utilizzato un installatore automatico presente sul mio ISS del tipo sofoculus o altri.
2 Loggarsi come amministratore
www.sito.com/wp-admin
3 installare il template Tema (template) Twenty eleven.
cliccare su Aspetto/Temi
Aggiungi nuovo
pf3
pf4
pf5
pf8
pf9
pfa

Anteprima parziale del testo

Scarica Guida per creare e personalizzare un sito web utilizzando WordPress e più Dispense in PDF di Programmazione e Tecnologie Web solo su Docsity!

Premessa: Le operazioni che andiamo a svolgere possono essere fatte seguendo percorsi diversi che portano allo stesso risultato. Per inserire pagine, modificare e aggiungere menu e widget si possono seguire strade diverse. 1 Installare wordpress nello spazio web. Io ho utilizzato un installatore automatico presente sul mio ISS del tipo sofoculus o altri. 2 Loggarsi come amministratore www.sito.com/wp-admin 3 installare il template Tema (template) Twenty eleven. cliccare su Aspetto/Temi Aggiungi nuovo

Cercare Twenty Eleven e installarlo. Possono essere installati molti Temi ma uno solo é attivo. Per attivare il Tema Twenty Eleven adare su: Aspetto/Temi e ..... Attiva (sull´immagine del tema) 4 BENE...... prova a vedere un´anteprima del tema Noterai che il Layout della pagina é diviso in due parti , a sinistra i contenuti e a destra una colonna con diversi Widget: ARTICOLI RECENTI, COMMENTI RECENTI, ARCHIVI, CATEGORIE ..... ETC ETC. 5 Facciamo un po´ di pulizia e cancelliamo il contenuto della colonna a destra. Questi contenuti sono chiamati Widget, e possono essere inseriti in alcune aree sezioni (DIV) del Layout. Per cancellarli o inserirli andiamo su Aspetto/Widget In questa schermata vedi, a sinistra, i Widget disponibili e a destra le sezioni del Layout dove li puoi inserire o cancellare. Cancelliamo quelli dell´area "Barra laterale principale" Clicca sul triangolino rovesciato a destra del widget che vuoi cancellare e "Elimina"..... Fai la stessa cosa con tutti gli altri.

pagina o articolo fa riferimento. Il modo piú comodo é quindi quello di creare prima pagine e poi aggiungerle al menu. Iniziamo con la pagina Storia della casa Pagine/Aggiungi nuova Inserisci il titolo "Storia della casa" e come contenuto inserisci questo testo: storia della casa Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum

Salva questa pagina (Pubblica ) e

crea le altre: Attivitá, Dove siamo,

Contatti, Galleria Immagini,

Prenotazioni. (per il momento il

contenuto delle pagine non é

importante, scrivi qualche riga a

casaccio :-)

per la pagina Attivitá se vuoi puoi copiare questo testo: Attività Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum

ADESSO CI DOBBIAMO FERMARE UN ATTIMO E VEDERE COSA É SUCCESSO!!!

Visualizza il sito

Come prima cosa vediamo che nel menú sono comparse automaticamente le pagine che

abbiamo creato e che sono state ordinate (ad eccezione della Home) in ordine alfabetico.

(questa modalitá puó essere disattivata)

Il menú che stiamo vedendo é quello Principale di Default. Principale perché in questo Tema

la posizione del menú é solo quella sotto l´header. In altri temi puoi avere la possibilitá di

inserire piú menu in Div diversi del Layout. Di Default perché se non lo crei tu lo crea lui

automaticamente. Possiamo decidere di modificare quello creato da wordpress in automatico

o crearne uno noi. NE CREIAMO UNO NOI e invece della voce Home avremo "Storia della

Casa" Il menu lo ordineremo come vogliamo noi.

Creiamo il nostro menú:

vai a: Aspetto/Menu e crea un nuovo menu

Adesso devi seguire con ordine queste operazioni: 1 Nella casella di testo Nome menu scrivi : MenuSito (é quello che ho scritto io) scrivilo anche tu cosi ce lo ritroviamo uguale 2 Clicca sul bottone blu Crea Menu 3 Spunta le voci a sinistra della pagina: Storia della casa, Dove siamo, Attivitá, Contatti , Galleria immagini, Prenotazioni. 4 Clicca su Aggiungi al menu 5 Ordina le voci del menu trascinandole nell´ordine che vuoi. Io ho usato il seguente:

SECONDA PARTE Piú avanti dovremo apportare almeno una modifica all´interno dei file del nostro template. Ci sono molti file PHP e css. In alto a destra del nostro template c´é, per esempio, una casella di testo per la ricerca. Probabilmente vorremo eliminarla e per farlo dovremo modificare un file PHP. Il problema nasce quando aggiorniamo il nostro template con una nuova versione. I nostri file modificati verrebbero sovrascritti con quelli della nuova versione e le nostre modifiche andrebbero perse. Per evitare questo inconveniente bisogna creare un Tema child , cioé una copia del nostro template che conterrá soltanto i file che andiamo a modificare. Il template Child fa sempre riferimento al template genitore, tranne che per le modifiche che noi apportiamo. Questo video di 5 minuti ti spiega molto chiaramente come fare con il nostro template Twenty Eleven. https://www.youtube.com/watch?v=-baMrhOel Crea un template Child del nosto sito e attivalo. (la creazione del file Child per il momento non é strettamente necessaria, possiamo andare avanti). Cancellazione della casella di testo "Cerca" in alto nell´header In questo caso la soluzione piú semplice é utilizzare un file css personalizzato che non ci obbliga a modificare quello style.css del template. vai a: Aspetto/Personalizza Poi clicca su CSS aggiuntivo e scrivi queste righe nel CSS aggiuntivo Salva e & pubblica :-)

Installazione e utilizzo del Plugin Modula per la gestione della galleria fotografica. Vai a: Plugin/Aggiungi nuovo Nella casella in alto a destra scrivi il nome della plugin che stiamo cercando: modula Quando la trovi clicca su Installa ora. Una volta installata clicca su attiva Prima di utilizzare il plugin per la galleria vorrei che caricasi in wordPress Tutte le immagini che ci serviranno. Erano di dimensioni esagerate. Le ho rinominate, ridimensionate e compresse. Le trovi allegate alla e-mail. Devi decomprimere il file zip e mettere la cartella con le foto sul desktop. Carichiamo le foto sul nostro sito: Vai a : Media/aggiungi nuovo

Il modo piú rapido per caricarle e di trascinarle tutte insieme, da

dentro la cartella sul computer all´interno del rettangolo tratteggiato

sul sito.

Seleziona le immagini nella cartella e spostale in wordpress!

Ci vorrá qualche minuto prima che vengano caricate.

Galleria Immagini

Vai su Modula/Add Gallery (nuova voce di menu della Bacheca) Possono essere create piú gallerie con nomi diversi ed inserite falilmente in ogni pagina semplicemente inserendo nella pagina il tag specifico alla galleria..... vedremo. PER FARE UNA PROVA CREEREMO DUE GALLERIA UNA PER LE FOTO DEGLI INTERNI ED UN´ALTRA PER L´ESTERNO: Completa il form "Add New Gallery" col nome "Interni" e la descrizione "foto degli interni". (per il momento lascia il resto a 100% e 800) e clicca next. Nel form successivo scegli