{"id":237,"date":"2009-10-24T15:56:18","date_gmt":"2009-10-24T13:56:18","guid":{"rendered":"http:\/\/www.scuolacooperativa.net\/wordpress\/?page_id=237"},"modified":"2009-10-24T15:56:18","modified_gmt":"2009-10-24T13:56:18","slug":"il-sito-scuola-aperta-sul-web","status":"publish","type":"page","link":"https:\/\/icripalimosani.edu.it\/site\/tutorial\/il-sito-scuola-aperta-sul-web\/","title":{"rendered":"– Il sito “Scuola Aperta Sul Web”"},"content":{"rendered":"

\"logo<\/a><\/p>\n

Il modello di sito creato in WordPress per Porte aperte sul web \u00e8 una realizzazione fortemente personalizzata,\u00a0 ma in realt\u00e0 tutte le modifiche fatte coinvolgono unicamente i files del tema, su un’installazione standard della piattaforma.<\/p>\n

Personalizzazione dei men\u00f9 di navigazione<\/h3>\n

La maggior parte delle modifiche riguarda il sistema di navigazione. La decisione del gruppo di lavoro \u00e8 stata infatti quella di offrire un modello di sito che affiancasse alla navigazione principale, basata sulla struttura dei contenuti suddivisi per argomento, una navigazione per tipologia di utenza.<\/p>\n

\"topbar\"<\/a>La navigazione per tipologia di utenza e la navigazione contestuale sono state ottenute aggiungendo del codice ai files che compongono il tema, anche se possono essere ottenuti risultati analoghi con i plugin presentati nella sezione di questo tutorial\u00a0 dedicata all’arricchimento <\/em>di un sito WordPress<\/a>.<\/p>\n

La navigazione per tipologia di utenza appare evidente dalla barra di navigazione orizzontale, la topbar<\/em> che invita il navigatore a intraprendere il percorso di navigazione relativo alla categoria a cui appartiene. Essa \u00e8 stata ottenuta con il comando:<\/p>\n

wp_list_pages('include=2,5,7,9&title_li=');<\/pre>\n
Questa istruzione, che sfrutta il tag di WordPress wp_list_pages<\/a>, permette di visualizzare, accanto al link alla home page, link alle pagine che hanno ID 2, 5, 7 e 9, ossia le pagine Studenti<\/em>, Famiglie<\/em>, Docenti <\/em>e Personale ATA<\/em>, che sono la porta di ingresso ai rispettivi men\u00f9 di navigazione.<\/p>\n
\"sezione<\/a>Si tratta di men\u00f9 contestuali che si aprono in alto sulla destra e restano aperti in tutte le pagine della sezione relativa alla tipologia di utenza a cui si riferiscono. Anche questi sono stati ottenuti con delle istruzioni in PHP: oltre al tag wp_list_pages \u00e8 stato utilizzato anche wp_ list_categories<\/a>, dal momento che alcune delle etichette che fanno parte dei men\u00f9 non sono link a pagine, ma a categorie di articoli, come ad esempio News Studenti<\/em>, o Circolari Docenti<\/em> e simili.<\/p>\n
Oltre alle liste di link, per la creazione dei men\u00f9 contestuali sono stati utilizzati anche i Tag Condizionali, per far s\u00ec che ogni men\u00f9 sia visualizzato solo in determinate pagine. All’interno del files rightsidebar.php \u00e8 stato quindi inserito tutto il codice relativo ai men\u00f9 di ciascuna sezione con le istruzioni relative alle condizioni di visualizzazione.<\/p>\n
\"cliccare<\/a>
cliccare sull'immagine per ingrandire<\/figcaption><\/figure>\n
Allo stesso modo sono stati creati anche i men\u00f9 delle sezioni In evidenza<\/em>, che contiene le voci Circolari <\/em>(ID 6) e News<\/em> (ID3)<\/p>\n
wp_list_categories ('include=6,3&hide_empty=0&sort_column=menu_order&title_li=');<\/pre>\n
Scuola<\/em>, che contiene tutte le sottopagine della pagina Scuola <\/em>(ID11)<\/p>\n
wp_list_pages('child_of=11&sort_column=menu_order&depth=1&title_li=');<\/pre>\n
Segreteria<\/em> (ID57)<\/p>\n
 wp_list_pages('child_of=57&sort_column=menu_order&depth=1&title_li=');<\/pre>\n
e Didattica<\/em> (ID59),<\/p>\n
wp_list_pages('child_of=59&sort_column=menu_order&depth=1&title_li=');<\/pre>\n
che costituiscono la navigazione principale del sito e sono stati inseriti prima della funzione che gestisce la presenza dei widget<\/p>\n
if ( function_exists('dynamic_sidebar') && dynamic_sidebar(1) ) :<\/pre>\n
\"menu<\/a>E allo stesso modo \u00e8 stato costruito anche il men\u00f9 relativo alle pagine “di servizio” nella barra in alto sopra l’header.<\/p>\n
Se si desiderano ottenere men\u00f9 personalizzati e men\u00f9 contestuali come quelli qui presentati, si possono utilizzare i gi\u00e0 citati plugin Menubar <\/a>e Widget Logic<\/a>.<\/p>\n
Non \u00e8 comunque troppo complicato gestire il codice per la creazione manuale di menu. Ciascuno dei men\u00f9 \u00e8 stato creato richiamando il numero ID delle pagine o delle categorie da elencare. Se si effettuano modifiche alle pagine o se si vuole ricreare men\u00f9 simili bisogna tener presente il numero ID delle pagine o categorie che si vogliono presenti nell’elenco.<\/p>\n
Nel caso di bisogno, si consiglia comunque di copiare il codice direttamente dal file, aperto con un editor, e non da questa pagina, dove \u00e8 indicato solo a scopo dimostrativo, ma dove \u00e8 necessario apportare modifice, o togliere i tag di contenimento, per evitare anomalie di visualizzazione da parte del browser.<\/p>\n
Come ottenere l’ID delle pagine in WordPress?<\/h3>\n
\"id<\/a>A partire dalla versione 2.5 WordPress non mostra pi\u00f9 gli ID di pagine, categorie, post, nella pagina di gestione degli stessiche all’interno del pannello di amministrazione.<\/p>\n
Per recuperare l’ID di un elemento e necessario leggere l’indirizzo che appare nella barra dei collegamenti quando, sempre sulla pagina di gestione di pagine\/post\/categorie, si passa con il mouse sulla voce che interessa.<\/p>\n
La gerarchia del template<\/h3>\n
\"files<\/a>In un tema WordPress solo il file index.php \u00e8 obbligatorio, ma di norma esistono anche il file header.php, sidebar.php e footer.php. Nel file index.php, ad ogni modo, sono contenute tutte le istruzioni su come deve essere visualizzata la pagina, sia essa una pagina statica, un articolo o un archivio di articoli.<\/p>\n
Tuttavia, se lo si desidera, \u00e8 possibile diversificare l’aspetto in base alla tipologia di contenuto: oltre a sfruttare le potenzialit\u00e0 dei Tag condizionali (is_ page, is_category, …) \u00e8 possibile inserire nel tema altri files, con i quali impostare le opzioni di visualizzazione. \u00c8 possibile ad esempio creare un file category.php; se ci si trova su una pagina di categoria, WordPress verificher\u00e0 l’esistenza o meno di questo tipo di file: se esiste verranno visualizzate le informazioni in esso contenute, altrimenti la visualizzazione seguir\u00e0 lo standard di index.php.<\/p>\n
Per essere ancora pi\u00f9 specifici \u00e8 possibile creare una pagina category-ID.php, dove ID sta per il numero ID di una specifica categoria. Se ci si trova in una qualunque pagina di categoria WordPress utilizzer\u00e0 le opzioni di visualizzazione contenute in category.php, ma se la categoria\u00a0 \u00e8 quella contrassegnata dall’ID in questione, allora verranno visualizzate le informazioni contenite in category-ID.php.<\/p>\n
Questo sistema di selezione del file da visualizzare \u00e8 detto Gerarchia dei Template<\/a> ed offre ulteriori opportunit\u00e0 di personalizzazione rispetto ai Tag Condizionali.<\/p>\n
I nostri template di categoria<\/h3>\n
\"visualizzazione<\/a>Nel nostro tema abbiamo creato un file category.php che visualizza i post contenuti in una specifica categoria (ad esempio News<\/em>) in modo pi\u00f9 conciso rispetto a quello di default. Abbiamo creato poi i files category-6.php, category-12.php e category-13.php per visualizzare rispettivamente le circolari, le circolari per docenti e le circolari per personale ATA.\u00a0 Per queste categorie \u00e8 stata scelta una visualizzazione tabellare, che permette un veloce sguardo d’insieme.<\/p>\n
Sia per l’elenco lineare di articoli che per la tabella \u00e8 stato scelto di pubblicare, se questo \u00e8 presente, l’abstract dell’articolo stesso (excerpt).<\/p>\n
I template di pagina<\/h3>\n
\"wordpress-page-template\"<\/a>Anche per le pagine si possono definire temlate differenziati, ma il meccanismo \u00e8 leggermente diverso. Se si vuole che una pagina o una serie di pagine visualizzi il proprio contenuto in modo diverso dalle altre, tutto quello che si deve fare \u00e8 creare una pagina con le opzioni di visualizzazione che si desiderano, da tenere come modello. Si pu\u00f2 salvare la pagina con il nome che si desidera, anche se \u00e8 prassi abbastanza comune far precedere il nome da un prefisso del tipo “tmpl<\/em>-“, ma all’inizio del file devono essere contenuto del codice che aiuti WordPress a riconoscerlo come un template:<\/p>\n
\/*\nTemplate Name: Nome-del-template\n*\/<\/pre>\n
Quando si crea una nuova pagina o la si modifica, tra gli attributi della pagina sar\u00e0 possibile scegliere anche il template.<\/p>\n
\"pagina<\/a>Tra le pagine con template speciali del nostro sito ci sono le pagine Formazione<\/em>, Materiali<\/em>, News<\/em>, Circolari <\/em>e Modulistica <\/em>che indirizzano verso le relative pagine di categoria, diversificate a seconda della tipologia di utenza.<\/p>\n
Un’altra pagina per la quale abbiamo utilizzato i template di pagina \u00e8 la pagina della mappa del sito, per la quale \u00e8 previsto, dopo un eventuale contenuto, di visualizzare l’elenco gerarchico di tutte le pagine e di tutte le categorie presenti nel sito, su due colonne, ottenuti coi tag wp_list_pages e wp_list_categories.<\/p>\n
In realt\u00e0 per ottenere semplici personalizzazioni della visualizzazione dei contenuti delle diverse pagine non \u00e8 necessario creare template di pagina: basterebbe poter inserire del codice PHP direttamente nei post. Questo non \u00e8 possibile in una installazione base di Worpress, ma \u00e8 possibile con il plugin Exec PHP<\/a>. Con questo plugin \u00e8 possibile richiamare la lista di determinate pagine o categorie all’interno del testo di una pagina o articolo.<\/p>\n
La home page<\/h3>\n
Lo stesso discorso vale per la Home page. In scuola Aperta Sul Web abbiamo scelto di visualizzare una pagina statica come Home page del sito e di dividere questa pagina in due colonne: la prima e pi\u00f9 larga contiene informazioni sulla scuola, ovvero un post con testo e immagine; la colonna pi\u00f9 a destra invece richiama sotto forma di elenco gli ultimi articoli contenuti nella categoria News. Per creare questa colonna \u00e8 necessario inserire l’istruzione:<\/p>\n
\tglobal $post;\n\t$myposts = get_posts('numberposts=3&category=3');\n\tforeach($myposts as $post) :\n\t\t\tsetup_postdata($post);\n\t\t\tglobal $more;\n\t\t\t$more = 0;<\/pre>\n
Considerato che 3 nel nostro sito \u00e8 l’ID della categoria News<\/em>. Non \u00e8 possibile inserire questa istruzione nel testo di una pagina se non \u00e8 installato un plugin come Exec PHP, perci\u00f2 noi abbiamo scelto di creare un template Home<\/em>, salvato nel file tmpl_home.php che inserisce l’istruzione dopo lo spazio riservato al contenuto (post).<\/p>\n
Per approfondire l’argomento sulla personalizzazione del tema e sulla definizione di template di pagina si consiglia la lettura di<\/p>\n
    \n
  • A.H.Silver e H. Hayder, WordPress 2.7 Complete<\/em>, Packt Publishing (in inglese 296 pagine)<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"
    Il modello di sito creato in WordPress per Porte aperte sul web \u00e8 una realizzazione fortemente personalizzata,\u00a0 ma in realt\u00e0 tutte le modifiche fatte coinvolgono unicamente i files del tema, su un’installazione standard della piattaforma. Personalizzazione dei men\u00f9 di navigazione La maggior parte delle modifiche riguarda il sistema di navigazione. La decisione del gruppo di […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":97,"menu_order":8,"comment_status":"open","ping_status":"open","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/pages\/237"}],"collection":[{"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/comments?post=237"}],"version-history":[{"count":0,"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/pages\/237\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/pages\/97"}],"wp:attachment":[{"href":"https:\/\/icripalimosani.edu.it\/site\/wp-json\/wp\/v2\/media?parent=237"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}