• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Giovambattista Fazioli, 10 more things
 

Giovambattista Fazioli, 10 more things

on

  • 933 views

Speech WordCamp-KnowCamp, Modena

Speech WordCamp-KnowCamp, Modena
19 marzo 2011

Statistics

Views

Total Views
933
Views on SlideShare
933
Embed Views
0

Actions

Likes
0
Downloads
3
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Giovambattista Fazioli, 10 more things Giovambattista Fazioli, 10 more things Presentation Transcript

    • 10 more thingsDieci tips and tricks che vi aiuteranno a sviluppare temi e plugins sempre più funzionali ebasati sul nostro CMS preferito: Wordpress Giovambattista Fazioli CTO & evangelist developer, co-founder - Saidmade Srl
    • wordpress
    • il successo di wordpress• LAMP (Linux, Apache, MySQL, PHP)• temi semplici e personalizzabili• vasta libreria di plugins semplici da realizzare• modello di sviluppo lineare PHP• CMS
    • temi & plugins
    • 5 cose sui temi
    • 1. cos’è un tema?è un insieme di file posizionati all’interno di una cartella, a suavolta posizionata nel percorso /wp-content/themeswordpress si aspetta di trovare “almeno” un determinato tipo difile all’interno della cartella del tema, come: /wp-content/themes/ -> miotema/ --> styles.css --> index.php
    • 1. cos’è un tema? “il tema, nella realizzazione di un sito web con tecnologiawordpress, rappresenta il cuore di tutto il sistema, molto più di una valanga di plugins” • cosa visualizzare • come visualizzarlo
    • 2. come realizzare un tema“la realizzazione di un tema da parte di un singolo, nella sua semplicità, richiede un concentrato di varie competenze” • gusto gra co • capacità utilizzare strumenti come Adobe Photoshop pensando al codice nale • HTLM e CSS • PHP • struttura e le funzioni di Wordpress
    • 2. come realizzare un tema1. content design2. prototipo gra co3. scrittura codice (PHP/HTML) per visualizzare i contenuti4. taglio della gra ca e scrittura CSS
    • ti ps 2. come realizzare un tema content design
    • ti ps 2. come realizzare un tema prototipo grafico
    • ti ps 2. come realizzare un tema scrittura codice HTML/PHP
    • ti ps 2. come realizzare un tema taglio della grafica + CSS
    • 3. cosa visualizzareWordpress permette sostanzialmente di collezionare contenutitestuali (POST, PAGE, …) emultimediali (immagini, video,documenti PDF, …).Questi contenuti (descritti nel Content Design) possono essereestratti in vari modi: tramite le funzioni – il tema – standard diWordpress, tramite l’uso di Plugin, scrivendo proprie funzioni.Ogni file nel tema di Wordpress svolge una funzione particolare eviene automaticamente richiamato da Wordpress in determinatecircostanze. I file più importanti di un tema (che può esserecomposto anche da numerosi file) sono:
    • 3. cosa visualizzare /wp-content/themes/ -> miotema/ --> archive.php --> comments.php --> footer.php --> functions.php --> header.php --> index.php --> page.php --> sidebar.php --> single.php --> style.css
    • ti ps 3. cosa visualizzareIn linea di massima potremmo affermare che tutti i file elencati,determinano il cosa verrà visualizzato, mentre style.css il come.index.php, ad esempio, è il file principale, quello che corrispondealla Home Page.header.php e footer.php contengono il codice HTML e PHPutilizzato rispettivamente nell’header e nel footer.Questa tecnica permette alle altre pagine di occuparsiesclusivamente del contenuto che cambia, normalmente la partecentrale.
    • ti ps 3. cosa visualizzareA livello logico tutte le pagine di un tema possono esserericondotte a questo schema: <?php get_header(); ?> <div id="content"> ... </div> <?php get_footer(); ?>
    • ti ps 3. cosa visualizzareWordpress permette varianti e semplificazioni relative al namingdei file del tema.Ad esempio il file archive.php è quello che si occupa dellavisualizzazione degli archivi, cioè la lista dei contenuti (post) percategoria, tag, data, etc…Capita spesso, sopratutto in siti web che non sononecessariamente dei blog, di dover trattare lavisualizzazione di una categoria diversamente da un’altra.
    • ti ps 3. cosa visualizzareIn prima analisi verrebbe immediatamente spontane inserire unacondizione all’interno del file archive.php del tipo: if( is_category(news) ) {   // Visualizzazione per le News } else {   // Altre visualizzazioni }Nonostante sia corretto, Wordpress fornisce una più semplice edelegante soluzione: basta creare un file composto da category- loslug (abbreviazione) della nostra categoria, tipo: category-news.php.
    • ti ps 3. cosa visualizzareQuesta caratteristica può essere utilizzata anche per le pagine ele sidebar, ma non per i post. Per le sidebar si nomina un file conuna notazione simile a quella utilizzata per le categorie, tiposidebar-footer.php, ma si usa una funzione per discriminare levarie sidebar: // Carica la sidebar standard: il file sidebar.php get_sidebar(); // Carica la side del file sidebar-footer.php get_sidebar( footer );
    • ti ps 3. cosa visualizzareUno dei file più potenti e utili, presente nei temi, è functions.php.Questo contiene di solito tutte le funzioni PHP che possonoessere richiamate all’interno di uno qualsiasi dei file del tema. Inquesto file, poi, possono essere eseguite funzioni tali daaggiungere o modificare funzioni presenti nel backend!Tutte le funzioni inserite in questo file saranno disponibiliesattamente come un qualsiasi altra funzione Wordpress. Unqualsiasi file del tema, come single.php ad esempio, potràaccedere a queste funzionalità.
    • ti ps 4. snippet <body <?php body_class(); ?>>
    • ti ps 4. snippet /**  * Restituisce il contenuto di una pagina, sia essa pubblica  * che privata  */ function pageBySlug($slug) {   $objectPost = get_page_by_path($slug);   return apply_filters("the_content", $objectPost->post_content); }
    • 5. amministrazioneAltra importantissima funzionalità è quella di presentare in modopiù “usabile” i campi personalizzati all’utente che operal’inserimento di un post.Questa è un’altro punto a favore di Wordpress, cioè la possibilitàdi alterare la maschera di inserimento di un post/pagina,rendendo il backend estremamente più semplice da utilizzare peril cliente.Normalmente nel backend i campi personalizzati si presentanocome:
    • 5. amministrazioneNormalmente nel backend i campi personalizzati si presentanocome:
    • ti ps 5. amministrazioneSfruttando la funzione add_meta_box(), ben documentata sulladocumentazione sul sito Wordpress
    • 5 cose sui plugin
    • 1. quando scrivere un plugin
    • ti ps 2. le funzioni più importantiLe funzioni più potenti presenti in Wordpress, che permettonospesso di risolvere problematiche apparentemente complessesono le “poco documentate” add_filter() e add_action(). function logoCustom() {   echo <style type="text/css">     #header-logo {      background-image: url( . get_bloginfo(template_directory) . / images/logo.png) !important;      }     </style>; } add_action(admin_head, logoCustom);
    • ti ps 2. le funzioni più importantiCon le ultime versioni di Wordpress, a livello di sistema, azioni efiltri sono la stessa cosa. Tuttavia concettualmente vengono (aragione) distinti. Una action è appunto un’azione, tipo: // Runs when a post or page is about to be deleted. // Action function arguments: post or page ID. function didDeletePost( $pID ) {   // Un post è stato eliminato, $pID indica lID } add_action(delete_post, didDeletePost);
    • ti ps 2. le funzioni più importantiI filtri, a differenza, vengono usati ad esempio per alterare l’outputo il comportamento di alcune funzioni: function modernContactInfo($contactmethods) {     unset($contactmethods[aim]);     unset($contactmethods[yim]);     unset($contactmethods[jabber]);     $contactmethods[facebook] = Facebook;     $contactmethods[twitter] = Twitter;     $contactmethods[linkedin] = LinkedIn;     return $contactmethods; } add_filter(user_contactmethods, modernContactInfo);
    • ti ps 2. le funzioni più importantiPer capire come funzionano i filtri, ecco un’estratto del codicesorgente della funzione che usa Wordpress function _wp_get_user_contactmethods() {    $user_contactmethods = array(      aim => __(AIM),      yim => __(Yahoo IM),      jabber => __(Jabber / Google Talk)    );    return apply_filters(user_contactmethods, $user_contactmethods); }
    • ti ps 3. come scriverlo...Una disamina sulla struttura di un Plugin è disponibile su: Sulla struttura ad oggetti di un Plugin WordPress,dove viene illustrato un possibile scheletro per confezionareadeguatamente un plugin.
    • ti ps 4. tools
    • ti ps 4. tools
    • vi ewp re 5. anteprima MVC
    • vi ewp re 5. anteprima // Includo il framework Saidmade include ("/libraries/smwordpress-plugins.php"); // Estendo la classe SMWordpressPlugin class MioPlugin extends SMWordpressPlugin {   // ... } #import <UIKit/UIKit.h> @interface myViewController : UIViewController {     }
    • grazie
    • 10 more thingsDieci tips and tricks che vi aiuteranno a sviluppare temi e plugins sempre più funzionali ebasati sul nostro CMS preferito: Wordpress Giovambattista Fazioli CTO & evangelist developer, co-founder - Saidmade Srl