1 / 98

La piattaforma Wordpress

La piattaforma Wordpress. Conoscerla, comprenderla, integrarla. Wordpress: cos’è?.

lilia
Download Presentation

La piattaforma Wordpress

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. La piattaformaWordpress Conoscerla, comprenderla, integrarla

  2. Wordpress: cos’è? • WordPress è una piattaforma di "personal publishing" e content management system, scritta in PHP e che usa come database MySQL, che consente la creazione di un blog personale. Creata da Matt Mullenweg, è distribuita con la licenza GNU General Public License. • WordPress supporta un solo blog per installazione ma ne esiste una versione multi-utente, WordPress MU, anch'essa distribuita con la stessa licenza.

  3. Wordpress: perchè? • versatilità dell'architettura (database, api, plugin)‏ • scalabilità della struttura e facilità nella personalizzabile • codice affidabile e grande quantità di documentazione • facilità di installazione e semplicità di utilizzo • area di back-end già pronta e completa • Gestione delle pagine a template • Supporto a plugin esterni • Gestione delle categorie • Funzioni di Trackback e Pingback • Editor WYSIWYG per la formattazione dei testi • Creazione di pagine statiche • Supporto multi-autori • Log degli utenti che visitano il blog • Blocco di utenti in base all'indirizzo ip • URL permanenti che aiutano l'ottimizzazione nei motori di ricerca • Possibilità di specificare meta-tag • Dalla versione 2.7 è presente un sistema di aggiornamento automatico. • […]

  4. Wordpress: differenti tipologie di utenti attivi Amministratore: L’amministratore ha il controllo completo sul blog: può scrivere e cancellare a piacere, cambiare il tema, inserire widget, aggiungere utenti, persino cancellare il blog stesso. Editore: Può pubblicare post, editare tutti i post, pubblicati e no, aggiornare le pagine, moderare i commenti, amministrare le categorie, caricare immagini, cancellare post e pagine. Può leggere, editare e cancellare anche i post privati. Autore: Può editare, pubblicare e cancellare i propri post e caricare immagini. Collaboratore: Può scrivere ed editare i propri post, ma non li può pubblicare (la pubblicazione deve essere fatta da un Editor o da un Administrator.)

  5. Wordpress: dimostrazione di utilizzo del prodotto • Accesso alla gestione amministrativa • Creazione di un post • Creazione di una pagina • Pubblicazione di testo/immagini • Pubblicazione di allegati • Gestione commenti • Altre funzionalità

  6. Personalizzare Wordpress Come operare le personalizzazioni

  7. Personalizzazione di Wordpress: come? • Utilizzando la guida ufficiale: http://codex.wordpress.org/Main_Page … ma ora vedremo dei dettagli: • Template • Widget • Plug-in

  8. I Template Come crearli, adattarli, utilizzarli

  9. Wordpress: i template • I Template sono i file che controllano come le informazioni vengono visualizzate sul browser. • Questi file prendono le informazioni del database MySQL di WordPress e generano il codice HTML che viene inviato al web browser • Un Template è un insieme di file (php, js, css, immagini, ecc.) raccolti all’interno di una cartella e posizionati all’interno della radice di Wordpress in “wp-content\themes” • Riferimenti: • http://codex.wordpress.org/Theme_Development

  10. Wordpress: i template • Un tema minimale conterrà i seguenti file: • index.php • style.css • header.php • footer.php

  11. Wordpress: i template (index.php) Riferimenti: • http://codex.wordpress.org/Function_Reference/get_header • http://codex.wordpress.org/Function_Reference/get_footer • http://codex.wordpress.org/Stepping_Into_Templates <?php get_header(); ?> Contenuto pagina <?php get_footer(); ?>

  12. Wordpress: i template (style.css) • È il file di riferimento per identificare il tema di Wordpress tramite apposita codifica nell’intestazione del foglio di stile. • Riferimenti: • http://codex.wordpress.org/CSS /* ThemeName: Corso Uffici Scolastici Theme URI: http://www.formerete.net Description: Esempio di un templateWordpress Version: 1.0 Author: Roberto Scano Author URI: http://robertoscano.info/ */

  13. Wordpress: i template (gerarchia) • È possibile creare altre tipologie di file a cui assegnare delle specificità. • Header.php • Footer.php • Sidebar.php • Category.php • …

  14. Wordpress: i template (gerarchia) • Riferimenti: • http://codex.wordpress.org/Template_Hierarchy

  15. Wordpress: i template (gerarchia) • È possibile assegnare differenti tipologie di pagine utilizzando i tag condizionali: http://codex.wordpress.org/Conditional_Tags <?php if (is_category(9)) { // pagina specifica per i post della categoria 9 include(TEMPLATEPATH . '/single2.php'); } else { // pagina specifica per tutti i post di ogni categoria include(TEMPLATEPATH . '/single1.php'); } ?>

  16. Wordpress: i template (header.php) • È possibile personalizzare l’intestazione del nostro sito: http://codex.wordpress.org/Designing_Headers <divid="header"> <divid="headerimg"> <h1> <a href="<?phpechoget_option('home'); ?>"> <?phpbloginfo('name'); ?></a> </h1> <divclass="description"> <?phpbloginfo('description'); ?> </div> </div> </div> #header { background: #90a090; border-bottom: double 3px #aba; border-left: solid 1px #9a9; border-right: solid 1px #565; border-top: solid 1px #9a9; font: italicnormal 230% 'Times New Roman', Times, serif; letter-spacing: 0.2em; margin: 0; padding: 15px 10px 15px 60px; }

  17. Wordpress: i template (categories.php) • È possibile personalizzare la pagina che visualizza le categorie: http://codex.wordpress.org/Category_Templates <?phpif (is_category('Categoria A')) { ?> <p>Questo testo descrive la categoria A</p> <?php } elseif (is_category('Categoria B')) { ?> <p>Questo testo descrive la categoria B</p> <?php } else { ?> <p>Testo generico per tutte le altre categorie.</p> <?php } ?>

  18. Wordpress: i template (sidebar.php) • È possibile personalizzare la sidebar per gestire contenuti dinamici http://codex.wordpress.org/Customizing_Your_Sidebar Riferimenti: • http://codex.wordpress.org/Customizing_Your_Sidebar • http://codex.wordpress.org/Styling_Lists_with_CSS <li id="categories"><?php _e('Categories:'); ?> <ul> <?php wp_list_cats(); ?> </ul> </li> ... <li id="archives"><?php _e('Archives:'); ?> <ul> <?php wp_get_archives('type=monthly'); ?> </ul> </li> <?php get_header(); ?> <?phpget_sidebar(); ?> Contenuto pagina <?php get_footer(); ?>

  19. Wordpress: i template (loop.php) <?php get_header(); ?> <?php include (TEMPLATEPATH . '/loop.php'); ?> Gestione Commenti <?php get_sidebar(); ?> <?php get_footer(); ?>

  20. Wordpress: i template (loop.php) • Gestisce la funzione di estrazione dei dati, tramite the_loop() http://codex.wordpress.org/The_Loop <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <!-- contenuto del loop --> <?php endwhile; else: ?> <p><?php _e('Sorry, no posts matched your criteria.'); ?></p> <?php endif; ?> <?php if (have_posts()) : ?> <?php while (have_posts()) : the_post(); ?> <!-- do stuff ... --> <?php endwhile; ?> <?php endif; ?>

  21. Wordpress: i template (loop.php) • Possiamo arricchire the_loop di contenuti <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div class="post"> <h2><a href="<?phpthe_permalink(); ?>"><?phpthe_title(); ?></a></h2> <small>Data: <?phpthe_time('j F Y') ?></small> <small>Autore: <?phpthe_author_nickname(); ?> </small> <div class="entry"> <?phpthe_content(); ?> </div> <p >Archiviato sotto <?phpthe_category(', '); ?></p> </div> <?phpendwhile; else: ?> <p><?php _e('Sorry, no posts matched your criteria.'); ?></p> <?phpendif; ?>

  22. Wordpress: i template (comments.php) <?php get_header(); ?> <?php include (TEMPLATEPATH . '/loop.php'); ?> <?php comments_template(); ?> <?php get_sidebar(); ?> <?php get_footer(); ?>

  23. Wordpress: i template (comments.php) • Gestisce la pubblicazione dei commenti in una pagina. • <?php if ( $comments ) : ?> • <h3 id="comments"> <?php comments_number('Nessuna risposta', 'Una risposta', '% risposte' );?> a <?php the_title(); ?></h3> • <?php foreach ($comments as $comment) : ?> • <li id="comment-<?php comment_ID() ?>"> • <cite><?php comment_author_link() ?></cite> • <small><?php comment_date('j F Y') ?></small> • <?php endforeach; ?> • <?php endif; ?> • <?php if ($post->comment_status == "open") : ?> • ... • <?php else : ?> • ... • <?php endif; ?>

  24. Wordpress: i template (personalizzati) • È possibile creare delle pagine (template) personalizzati, da assegnare in fase di pubblicazione di contenuti. • Riferimenti: • http://codex.wordpress.org/Pages <?php /* Template Name: Video */ ?>

  25. Wordpress: i template (searchform.php) • http://codex.wordpress.org/Creating_a_Search_Page <li id="search"> <label for="s">Cerca:</label> <form id="searchform" method="get" action="/index.php"> <div> <input type="text" name="s" id="s" size="15" /><br /> <input type="submit" value="Cerca" /> </div> </form> </li>

  26. Wordpress: i template (functions.php) • Functions.php si comporta come un plug-in, ovvero consente di inserire all’interno del tema una serie di funzionalità (widget, funzioni php) da utilizzare all’interno del tema. • Riferimenti: • http://codex.wordpress.org/Function_Reference

  27. Wordpress: i template (come vestire i moduli?) • Per ogni tipologia di moduli (motore di ricerca, moduli per i commenti, ecc.) sono disponibili delle apposite classi: http://codex.wordpress.org/Styling_Theme_Forms

  28. Wordpress: i template tags • Per pubblicare informazioni dinamiche all’interno del modello (template), sono disponibili i template tags http://codex.wordpress.org/Template_Tags • Da scaricare: http://ekinertac.com/wp-content/uploads/2009/07/Wordpress-Cheat-Sheet.pdf

  29. Wordpress: i template tag (the_content) • Consente di pubblicare il contenuto della pagina / articolo. • Tramite l’uso del commento <!– more --> consente di rendere pubblica, ove definito, solo una parte del contenuto. • Riferimenti: • http://codex.wordpress.org/Template_Tags/the_content <?phpthe_content('Read more...'); ?>

  30. Wordpress: i template tag (the_excerpt) • Consente di pubblicare un estratto dei contenuti di una pagina / articolo senza alcuna tipologia di formattazione. • Utile per visualizzare contenuti brevi in caso, ad esempio, di archivi. • Riferimenti: • http://codex.wordpress.org/Template_Tags/the_excerpt <?phpthe_excerpt(); ?> <?php if ( is_category() || is_archive() ) { the_excerpt(); } else { the_content(); } ?>

  31. Wordpress: i template tag (wp_list_pages) • Consente di personalizzare le pagine visualizzate nel menu principale (e non solo). • Riferimenti: • http://codex.wordpress.org/Template_Tags/wp_list_pages <ul id="nav"> <li <?php if(is_home()){echo 'class="current_page_item"';}?>> <a href="<?phpbloginfo('siteurl'); ?>">Home</a></li> <?phpwp_list_pages('title_li=&depth=1&exclude=2&sort_column=menu_order'); ?> </ul>

  32. Wordpress: i template tag (wp_list_categories) • Consente di personalizzare le categorie visualizzate. • Riferimenti: • http://codex.wordpress.org/Template_Tags/wp_list_categories <ul> <?php wp_list_categories('orderby=name&include=3,5,9,16'); ?> </ul>

  33. Wordpress: i template tag (wp_list_bookmarks) • Consente di personalizzare la visualizzazione di gruppi di link. • Riferimenti: • http://codex.wordpress.org/Template_Tags/wp_list_bookmarks <ul> <?phpwp_list_bookmarks('title_li=&category_before=&category_after='); ?> </ul>

  34. Wordpress: i template tag (wp_get_archives) • Consente di personalizzare la visualizzazione degli archivi • Riferimenti: • http://codex.wordpress.org/Template_Tags/wp_get_archives <ul> <?phpwp_get_archives('type=daily&limit=15'); ?> </ul>

  35. Wordpress: i template tag (the_tags) • Consente di personalizzare la visualizzazione dell’archivio dei tag • Un’altra funzione consente di creare la nuvola dei tag (tag cloud) • Riferimenti: • http://codex.wordpress.org/Template_Tags/the_tags • http://codex.wordpress.org/Template_Tags/wp_tag_cloud <?phpthe_tags('Social tagging: ',' > '); ?> <?phpwp_tag_cloud('smallest=8&largest=22&number=30&orderby=count'); ?>

  36. Wordpress: i template tag (i filtri) • Grazie ai filtri è possibile modificare le funzioni base di wordpress. • Riferimenti: • http://codex.wordpress.org/Function_Reference/add_filter • http://codex.wordpress.org/Function_Reference/remove_filter function archivi_anno_corrente ($sql) { $sql=$sql . ' AND YEAR(post_date) = '. date('Y'); return $sql; } add_filter ('getarchives_where','archivi_anno_corrente'); wp_get_archives($category); remove_filter ('getarchives_where','archivi_anno_corrente'); function lunghezza_excerpt($text){ return 10; } add_filter('excerpt_length', 'lunghezza_excerpt');

  37. Wordpress: i template tag (la domanda) Dobbiamo fare “tutto a mano”

  38. Wordpress: i template tag (la risposta) • Sono disponibili diverse soluzioni • Archivio dei template gratuiti di Wordpress: http://wordpress.org/extend/themes/ • Template gratuiti / a pagamento presenti in rete • Applicazioni dedicate allo sviluppo dei temi per Wordpress

  39. Wordpress: i template tag (la risposta) • http://www.artisteer.com/ • Un buon punto di partenza, non la panacea.

  40. I Widget Come crearli, adattarli, utilizzarli

  41. Wordpress: definire sidebar per i widget • Consentono di poter inserire delle parti predefinite di codice (funzioni) all’interno di specifiche aree in sidebar e/o in altre aree sensibili. • Riferimenti: • http://codex.wordpress.org/Function_Reference/register_sidebar <?php if ( function_exists('register_sidebar') ) // creal'area widget sidebar sinistra register_sidebar(array('name'=>'sidebar sinistra', 'before_widget' => '<li id=\"%1$s\" class=\"widget %2$s\">', 'after_widget' => '', 'before_title' => ‘<h2 class=\"widgettitle\“>', 'after_title' => '</h2>', )); // creal'area widget BoxHome register_sidebar(array( 'name' => ‘BoxHome', 'id' => 'box1-home', 'before_widget' => '<div id="box1-home">', 'after_widget' => "</div>", 'before_title' => "<h2 class=\"widgettitle\">", 'after_title' => "</h2>\n", )); ?>

  42. Wordpress: definire sidebar per i widget • Per poter inserire degli oggetti (widget) direttamente nell’area della sidebar definita, è necessario verificare la funzionalità di widget per quella sidebar tramite dynamic_sidebar • Riferimenti: • http://codex.wordpress.org/Function_Reference/dynamic_sidebar <?php if ( function_exists ( dynamic_sidebar(‘BoxHome') ) ) : ?> ... <?phpdynamic_sidebar (‘BoxHome'); ?> ... <?phpendif; ?> <?php if ( function_exists('register_sidebar') ) // creal'area widget sidebar sinistra register_sidebar(array('name'=>'sidebar sinistra', 'before_widget' => '<li id=\"%1$s\" class=\"widget %2$s\">', 'after_widget' => '', 'before_title' => ‘<h2 class=\"widgettitle\“>', 'after_title' => '</h2>', )); // creal'area widget BoxHome register_sidebar(array( 'name' => ‘BoxHome', 'id' => 'box1-home', 'before_widget' => '<div id="box1-home">', 'after_widget' => "</div>", 'before_title' => "<h2 class=\"widgettitle\">", 'after_title' => "</h2>\n", )); ?>

  43. Wordpress: definire un widget • Un widget non è altro che del codice PHP contenuto in una funzione. Per essere utilizzato, il widget deve essere registrato tramite la funzione register_sidebar_widget. • Riferimenti: • http://codex.wordpress.org/Function_Reference/register_sidebar_widget • http://www.yourinspirationweb.com/2009/06/23/come-creare-un-widget-in-wordpress-28/ <?php function Youtube_video() { show_video(1,1); } ?> register_sidebar_widget('YouTube Video', 'Youtube_video');

  44. Wordpress: Widget Logic http://wordpress.org/extend/plugins/widget-logic/ Plug-in che consente di definire dove applicare un widget.

  45. I Plug-in Come crearli, adattarli, utilizzarli Torna al sommario

  46. Wordpress: plug-in • Un plug-in non è altro che un file PHP (o una serie di file PHP) che contengono delle funzioni per operare dei miglioramenti alle funzionalità di Wordpress. • Un plugin può essere contenuto in un unico file, o in un insieme di file. Lo stesso file del plugin deve essere posizionato nella directory wp-content/plugins/ (p. es. wp-content/plugins/plugin.php), o in una sottodirectory (attenzione, non più di una sottodirectory) wp-content/plugins/BAStats/, (p. es. wp-content/plugins/BAStats/BAStats.php). • Eventuali file di supporto al plugin dovrebbero essere posizionati nella directory wp-content/ del blog, dal momento che questa non viene sovrascritta quando si aggiorna WordPress ad una versione superiore. Se insieme al plugin hai necessità di distribuire molti file (javascript, immagini, etc.), tieni presente che è meglio installare tutto in una directory contenuta in /wp-content/plugins/{il-tuo-plugin}. In questo modo puoi assicurare all'utente una maggior comodità, tanto più che non ci sono limiti alla creazione di sotto-directory all'interno di wp-content. • Riferimenti: • http://wordpress.org/extend/plugins/ • http://www.wordpress-it.it/wiki/Main/ScrivereUnPlugin Torna al sommario

  47. Wordpress: plug-in • Le prime righe di tutti i plugin devono essere conformi agli Standard della Struttura del Plugin <?php /* Plugin Name: Nome_Del_Plugin Plugin URI: URI_Della_Pagina_Che_Descrive_Il_Plugin_e_Aggiornamenti Description: Breve_Descrizione_Del_Plugin Version: Il_Numero_Di_Versione_Del_Plugin Author: Nome_Autore_del_Plugin Author URI: URI_Autore_del_Plugin */ ?> Torna al sommario

  48. Wordpress: plug-in Un esempio: <?php /* Plugin Name: Invio mail Plugin URI: http://www.nomesito.it Description: Invia una mail ogni qualvolta si pubblica un post Version: 1.0 Author: Roberto Scano Author URI: http://robertoscano.info */ class avvisa { function invia_messaggio($post_ID) { $friends = 'bob@example.org,susie@example.org'; mail($friends,"Il blog e' stato aggiornato",'Ho scritto un nuovo articolo sul mio blog: http://blog.example.com'); return $post_ID; } } add_action('publish_post', array('avvisa', 'invia_messaggio')); ?> Torna al sommario

  49. I Plug-in per la navigazione Organizzare la navigazione dei contenuti Torna al sommario

  50. Plug-in per la navigazione: PageMash http://wordpress.org/extend/plugins/pagemash/ Consente di ordinare visivamente le pagine e sottopagine. <ul> <?phpwp_list_pages('sort_column=menu_order'); ?> </ul> Torna al sommario

More Related