Corso Pratico di WordPress

50
Napier Academy 14/12/2013 – Corso pratico di WordPress

description

Corso pratico di WordPress per Napier Academy.

Transcript of Corso Pratico di WordPress

Page 1: Corso Pratico di WordPress

Napier Academy

14/12/2013 – Corso pratico di WordPress

Page 2: Corso Pratico di WordPress

Mi presento

@niguli

/nicola.strumia

plus.google.com/u/0/108446546277223966968/

it.linkedin.com/in/niguli

skype:niguli

[email protected]

Page 3: Corso Pratico di WordPress

Titolo Introduzione a WordPress

Acquisto Dominio e Tema per WP

Installazione di WP, di un Tema e customizzazione

Dentro WP: pannello di gestione

Creazione e modifica dei contenuti (pagine e articoli)

Potenziare il tuo WP: i migliori Plugin ed installazione

Come integrare i Social su WP

Elementi SEO (search engine optimization)

Fatti trovare: la Google Authorship

Page 4: Corso Pratico di WordPress

Introduzione a WordPressCos’è, come funziona, perché ti servirà

Page 5: Corso Pratico di WordPress

Un po’ di storia e qualche numero Creato da Matt Mullenweg nel 2003, è il più conosciuto e diffuso CMS

(content management system) al mondo (60% dei CMS montano WP, pari al 20% dei siti mondiali)

Multilingua (Italia al 5° posto col 2%), open source, licenza GPL

E’ usato da testate internazionali (Techcrunch, CNN, UPS, Nfl)

Attuale versione 3.7.1, tra pochissimo esce la 3.8

Tecnologie usate: php, css, database mysql, javascript, ecc.

Può girare su hosting/server Linux e Windows

Si scarica gratuitamente da wordpress.org

Community di supporto più ampia

Da Blog a Sito completo

Page 6: Corso Pratico di WordPress

Welcome Mr. Parker… Data di uscita: ieri (mannaggia)

Restyling e nuove features dell’area Admin

• Più chiaro e semplice, schema di colori con più contrasto

• responsive per l’uso su mobile e schermi HD

• Opens Sans al posto di Arial;

• Migliorata gestione dei temi e dei widget;

• Nuovo tema Twenty Fourteen, stile magazine.

Page 7: Corso Pratico di WordPress

Cosa devi sapere? L’html

I CSS (fogli di stile)

Pochissimo PHP e javascript

Page 8: Corso Pratico di WordPress

Dominio web e temi per WPCome scegliere il giusto dominio, l’hosting e i migliori temi per WP

Page 9: Corso Pratico di WordPress

Registrare un dominio o WP hosted? Hai almeno 2 possibilità per usare WP (

http://it.forums.wordpress.com/topic/traduzione-wordpresscom-o-wordpressorg-la-differenza?replies=1):

• Usufruire gratuitamente di un dominio di terzo livello di wordpress.com (es. https://niguli.wordpress.com);

• Installare WP su un proprio dominio.WP.com Hosted Self Hosted

CMS Pre-installato, no hosting, ecc. Serve dominio, hosting, db mysql e fare l’installazione

Temi e customizzazioni limitate (img testata, font) Infinite customizzazioni e temi

No plugin Infiniti plugin aggiuntivi, ecommerce

Solo accesso al pannello Accessi al pannello, accessi FTP

Risk-free Soggetto ad attacchi, bugs, ecc.

Buono per farsi le ossa Soluzione definitiva ma con curva di apprendimento più lenta

Page 10: Corso Pratico di WordPress

Registrare un dominio Provider italiano o straniero? Dipende…

No discount

Es. Cheweb.it, piano Carolina:• Dominio + Spazio web

• DB mysql

• Email

Page 11: Corso Pratico di WordPress

Installazione WP e temi Come installare WP in 3 rapidi passi, installare e customizzare un Tema

Page 12: Corso Pratico di WordPress

Installazione per dummies Prerequisiti indispensabili :

• Un dominio web con hosting (preferibilmente Linux) con supporto PHP (v. 5.2.4)

• Un database mysql (v. 5)

• Accessi FTP

Strumenti:• Un editor di testo (meglio html)

• Un software FTP per caricare i files

Scaricate l’ultima versione di WP nella vostra lingua dal sito ufficiale

Page 13: Corso Pratico di WordPress

Installazione per dummies Scarica il pacchetto .zip, decomprimilo sul tuo PC.

1

Page 14: Corso Pratico di WordPress

Installazione per dummies Prendi nota dei dati di connessione al tuo database (nome db, nome

utente, password). CheWeb te ne fornisce uno pronto per l’uso, nell’email hai tutti i dati per la connessione. Altrimenti devi crearne uno via phpMyAdmin o pannello di gestione Hosting.

L’utente deve avere i privilegi di scrittura.

2

Page 15: Corso Pratico di WordPress

Installazione per dummies Edita il file wp-config-sample.php coi dati di connessione al db e

rinominalo in wp-config.php. Salva e carica tutti i file sul tuo hosting tramite FTP.

3

Page 16: Corso Pratico di WordPress

Installazione per dummies Sul browser vai a http://www.tuosito.com/wp-admin/install.php e segui le

istruzioni successive (nome amministratore e password di accesso al CMS).

4

Page 17: Corso Pratico di WordPress

Installazione per dummies Rendilo la tua installazione più sicura. Subito!

• Password intelligenti e sufficientemente difficili

• Inserisci in wp-config.php le “chiavi di salatura” (https://api.wordpress.org/secret-key/1.1/salt/)

• Altro:

– Nomi tabelle db– Nascondi versione WP– Plugin che gestiscono i tentativi di login

Page 18: Corso Pratico di WordPress

Installazione per dummies

Ehi, sai che esiste una 3° soluzione?

Usare il tuo webserver Apache locale e MAMP (Mac, Apache, MySQL e phpMyAdmin), ma anche WAMP e LAMP

Puoi fare tutte le installazioni che vuoi, più velocemente, non serve connessione internet

Caricare sul sito tutto alla fine, settando i dati di connessione

Page 19: Corso Pratico di WordPress

Dentro WordPressConoscere il Pannello di Gestione

Page 20: Corso Pratico di WordPress

La Dashboard di WordPress http://tuosito.com/wp-admin/ (o /wp-login.php)

Inserisci username e password e fai login

Page 21: Corso Pratico di WordPress

Benvenuti su WordPressBarra strumenti rapidi

Strumenti contenuti

Strumenti admin

Strumenti del tema

Bacheca / Contenuti / Plugin / Ecc.

Page 22: Corso Pratico di WordPress

Aspetta un momento…

Ci sono utenti e utenti…

Amministratore (Admin): ha completo accesso al sito e può fare qualunque modifica, aggiunta e cancellazione egli desideri;

Editore (Editor): può lavorare su tutti i contenuti del sito (articoli, file media, organizzazione di categorie e tag), può sia creare che cestinare articoli e pagine;

Autore (Author): può unicamente lavorare sugli articoli del blog. Può creare, modificare e cestinare articoli sia in fase di bozza che pubblicati;

Collaboratore (Contributor): può creare e modificare articoli (soltanto quelli scritti da se stesso) ma non può pubblicarli (serve admin). Questi dovranno, infatti, essere prima approvati dall’amministratore (ruolo perfetto per i guest blogger);

Sottoscrittore (Follower): non può infatti fare alcuna modifica sul sito, verrà solo

notificato quando vengono pubblicati i nuovi articoli se iscritti.

Page 23: Corso Pratico di WordPress

Ciao, io sono un… EditorBarra strumenti rapidi

Strumenti contenuti

Strumenti editor

Strumenti del tema

Bacheca / Contenuti / Plugin / Ecc.3 colonne

Page 24: Corso Pratico di WordPress

Creazione e modifica contenutiCreare pagine, articoli e tanto altro…

Page 25: Corso Pratico di WordPress

Capire la struttura di WordPress

Le principali aree di una pagina:

Header

Body

Sidebar

Footer Body

Page 26: Corso Pratico di WordPress

Capire la struttura di WordPressSiamo in presenza di file php, serve per creare i contenuti (le pagine) dinamicamente:

index.php: la home page del sito

single.php: i singoli articoli del blog

page.php: le pagine singole fuori dal flusso dei post

category.php: gli articoli presentati in base alla categoria

archive.php: l’archivio degli articoli

search.php: la pagina dei risultati della ricerca

404.php: la pagina di errore

Qui trovi tutto sul codice di WordPress

Page 27: Corso Pratico di WordPress

Capire il funzionamentoIl Loop di WordPress è una funzione php che fa una richiesta molto semplice al database:

C’è qualche post da visualizzare?

Quanti sono?

In che ordine devo mostrarli?

Se il server risponde affermativamente, il vostro sito WP elaborerà quello che gli viene spedito dal database e lo mostrerà sul browser.

Page 28: Corso Pratico di WordPress

Gestione dei Temi WordPress parte col suo tema gratuito predefinito Twenty Thirteen

(bello, funzionale, ma forse un po’ limitato)

Vai in Aspetto/Temi per:• attivare e disattivare i temi

• gestire una prima personalizzazione (testata, menu, ecc.)

• installarne di nuovi, da .zip o da sito wordpress.org

Page 29: Corso Pratico di WordPress

Scelta del tema WordPress Quali sono i migliori? Dipende dalle tue esigenze…

Ci sono buoni temi free, ma spesso conviene spendere qualcosa (30-80$)

Caratteristiche da tenere sotto controllo:• Codice scritto bene

• Possibilità di customizzazioni (es. colori, template)

• Helpdesk e Update

• Responsive

http://wordpress.org/themes/

http://themeforest.net/category/wordpress

http://www.elegantthemes.com

Spesso ci sono offerte interessantissime (www.mightydeals.com)

Costruiscilo da te con i framework (Thesis, Genesis, Thematic).

Page 30: Corso Pratico di WordPress

Alcune utilities fighissime Wappalyzer: per capire con che piattaforma è fatto un sito e altre sue

proprietà. È una add-on per browser da scaricare gratuitamente;

Hai visto un sito fatto in WP e vuoi sapere che tema è stato usato o anche che plugin vengono adoperati? http://whatwpthemeisthat.com

Usa Ispeziona elemento sul browser (tasto destro) per capire codice e stili, oppure…

Usa add-on per browser come Firebug, Stylebot, WebDeveloper, WhatFont, Google WebFont Preview, ecc.

Page 31: Corso Pratico di WordPress

Creazione e gestione contenuti Pagine

Articoli (categorie e tag)

Media (immagini)

Gestione commenti

Page 32: Corso Pratico di WordPress

Creazione di un Menu Trovi tutto sotto Aspetto/Menu. Puoi aggiungere Pagine, Link e

Categorie del Blog

Puoi creare più menu (dipende dal tema)

Con Drag and Drop si riassembla il tutto in un istante

Page 33: Corso Pratico di WordPress

Custom fieldsSono campi personalizzati che servono ad aggiungere elementi (meta-data; coppie chiave e valore) ad articoli.

Possono essere, testi, immagini, ecc.

Per una gestione completa consiglio il plugin Advanced custom fields.

Page 34: Corso Pratico di WordPress

Shortcode

Gli shortcodes sono delle piccole porzioni di codice racchiuse tra parentesi quadre: [ qualcosa ].

Servono ad aggiungere funzionalità rapide nel testo di un articolo o di una pagina.

Es: [ googlemap ] potrebbe essere uno shortcode che richiama l’inserimento di una mappa di Google all’interno del vostro articolo.

Possono avere parametri che ne definiscono aspetto e comportamento. Es: [ googlemap width=”1200" height="500” url=“…” ]

Page 35: Corso Pratico di WordPress

Setting di base Impostazione dei Permalink (Impostazioni/Permalink): sono gli indirizzi

a cui le pagine sono raggiungibili;

Appena il tuo sito è pronto sblocca l’indicizzazione da parte dei motori (Impostazioni/Lettura).

Page 36: Corso Pratico di WordPress

Potenzia il tuo WordPressI migliori plugin e come installarli

Page 37: Corso Pratico di WordPress

Cosa sono i PluginSono estensioni del CMS, gratuite o a pagamento, per potenziarne le funzionalità del CMS.

Alcuni indispensabili:

Per realizzare siti multilingua: WPML, qTranslate;

Search Engine Optimization: SEO for WordPress by Yoast, All in One SEO Pack, Platinum SEO Pack;

Ottimizzazione Velocità sito e Caching: WP Super Cache, W3 Total Cache;

Form di contatto, booking, ecc.: Gravity form, Contact Form 7;

Altri:• Tracciamento del sito con Google Analytics for WordPress;

• Social: Add This; WP Socializer, SZ Google;

• Cambiare aspetto all’admin: mp6;

• Ottimizzazione immagini: WP Smush.it, BJ Lazy load;

• Realizzare un sito ecommerce: WooCommerce;

• Back automatici del db: WordPress Backup to Dropbox, WordPress Database Backup;

• Installare tutti i Font di Google: WP Google Fonts;

• Nascondere un sito in sviluppo: Ultimate Coming Soon Page.

Page 38: Corso Pratico di WordPress

Come si installa un Plugin Si scarica il file .zip dal sito o dal repository ufficiale di WordPress, si va

come Admin su Plugin/Aggiungi nuovo… e si carica il file. Poi va attivato ed eventualmente settati alcuni parametri;

Si cerca nel repository per parola chiave/nome dentro il pannello di WP;

Si carica via ftp la cartella con il pacchetto decompresso dentro /wp-content/plugins/.

NB: i plugin rallentano il sito e, se scritti male, offrono vulnerabilità per attacchi malware!

Page 39: Corso Pratico di WordPress

I Widget Sono dei piccoli plugin in

miniatura (sotto Aspetto) che agiscono su determinate aree del sito (header, sidebar e footer generalmente), potenziandone le funzionalità;

Molti temi pro ne aggiungono altri a quelli di default;

Puoi installarne altri… come aggiungeresti un plugin;

I 25 migliori widget per la tua sidebar (sos-wordpress.it)

Page 40: Corso Pratico di WordPress

WordPress e i SocialsCome integrare i più famosi social sul tuo WP

Page 41: Corso Pratico di WordPress

Integrazione WP con i SocialsGrazie ai Widget e ai Plugin è possibile inserire in 1000 modi diversi le interazioni tra WP e tutti i più noti social network (facebook, twitter, google+, instagram, pinterest, tripadvisor, ecc.). Ad esempio:

Inserire i badge dei canali (spesso basta inserire il codice fornito)

Inserire gli stream dei profili/pagine (NB: Twitter e Facebook richiedono la creazione di app sulle loro sezioni developer).

Page 42: Corso Pratico di WordPress

Pubblicare anche sui Socials

Il Plugin SNAP (Social Networks Auto Poster) permette di pubblicare un articolo appena uscito sul tuo sito WordPress anche sui più noti Social (Facebook, Twitter, Google+, ecc.).

Page 43: Corso Pratico di WordPress

WordPress e la SEOLa Search Engine Optimization e WordPress

Page 44: Corso Pratico di WordPress

Cosa è la SEO?

La SEO (Search Engine Optimization) può essere vista come:

Mix di attività: che la SEO è un insieme di molte attività strettamente correlate.

Mix di conoscenze: analisi, umanistica, marketing, informatica, scrittura, ecc.

Mutevole: 500 cambiamenti annui all’algoritmo di Google.

Tutte queste attività hanno lo scopo di ottimizzare un sito web per favorirne la visibilità sulle ricerche condotte tramite motori.

Page 45: Corso Pratico di WordPress

Come fare buona SEO con WP

WP nasce già SEO oriented (es. Tag di heading di pagine e articoli). Inoltre:

WP permette una ottima riscrittuta delle URL in chiave SEO.

Il plugin SEO for WordPress di Yoast ti permette di intervenire su elementi chiavi quali:

• Title di pagina, Meta description

• Ha un “valutometro” di pertinenza delle parole chiave

• Permette di creare e tenere aggiornata la sitemap XML e il robots txt

• Permette di escludere dall’indicizzazione alcune aree

Page 46: Corso Pratico di WordPress

WordPress e l’AuthorshipFarsi trovare e far trovare i propri contenuti

Page 47: Corso Pratico di WordPress

Cosa si intende per AuthorshipGoogle Authorship: collegare un contenuto web ad un profilo Google+ (Author Rank e Personal Branding).

Al lato pratico si traduce nella possibilità che la propria immagine venga inserita e presentata nello snippet di un risultato nelle Serp (Search Engine Page Results).

Questo, lo dimostrano le statistiche, porta a CTR (click through rate) migliori.

Page 48: Corso Pratico di WordPress

Authorship con WordPress

Google Authorship su WordPress:

Vado su WordPress-> Utenti e compilo al meglio il profilo con immagine, info personali e il link al proprio profilo G+ in Informazioni contatti. Aggiorno profilo;

Uso il plugin di Yoast WordPress SEO, Titoli e metadati/Home. In Metadati autore/Evidenziazione autore seleziono il mio utente.

Più sotto si può anche usare una Pagina G+ e collegare il sito alla pagina About di Google+

Page 49: Corso Pratico di WordPress

Risorse WordPressSiti, community, blog, ecc.

Page 50: Corso Pratico di WordPress

Risorse utili Community WordPress Italia+ su Google+

wpandmore.info, ebook “Crea il tuo tema WordPress da Zero” di Andrea Barghigiani

SOS WordPress

www.wpbeginner.com

www.generatewp.com

Libri/Ebook (NB: cercate sempre un libro che tratti l’ultima versione):• Creare Blog e Siti Web con WordPress - Tiziano Fogliata

• Webmaster con WordPress - Bonaventura Di Bello

• Blogging Box ebook di Roberto Iacono

• EasyWPGuide

Stackoverflow: un mondo di risorse utili