wordpress 101 – freelance day - 24 ottobre 2015

@wptorino02/11/15

WordPress MeetUp Torino

WordPress 101Lo starter kit per farsi il sito

@wptorino02/11/15

Usare WordPress «perché lo usano tutti» è sbagliato

2

@wptorino02/11/15

Cos’è WordPress? Cosa non è?

«WordPress is web software you can use to create a beautiful website or blog»

WordPress non è Photoshop, Dreamweaver, Word, «una cosa drag & drop»

3

@wptorino02/11/15

A cosa serve WordPress?

WordPress non è la soluzione giusta per fare tutti i siti

Quello che può fare WordPress lo decidono il tema e i plugin

4

@wptorino02/11/15

WordPress è perfetto per:

•siti personali

•blog

•magazine

•siti di news

5

@wptorino02/11/15

Puoi usare WordPress per:

•ecommerce

•siti di prodotti

•cataloghi

6

@wptorino02/11/15

WordPress anche no:

•portfolio

•siti con pagine tutte diverse

•siti a pagina singola o molto semplici

7

@wptorino02/11/15

Cosa usare al posto di WordPress/1

E-Commerce

•Shopify

•Big Cartel

•Etsy

8

@wptorino02/11/15

Cosa usare al posto di WordPress/2

Portfolio

•Cargo

•Tumblr

•Squarespace (ottimo anche per i siti statici, «di pagine»)

9

@wptorino02/11/15

Cosa usare al posto di WordPress/3

Come/al posto di un blog

•Medium

•Tumblr

•Facebook

10

@wptorino02/11/15

WordPress è un CMS (Content Management System / Sistema di Gestione dei Contenuti) progettato per gestire, attraverso una interfaccia intuitiva, contenuti anche ricchi e complessi.

11

@wptorino02/11/15

WordPress.comIdeale per familiarizzare con gli strumenti di WordPress, senza acquistare

uno spazio web.

Registrandosi su WordPress.com si può iniziare subito a creare il proprio

sito o blog.

Senza dover acquistare nulla, senza dover installare nulla e senza doversi

preoccupare degli aggiornamenti della piattaforma.

COMODO NO?

12

@wptorino02/11/15

• Dominio di terzo livello (www.miosito.wordpress.com)

• Limitazione nell’uso dei temi

• Impossibile accedere al codice

• Impossibile installare plugin

• Nessun accesso all’hosting

WordPress.com – Limiti

13

@wptorino02/11/15

@wptorino02/11/15

Dopo l’accesso bisogna procedere alla creazione del

sito.

15

@wptorino02/11/15

1) Si sceglie il tema

16

@wptorino02/11/15

2) Si sceglie il dominio di terzo livello

(es. www.miosito.wordpress.com)

17

@wptorino02/11/15

3) Si sceglie il piano: gratuito o a pagamento

18

@wptorino02/11/15

Si accede al «dietro le quinte» del sito (back-end)

http://miosito.wordpress.com/wp-admin

19

@wptorino02/11/15

Articoli e pagine

ARTICOLO (post):✓ contenuti archiviati in ordine cronologico dal più recente (blog)✓ non hanno struttura gerarchica✓ possono essere organizzati con categorie e tag

PAGINA:✓ contenuti statici (es. About)✓ possono avere una struttura gerarchica con pagine e sotto-pagine✓ non prevedono categorie e tags

20

@wptorino02/11/15

Dal back-end è possibile scegliere,

nel menu verticale, se creare un

articolo o una pagina.

21

@wptorino02/11/15

Cliccando su «AGGIUNGI NUOVO» puoi iniziare a

creare il tuo primo articolo.

22

@wptorino02/11/15

Inserire il titolo dell’articolo

Area per inserire il contenuto dell’articolo

Per aggiungere immagini

23

@wptorino02/11/15

Nella barra a destra troviamo diverse funzioni:

✓ Salva bozza, anteprima, cestina e PUBBLICA

✓ Formato: all’articolo possiamo attribuire

diversi formati, il più utilizzato è standard

✓ CATEGORIE

✓ TAG

✓ IMMAGINE IN EVIDENZA: necessaria per le

anteprime sul sito, è quella che appare

quando si condivide l’articolo sui Social.

24

@wptorino02/11/15

Categorie e TagSono delle tassonomie.Tag e categorie sono utili per classificare i contenuti di un sito, per guidare i lettori e per indicizzare il sito su Google. Ad ogni tag e categoria infatti corrisponde un URL che andrà a posizionarsi su Google.

25

@wptorino02/11/15

Categorie✓ sono dei macrodescrittori dell’argomento del post✓ un numero piuttosto limitato in un sito✓ sono gerarchiche (categorie e sottocategorie)✓ Ha senso creare una categoria se associata ad una buona quantità di post✓ la creazione di una categoria deve essere ragionata: prima di partire con un blog avere chiare almeno 3 categorie.

26

@wptorino02/11/15

Tag✓ classificazione trasversale del post✓ al massimo una trentina ✓ non sono gerarchici ✓ non devono mai coincidere con le categorieESEMPIO:

27

Categorie Tag

Primi piatti Ricette con pomodoro

Secondi piatti Ricette con il pesce

@wptorino02/11/15

ImmaginiLe immagini che carichiamo sul nostro sito sono molto importanti e devono essere:

1) OTTIMIZZATE PER WEB

2) OTTIMIZZATE PER I MOTORI DI RICERCA

28

@wptorino02/11/15

Ottimizzare le immagini per il web

ERRORE FREQUENTE: siti web con immagini pesantissime e quindi lentissimi.

- 72 dpi- 1200 px il lato maggiore- compressione: 70-80%

29

@wptorino02/11/15

Ottimizzare le immagini per i motori di ricerca

Indispensabile perché le foto possano essere trovate su Google

Riguarda tre elementi principali:- nome del file- attributo title- attributo alt

30

@wptorino02/11/15

Ottimizzare le immagini per i motori di ricerca

NOME DEL FILE:- deve contenere parole di senso compiuto- separate dal trattino alto- tutto scritto minuscolo- dev’essere univoco (non uguale per più foto)- descrittivo al massimo- coinciso (5 o 6 parole max)

31

@wptorino02/11/15

Ottimizzare le immagini per i motori di ricerca

ATTRIBUTI TITLE E ALTdanno informazioni sull’immagine

- testo alternativo quando l’immagine non carica- testo che appare passando col mouse- didascalia nelle gallery

32

@wptorino02/11/15

Ottimizzare le immagini per i motori di ricerca

IMPORTANTE:

ALT è l’attributo che viene letto dai programmi di sintesi vocale utilizzati dalle persone non vedenti.INSERIAMOLO SEMPRE!

33

@wptorino02/11/15

Ottimizzare le immagini per i motori di ricerca

•Title e Alt esprimono lo stesso concetto del nome del file ma devono essere scritti in modo discorsivo e rispettando le regole dell’ortografia.

•Possono essere uguali tra loro

34

@wptorino02/11/15 35

@wptorino02/11/15 36

@wptorino02/11/15 37

@wptorino02/11/15 38

@wptorino02/11/15

Scegliere il temaTEMA O TEMPLATE?

@wptorino02/11/15

Template

l 1) Un file HTML (di solito acquistato)

l

l 2) Un tema WordPress

l

l 3) Un file nella struttura gerarchica di WordPress

40

@wptorino02/11/15

Un file HTMLl Per chi semplicemente non riesce a

fare una «bella» grafica , i template HTML sono da sempre stati una salvezza.

l Sono spesso a pagamento, a volte gratuiti, ma riguardano una modalità statica di fare siti.

41

@wptorino02/11/15

l

Template di WordPressUN MODO DI CHIAMARE I TEMI DI WORDPRESS SOPRATTUTTO DA PARTE DI CHI NON È UNO SVILUPPATORE

42

@wptorino02/11/15

Template della struttura di WordPressParte integrante della struttura di ogni singolo temaSolo il file functions.php (e i file funzionali annessi), i file .js e .css non sono templateindex.php, single.php, archive.php, page.php sono template

43

@wptorino02/11/15

Tipologia principaleTemi a pagamento → assistenza, buona qualità

Temi Free → risparmio, buona/discreta qualità

Temi versione Light → primo passo verso acquisto

44

@wptorino02/11/15

Marketplace di temi a pagamento – WordPress.org

45

@wptorino02/11/15

Framework: Genesis by StudioPress . WordPress.org

46

@wptorino02/11/15

Temi su WordPress.com

47

@wptorino02/11/15

Cercare Twenty Fifteen

48

@wptorino02/11/15 49

@wptorino02/11/15

Cliccando il tasto «More»

50

@wptorino02/11/15

Cercare Lovecraft tra i temi

51

@wptorino02/11/15 52

@wptorino02/11/15

Dove trovare immagini per fare sito e modificare il tema?•Pexels http://pexels.com •Flickr CC http://www.flickr.com/creativecommons/ •Wikimedia Commons http://commons.wikimedia.org/wiki/Category:Images•The Stocks http://thestocks.im/ •Unsplash http://unsplash.com/ •Gratisography http://www.gratisography.com/•Stock Up http://www.sitebuilderreport.com/stock-up•Designers Pics http://www.designerspics.com/

53

@wptorino02/11/15

Per chi usa WordPress.orgChild Theme• IL MANTRA: Sempre meglio creare Child

Theme in modo che si evitino guai con gli aggiornamenti (sovrascrittura)

• Tutte le personalizzazioni si fanno nel file style.css e nel file functions.php

54

@wptorino02/11/15

WordPress Plugin OverviewHOW TO

55

@wptorino02/11/15 56

@wptorino02/11/15 57

@wptorino02/11/15 58

@wptorino02/11/15 59

@wptorino02/11/15 60

@wptorino02/11/15

Less is moreLIFE SAVERS

61

@wptorino02/11/1502/11/15 62

@wptorino02/11/1502/11/15 63

@wptorino02/11/1502/11/15 64

@wptorino02/11/1502/11/15 65

@wptorino02/11/1502/11/15 66

@wptorino02/11/1502/11/15 67

@wptorino02/11/15

SEO and Tuning

02/11/15 68

@wptorino02/11/1502/11/15 69

@wptorino02/11/1502/11/15 70

@wptorino02/11/1502/11/15 71

@wptorino02/11/1502/11/15 72

@wptorino02/11/1502/11/15 73

@wptorino02/11/1502/11/15 74

@wptorino02/11/1502/11/15 75

@wptorino02/11/1502/11/15 76

@wptorino02/11/15

E-Commerce

@wptorino02/11/1502/11/15 78

@wptorino02/11/1502/11/15 79

@wptorino02/11/15

Security

02/11/15 80

@wptorino02/11/1502/11/15 81

@wptorino02/11/1502/11/15 82

@wptorino02/11/1502/11/15 83

@wptorino02/11/1502/11/15 84

@wptorino02/11/1502/11/15 85

@wptorino02/11/15

Social

02/11/15 86

@wptorino02/11/1502/11/15 87

@wptorino02/11/1502/11/15 88

@wptorino02/11/1502/11/15 89

@wptorino02/11/15

Cookies

02/11/15 90

@wptorino02/11/1502/11/15 91

@wptorino02/11/1502/11/15 92

@wptorino02/11/15

A little bit of everything

02/11/15 93

@wptorino02/11/1502/11/15 94

@wptorino02/11/1502/11/15 95

@wptorino02/11/1502/11/15 96

@wptorino02/11/1502/11/15 97

@wptorino02/11/1502/11/15 98

@wptorino02/11/1502/11/15 99

@wptorino02/11/1502/11/15 100

@wptorino02/11/1502/11/15 101

@wptorino02/11/1502/11/15 102

@wptorino02/11/1502/11/15 103

@wptorino02/11/1502/11/15 104

@wptorino02/11/1502/11/15 105

@wptorino02/11/1502/11/15 106

@wptorino02/11/1502/11/15 107

@wptorino02/11/1502/11/15 108

@wptorino02/11/1502/11/15 109

@wptorino02/11/1502/11/15 110

@wptorino02/11/1502/11/15 111

@wptorino02/11/1502/11/15 112

@wptorino02/11/1502/11/15 113

@wptorino02/11/15

Premium Plugins

02/11/15 114

@wptorino02/11/1502/11/15 115

@wptorino02/11/1502/11/15 116

@wptorino02/11/1502/11/15 117

@wptorino02/11/1502/11/15 118

@wptorino02/11/1502/11/15 119

@wptorino02/11/1502/11/15 120

@wptorino02/11/1502/11/15 121

@wptorino02/11/15

Per approfondire

02/11/15 122

@wptorino02/11/15

Bookmarks

▪http://www.wpmayor.com/

▪http://www.wpsolver.com/

▪http://www.wpbeginner.com/

▪http://wpshout.com/

▪http://wptavern.com/

02/11/15 123

@wptorino02/11/15

?

124

@wptorino02/11/15

About UsWordPress Meetup Torino

• http://www.meetup.com/WordPress-Meetup-Torino/

• http://wptorino.it

• https://twitter.com/wptorino

• https://www.facebook.com/wptorino

• Cristiano Zanca – http://zanca.it

• Francesca Marano – http://francescamarano.com

• Ivan Rachieli – http://iscarlets.it

• Ljuba Daviè – http://ljuba.it

• Maurizio Pelizzone - http://www.mavida.com

• Oleg Belousov - http://olegs.be/

125