Curs sobre Wordpres, el CMS més popular actualment per desenvolupar webs. Presentació preparada per impartir curs a CDmon sobre el gestor de continguts WORDPRESS. Apren a fer la teva web amb Wordpress amb un dia. www.creativacio.com

1. CURS DE WORDPRESS
Nivell Bàsic

2. CURS DE WORPRESS
1INTRODUCCIÓ A WORDPRESS
• Coneixent
WordPress
• Instal·∙lació
de
WordPress
• Configuració
de
WordPress
2GESTIÓ DE CONTINGUTS
• Pàgines
i
menús
• Entrades,
categories,
e<quetes
i
comentaris
• Mul<mèdia
i
enllaços
3PERSONALITZACIÓ WORDPRESS
• Widgets
• Plugins
4COCREACIÓ
• Veure
projectes
dels
alumnes
• Trucs
i
consells

3. CURS DE WORPRESS
1
INTRODUCCIÓ A WORDPRESS
• Coneixent
WordPress
• Instal·∙lació
de
WordPress
• Configuració
de
WordPress

4. Què és WordPress?
WordPress
és
una
plataforma
de
CMS
(Content
Management
System)
gestor
de
con<nguts
de
codi
obert.
Actualment
la
més
u<litzada
i
popular
per
a
la
creació
de
portals
i
pàgines
web.
Ofereix
una
total
funcionalitat
per
fer
qualsevol
<pus
de
portal,
ja
sigui
un
propi
blog
com
una
bo<ga
on-­‐line,
pàgines
corpora<ves,
webs
personals,
etc.
WordPress
està
pensat
perquè
usuaris
sense
experiència
siguin
capaços
de
mantenir
i
actualitzar
una
pàgina
web
sense
necessitat
de
saber
programació,
i
se
centrin
únicament
en
la
ges<ó
dels
con<nguts.
CURS DE WORPRESS
CONEIXENT WORDPRESS
S'utilitza en més del 18 % de tots els llocs web del món; si es consideren només els
llocs elaborats amb CMS, aquest percentatge ascendeix al 57%.i

5. WordPress
està
creat
amb
codi
PHP
i
està
pensat
i
desenvolupat
per
treballar
en
servidors
Linux,
a
més
és
necessari
disposar
d'una
base
de
dades
per
poder
instal·∙lar-­‐
lo
en
un
servidor
(ja
inclosa
per
defecte
quan
instal·∙lem
des
de
CDmon).
CURS DE WORPRESS
CONEIXENT WORDPRESS
El
espai
FTP
es
el
“cos”
de
la
web,
es
tracta
del
fitxers,
lo
que
generarà
la
pàgina
web
La
base
de
dades
és
la
“ment”
de
la
web,
és
tracta
dels
con<nguts
dins
de
cada
pàgina
i
la
relació
entre
ells.
Al
instalar
Wordpress
manté
una
“conexió
entre
cos
i
ment”
i
fa
posible
veure
ar<cles
de
forma
cronologica,
clasificats
per
categories,
o
buscar
con<nguts
per
exemple.

6. CURS DE WORPRESS
CONEIXENT WORDPRESS
Web
<pus
pàgines
Des
d'aquesta
pàgina
es
poden
veure
alguns
exemples
de
llocs
web
realitzats
amb
WordPress:
h[ps://wordpress.org/showcase/
Web
<pus
entrades
En
WordPress
podem
trobar
els
con<nguts
en
dues
formes
principals:
• Tipus
Pàgines
(pages)
,
web
<pus
corpora<va:
qui
som,
serveis,
contacte,…
• Tipus
Entrades
(posts),
web
<pus
blog,
no<cies,
magazine,
ar<cles,…

7. CURS DE WORPRESS
BENEFICIS WORDPRESS
Disseny
flexible.
Tens
la
possibilitat
de
triar
entre
milers
de
plan<lles
pre-­‐
dissenyades
per
aconseguir
la
teva
pàgina
web
que
més
t’agradi.
Podràs
trobar
dissenys
corpora<us,
moderns,
colorits
i
de
molts
altres
<pus.
Fàcil
administració.
El
panell
d'administració
és
molt
senzill
i
amigable.
Pots
editar,
afegir
con<ngut
en
qües<ó
de
segons
i
monitoritzar
tot
des
del
Dashboard
principal.
Posicionament.
WordPress
i
Google
són
com
els
millors
amics.
Si
fas
servir
WordPress,
els
primers
llocs
de
cercadors
tocaran
a
la
porta
molt
més
fàcil
i
ràpid.
100%
amigable.
per
a
qualsevol
<pus
d'usuari
sense
importar
la
seva
experiència
o
coneixement.
No
necessitaràs
lluitar
amb
HTML,
programació
o
FTP.
Blog
inclòs.
Si
crees
una
pàgina
web
està<ca
amb
informació,
WordPress
et
dóna
la
possibilitat
d'incloure
un
blog
a
part
(apartat
noccies).
Mobilitat.
No
necessites
estar
sempre
al
teu
ordinador
per
modificar
el
teu
lloc.
Es
pot
aconseguir
des
de
qualsevol
disposi<u
i
lloc
ja
que
WordPress
està
basat
en
la
web
i
no
en
un
programari
que
s'instal·∙la
en
un
PC
o
Mac.

8. Fent funcionar WordPress
Hi
ha
dues
formes
d'u<litzar
WordPress:
1.Mitjançant
la
plataforma
de
blogs
wordpress.com
h[ps://elmeudomini.wordpress.com/
(poques
opcions
personalització)
2.Realitzant
una
instal·∙lació
completa
al
nostre
espai
web
contractat
amb
el
nostre
propi
domini,
exemple
www.curswordpress.com
Instal·∙lació
i
configuració
en
pocs
minuts.
Entrem
al
Panell
de
control
de
CDmon
i
comencem
el
procés
per
instal·∙lar-­‐hi
WordPress
amb
un
sol
clic.
CURS DE WORPRESS
INSTAL·LACIÓ DE WORDPRESS

9.
CURS DE WORPRESS
INSTAL·LACIÓ DE WORDPRESS
Important!
Guarda
dades
accés
a
WordPress

10. hNp://www.nomdomini/wp-­‐admin
hNp://www.nomdomini/wp-­‐login.php
1.Introduir
Nom
usuari
2.Introduir
Contrasenya
CURS DE WORPRESS
INSTAL·LACIÓ DE WORDPRESS
i
Un cop entrem a WORDPRESS anem a para al backend i per visualitzar la web ho
fem des del frontend > ver sitio

11. CURS DE WORPRESS
CONFIGURACIÓ WORDPRESS
Abans
de
començar
a
jugar
amb
la
teva
web
necessites
configurar-­‐la
correctament
per
treure-­‐li
el
màxim
rendiment.
1.
Generals:
recorda
canviar
el
Vtol,
la
descripció
curta
del
lloc
i
l’idioma.
Exercici
PràcVc
(modificar
Ytol
i
descripció)

12. CURS DE WORPRESS
CONFIGURACIÓ WORDPRESS
2.
Ajustaments
d’escriptura:
canvia
la
categoria
per
defecte
per
a
les
entrades.
3.
Ajustaments
de
lectura:
tria
si
vols
que
la
pàgina
d'inici
del
teu
web
mostri
les
úlVmes
entrades
del
blog
o
una
pàgina
estàVca.
Veure
diferències.

13. CURS DE WORPRESS
CONFIGURACIÓ WORDPRESS
4.
Configuració
de
comentaris:
hi
ha
l’opció
de
permetre
comentaris
i
no<ficacions
pingbacks
i
trackbakcs
(enllaços).
5.
Enllaços
permanents:
fes
la
URL
amigable,
ajuda
al
SEO
de
la
teva
web.
U<litza
l'estructura
"nom
d'entrada”:
%
postname%.

14. CURS DE WORPRESS
CONFIGURACIÓ DEL PERFIL
Podrem
modificar
colors,
afegir
el
nostre
nom
i
cognom,
escriure
una
pe<ta
biografia,
canviar
i
modificar
la
nostra
contrasenya,
etc.
Exercici
pràcVc
(modificar
colors,
afegir
el
nostre
nom
i
cognom,
escriure
una
peVta
biografia,
canviar
i
modificar
la
nostra
contrasenya,
etc)
Podrem
accedir-­‐hi:
Des
de
la
barra
lateral
Cliquem
a
“Usuaris”,
aquí
ens
apareixen
els
diferents
usuaris
associats
a
aquest
compte,
ens
col·∙loquem
a
sobre
de
l'usuari
que
desitgem
configurar
i
cliquem
a
“Edita".
Des
de
la
part
superior
dreta
on
apareix
el
nostre
nom
de
perfil
i
cliquem
a
"Edita
perfil“.

15. CURS DE WORPRESS
USUARIS
Dins
de
WordPress
hi
poden
haver
diferents
<pus
d’usuaris,
amb
permisos
diferents.
Mitjançant
la
nostra
barra
d'eines,
i
clicant
a
la
pestanya
"Usuaris",
podem
crear-­‐ne
i
editar-­‐los.
Exercici
pràcVc
(crear
nou
usuari)
i
Només els administradors poden tenir accés a totes les eines de gestió del
compte WordPress, i són els únics que poden administrar els usuaris.

16. CURS DE WORPRESS
ESTRUCTURA INTERNA
L’entorn de l’administrador de WordPress
Un
disseny
per
a
WordPress
ja
conté
una
estructura
ben
definida
però
ofereix
la
versa<litat
de
modificar-­‐la
fàcilment.
Estructura
)pica
de
WordPress
i
Tenir noció de com és l’estructura de WordPress és molt important, ja que això
t’ajuda a entendre com pots jugar amb elements dins el lloc web.

17. CURS DE WORPRESS
TEMES: ESTRUCTURA EXTERNA
Les
plan<lles
per
a
WordPress
són
bàsicament
el
cor
d'aquest
CMS
i
són
arxius
que
funcionen
entre
si
per
crear
la
presentació
d'un
lloc.
Ofereixen
opcions
per
millorar
l'experiència
de
l'usuari
o
per
canviar
l'aspecte
visual
del
lloc
de
forma
instantània.
Hi
ha
mul<tud
de
temes
gratuïts
i
“premium”
(de
pagament)
que
ajuden
a
adaptar
WordPress
a
qualsevol
<pus
de
necessitat
i
<pus
de
pàgina
web.
i
Pots visitar https://wordpress.org/themes/ on t'ofereixen infinitat de temes.

18. CURS DE WORPRESS
TEMES: ESTRUCTURA EXTERNA
Abans
d’instalar
un
tema
important
tenir
en
compte:
1.Si
s’adapta
el
que
necessitem,
funcionalitats
i
objec<us.
2.Revisar
les
qualificacions
i
opinions
(ra<ng).
3.Servei
de
support.
Veure
el
tema
i
revisar
documentació
i
URL valoracions tema: https://wordpress.org/themes/spacious
URL creador del tema: http://themegrill.com/themes/spacious/

19. CURS DE WORPRESS
TEMES: ESTRUCTURA EXTERNA
WordPress
ja
porta
per
defecte
alguns
temes
instal·∙lats:
Twenty
fourteen,
Twenty
fiqeen,
etc.
Exercici
pràcVc
(instal·∙lar
nou
tema)
Veure
opcions
detall
tema
i
personalització.

20. CURS DE WORPRESS
OPCIONS TEMA
Per
personalitzar
el
tema
anar
a
Aparença
>>Opcions
del
tema
Exercici
pràcVc
(afegir
enllaç
al
teu
mail)

21. CURS DE WORPRESS
OPCIONS TEMA
Exercici
pràcVc
(afegir
logo
i
escollir
disseny)

22. CURS DE WORPRESS
OPCIONS TEMA
Exercici
pràcVc
(afegir
slider)
Exercici
pràcVc
(afegir
favicon)

23. FI BLOC1
Dubtes i preguntes?

24. CURS DE WORPRESS
2
GESTIÓ DE CONTINGUTS
• Pàgines
i
menús
• Entrades,
categories,
e<quetes
i
comentaris.
• Mul<mèdia
i
enllaços

25. CURS DE WORPRESS
GESTIÓ DE CONTINGUTS
En
WordPress
podem
trobar
dues
formes
principals
d'afegir
con<ngut:
1.Entrades
(posts)
2.Pàgines
(pages)
Tot
i
que
el
procés
per
afegir-­‐és
molt
semblant,
cadascuna
té
les
seves
caracterís<ques
úniques
amb
diferències
específiques.
Diferència
entre
entrades
i
pàgines
en
WordPress
Entrades
(s’organitzen
per
categories
i
eVquetes)
Si
vas
a
crear
un
blog,
llavors
la
majoria
del
teu
con<ngut
principal
serà
en
forma
d'entrades,
les
quals
són
cada
ar<cle
que
es
publica
cronològicament.
Conforme
vas
escrivint
entrades,
aquestes
es
van
arxivant
en
base
al
mes
i
any
de
publicació.
Pàgines
(poden
tenir
jerarquies
“subpàgines”
i
s’organitxen
en
menús)
Es
fan
servir
per
crear
diferents
<pus
de
con<ngut
més
està<c,
entre
els
quals
destaquen:
pàgines
essencials
com
“Contacte”,
“Quisóm”,
“Serveis”,
...
Tothom
té
clar?
Ensenyar
pissarra
i
exemples

26. CURS DE WORPRESS
PÀGINES
Quan
instal·∙les
WordPress
per
defecte,
ve
amb
una
“Pàgina
d'exemple”.
Veure
pàgina
d'exemple
i
Per crear nous elements: pàgines, entrades, plugins, etc., tens sempre 2
opcions: barra lateral a sota de l’element en qüestió o a dalt finestra principal.
Exercici
pràcVc
(crear
nova
pàgina)

27. CURS DE WORPRESS
DESCRIPCIÓ PÀGINES
Explica
caracterísVques
de
les
pàgines

28. CURS DE WORPRESS
EDITOR WORDPRESS
Aquest
símbol
mostra
o
treu
les
opcions
avançades
en
una
altre
linea.
En
aquesta
imatge
triem
diferents
<pus
de
text.
Exercici
pràcVc:
jugar
amb
l’editor
L'editor
visual
WordPress
és
una
eina
molt
flexible
a
l'hora
de
crear
els
teus
con<nguts.
Pots
donar
format
als
textos

29. CURS DE WORPRESS
EDITOR WORDPRESS
ConVngut:
és
on
anem
a
posar
el
nostre
text
que
volem
publicar.
Tens
les
opcions
bàsiques
de
qualsevol
editor
de
text,
com
canviar
l'es<l
i
mida
del
text,
afegir
imatges
o
vídeos
(fent
clic
a
"Afegir
objecte”).
Exercic
pràcVc:
Afegir
Imatge

30. CURS DE WORPRESS
CREANT I EDITANT PÀGINES
Una
“Pàgina”
és
diferent
d’una
“Entrada”:
•
Una
Pàgina
no
es
pot
col·∙locar
sota
una
Categoria.
Són
objectes
individuals.
•
Les
Pàgines
poden
ser
subpàgines
i
col·∙locades
dins
d'una
Pàgina
principal.
•
Les
Pàgines
són
diferents
de
les
“Entrades”,
les
quals
són
ordenades
cronològicament.
No
es
posen
a
la
llista.
Les
Pàgines
funcionen
més
per
guardar
detalls
de
contacte
o
per
explicar
als
visitants
el
propòsit
del
lloc
web,
per
a
informació
generalment
està<ca.
Exercici
pràcVc
(fer
4
pàgines:
Inici,
Qui
som,
NoYcies,
Contacte)
Explica
els
atributs
de
la
pàgina,
distribució
i
imatge
destacada.

31. CURS DE WORPRESS
OPCIONS DE PUBLICACIÓ
A
la
part
superior
dreta
tens
l'opció
de
“Publicada”,
“Pendent
de
revisió”
i
“Esborrany”
També
hi
ha
l’opció
de
programar
la
teva
“Pàgina”
Hi
ha
3
<pus
de
visibilitat:
“Pública”,
“Protegida
amb
contrasenya”
i
“Privada”.
També
pots
“Actualitzar”
la
pàgina
o
esborrar-­‐la.
Explicar
l’opció
de
revisions
i
com
funciona.
Una de les característiques més útils que ofereix WordPress és “Revisions”.
La data i hora en què fas l’entrada queden registrades pel sistema i tens l’opció de
poder recuperar.
i

32. CURS DE WORPRESS
CREAR MENÚ
Els
menús
permeten
organitzar
la
navegació
de
la
nostra
web
de
forma
fàcil.
Exercici
pràcVc
(crear
menú)
Perquè
la
teva
nova
pàgina
creada
es
pugui
veure,
necessitaràs
crear
un
enllaç
des
del
menú
principal.
Per
això,
vés
a
la
secció
"Aparença"
i
fes
clic
a
l'apartat.
Com
pots
observar
en
la
imatge,
veuràs
una
estructura
de
menú
parcialment
formada
per
WordPress.
A
“Nom
del
menú”
escriu
el
nom
que
vulguis
per
al
menú
principal
(per
exemple
Menú
Principal).
A
“Estructura
del
Menú”
tens
2
elements:
Inici,
i
Pàgina
d'exemple.

33. CURS DE WORPRESS
EDITAR MENÚ
Un
cop
creat
el
menú
veuràs
unes
noves
opcions:
“Afegir
pàgines
automà<cament”,
la
qual
anirà
afegint
les
pàgines
al
menú
a
mesura
que
les
vagis
creant
a
l'apartat
“Pàgines”
i
“Ubicació
del
tema”,
el
qual
has
de
seleccionar
per
indicar-­‐li
a
WordPress
que
aquest
és
el
menú
principal
de
la
plan<lla
que
estàs
u<litzant.
Exercici
pràcVc
(editar
menú)

34. CURS DE WORPRESS
ENTRADES
Què és una entrada o post?
L‘entrada
o
post
és
el
con<ngut
que
diferencia
un
blog
d'una
pàgina
web,
ja
que
mentre
les
”Pàgines”
són
està<ques,
les
“Entrades”
generalment
tenen
opció
de
publicar-­‐se
d'acord
a
un
ordre
cronològic.
Les
“Entrades”
es
classifiquen
i
s’organitzen
per
Categories
i
EVquetes.
Quan
instal·∙les
WordPress,
per
defecte
ve
amb
una
“Entrada
d’exemple”
anomenada
“Hola
Mundo”.
i
Diferenciaràs les pàgines de les entrades per la seva diferent organització. Les
entrades es classifiquen per “Categories” i les pàgines per “Menus”

35. CURS DE WORPRESS
ENTRADES
Exercici
pràcVc
(afegir
nova
entrada)
Per
crear
una
entrada,
et
quedes
en
el
mateix
apartat
de
“Entrades”
i
fas
clic
a
“Añadir
nueva”,
en
el
menu
lateral
o
en
la
part
central.

36. CURS DE WORPRESS
EDICIÓ D’ENTRADES
Títol:
has
d’escollir
un
que
expressi
a
primera
vista
el
que
conté
el
post.
ConVngut:
és
on
anem
a
posar
el
nostre
text
que
volem
publicar.
Tens
les
opcions
bàsiques
de
qualsevol
editor
de
text,
com
canviar
l'es<l
i
mida
del
text,
afegir
imatges
o
vídeos
(fent
clic
a
"Afegir
objecte”).
i
Recorda les 2 formes de visualització del contingut , mode “visual” i mode
“text” només si saps editar codi HTML, veure exemples.

37. CURS DE WORPRESS
CATEGORIES
Categoria:
tries
a
quina
secció
o
tema
pertany
la
teva
entrada.
Encara
que
també
ho
pots
deixar
“Sense
categoria”,
però
no
és
recomanable
ja
que
la
idea
és
tenir
la
teva
informació
ben
ordenada.
Exercici
pràcVc
(afegir
categories)
Existeixen
2
maneres
d'establir
les
categories.
-­‐Dins
de
la
mateixa
“Entrada”
li
afegeixes
la
categoria.
-­‐Dins
l'apartat
“Categories”
i
vas
a
“Afegir
nova
categoria”,
els
camps
de
Títol
de
la
categoria,
i
ja
pots
clicar
a
“Afegir
nova
categoria”.

38. CURS DE WORPRESS
ETIQUETES
EVquetes:
són
paraules
clau
que
u<litzes
per
descriure
el
con<ngut
de
l'Entrada.
És
molt
important
que
les
escriguis
perquè
Google
es
fixa
en
elles
per
a
les
eines
de
cerca,
per
tal
que
les
persones
et
trobin
per
contenir
aquesta
informació.
SEO
Exercici
pràcVc
(afegir
eVquetes/tags
a
una
entrada)
Per
aquest
exemple
que
parla
de
“WordPress”,
podria
ser:
“WordPress”,
“curs
WordPress”,
“fer
web
amb
WordPress”.
i
Separa les etiquetes amb comes. Exemple: WordPress, curs WordPress, web
WordPress, etc.

39. CURS DE WORPRESS
COMENTARIS
i
Algunes vegades aquesta opció no apareix per defecte, per habilitar-ho has
d’anar a la part superior dreta on diu “Opcions de pantalla” i seleccionar.
Comentaris:
apareixen
a
la
part
inferior.
Es
poden
habilitar
o
deshabilitar.
Exercici
pràcVc:
(habilitar
i
deshabilitar
comentaris)
Recorda
que
també
hi
ha
l’opció
de
deshabilitar
els
comentaris
A
tot
arreu
des
de
Ajusts
>>
Comentaris

40. CURS DE WORPRESS
GESTIÓ ENTRADES
Veure
com
es
poden
visualitzar
les
entrades
i
les
propietats.

41. CURS DE WORPRESS
MULTIMÈDIA I ENLLAÇOS
Afegint
imatges
a
les
Entrades
i
Pàgines
Primer
fem
una
nova
pàgina,
li
posem
de
nom
“servei1”,
un
cop
dins
cliquem
“Afegir
objecte”.
Exercici
pràcVc
(fer
nova
pàgina,
insertar
imatges)

42. CURS DE WORPRESS
AFEGIR IMATGES
Existeixen
3
llocs
des
d'on
pots
seleccionar
la
imatge
que
vols
inserir:
-­‐Des
del
teu
ordinador:
pots
pujar
una
imatge
des
del
teu
ordinador
o
també
és
pot
“arrastrar”
directament.
-­‐Des
de
La
Biblioteca
de
MulVmèdia:
pots
inserir
imatges
que
ja
es
trobin
a
la
Biblioteca
de
Mul<mèdia.
-­‐Des
d'una
URL:
si
tens
la
URL
de
la
imatge,
pots
inserir-­‐la
des
d'allà
sense
haver
de
pujar-­‐la
a
WordPress.
Exercici
pràcVc
(inseri
imatges
de
diferents
formes)
i
L’arxiu a de tenir uns centenars de KB i una resolució al voltant de 800 x 600
píxels.

43. CURS DE WORPRESS
EDICIÓ D’IMATGES
Un
cop
la
imatge
està
carregada
hauràs
d’editar-­‐la
en
els
camps
respec<us,
el
nom
i
descripció
i
el
lloc
on
s'enllaça
Exercici
pràcVc
(editar
imatge)

44. CURS DE WORPRESS
AFEGIR VÍDEOS
Hi
ha
2
maneres
de
fer-­‐ho:
1.
Afegint
la
URL
directament
amb
mode
visual
Exemple:
hNps://www.youtube.com/watch?v=l8d4d-­‐cOI4Y
2.
Afegint
codi
embed
(pestanya
text),
exemple
vídeo
youtube
Copia
el
codi
d’Embed
(pestanya
text)
del
vídeo
de
YouTube
de
la
teva
elecció.
<iframe
width="853"
height="480"
src="//www.youtube.com/embed/l8d4d-­‐cOI4Y?
rel=0&amp;showinfo=0"
frameborder="0"
allowfullscreen></iframe>
Exercici
pràcVc
(inserir
vídeo
de
youtube)
i
Recomanem no posar el vídeo en el servidor de la web, millor que el vagi a
buscar a youtube, vimeo, etc.

45. CURS DE WORPRESS
AFEGIR ENLLAÇ
Podem
afegir
enllaços
interns
(a
la
propia
web)
o
externs.
Exercici
pràcVc
(afegir
enllaç)
On
surt
"URL"
posem
el
link
que
volem
incloure.
L'opció
"Títol”
la
podem
ignorar.
Quan
acabem,
premem
"Afegir
Enllaç”.
Indiquem
si
l'enllaç
s'obre
a
la
mateixa
finestra
del
navegador
o
a
una
finestra
nova.
Les
següents
figures
es
fan
servir
per
afegir
enllaços
al
text.
El
primer
serveix
per
crear
i
el
segon
per
eliminar.

46. CURS DE WORPRESS
AFEGIR ENLLAÇ DE MAIL
Exercici
pràcVc
(afegir
enllaç
al
teu
mail)
Anar
a
la
pestanya
“Text”
i
copia
la
linea
de
codi
html
<a
href="mailto:elteunom@email.com">
Text
que
vulguis
posar
per
fer
clic
</a>
On
posa
"Text
que
vulguis
posar
.."
escriu
les
paraules
que
veurà
el
visitant,
<ngues
en
compte
que
és
on
ha
de
fer
clic
per
enviar-­‐te
el
mail.
Pots
posar
"enviem
un
mail",
"Feu
clic
aquí”
o
simplement
la
pròpia
adreça
del
teu
e-­‐mail.

47. FI BLOC2
Dubtes i preguntes?

48. CURS DE WORPRESS
3
PERSONALITZACIÓ WORDPRESS
• Widgets
• Plugins

49. CURS DE WORPRESS
WIDGETS / BARRA LATERAL
L'ús
dels
widgets
ens
permeten
afegir
con<nguts
i
enllaços
en
determinades
zones.
Alguns
Temes
de
WordPress
són
coneguts
com
“widget
ready”
o
que
accepten
“widgets”.
Una
web
habitualment
té
un
format
de
2
columnes.
Una
columna
principal
i
una
columna
més
estreta
on
es
posen
els
“widgets”
amb
un
propòsit
específic.

50. CURS DE WORPRESS
WIDGETS
Alguns
dels
objectes
cpics,
anomenats
widgets,
i
que
venen
per
defecte
són:
Exercici
pràcVc
(inserir
widget
“Buscar”
a
la
capçalera)

51. CURS DE WORPRESS
WIDGETS TEMA
Exercici
pràcVc
(inserir
widgets)

52. CURS DE WORPRESS
PLUGINS
Un
plugin
és
un
tros
de
codi
en
forma
de
complement
(pe<ts
programes)
que
es
poden
instal·∙lar
a
WordPress.
Els
plugins
són
complements
(programari)
que
augmenten
les
capacitats
i
possibilitats
de
WordPress
fins
a
límits
inimaginables.
Els
plugins
es
fan
servir
per
millorar
WordPress
en
diferents
àrees
com
màrque<ng,
xarxes
socials,
seguretat,
SEO,
disseny
web,
con<ngut,
trànsit
web,
etc.
i
Gràcies al fet que WP és una plataforma de codi obert, centenars de
desenvolupadors web tenen la possibilitat de crear plugins per a la plataforma.

53. CURS DE WORPRESS
INSTAL·LAR PLUGIN
Exercici
pràcVc
(instal·∙lar
plugin
“contact
form
7”)

54. CURS DE WORPRESS
INSTAL·LAR PLUGIN
Exercici
pràcVc
(configurar
“contact
form
7”
i
posar-­‐lo
a
la
pàgina
contacte)

55. CURS DE WORPRESS
INSTAL·LAR PLUGIN
Plugin per afegir foto de perfil
Exercici
pràcVc
(instal·∙lar
plugin
avatar
i
pujar
imatge
logo)
Material
curs:
imatge
logo
empresa
Podrem
accedir-­‐hi
des
de
la
barra
Lateral
clicant
a
”Plugins”,
i
clicant
a
“Afegir
nou”.
Un
cop
dins,
introduïm
dins
el
quadre
de
verca
“simple
local
avatars”,
Aquest
Plugin
ens
dóna
la
possibilitat
d’afegir
imatges
en
el
nostre
"avatar".
L’instal·∙lem
i
l’ac<vem.

56. CURS DE WORPRESS
INSTAL·LAR PLUGIN
Ara
accedim
a
“Edita
perfil”,
ja
explicat
en
“Configuració
del
perfil”.
Apareix
aquesta
nova
opció
d'edició,
“Avatar“.
Selecciones
l'arxiu,
tant
des
del
teu
propi
ordinador,
o
algun
que
es<gui
pujat
a
la
teva
galeria
de
Wordpress,
i
cliquem
“Actualitzar
perfil”.
Instantàniament
ens
apareix
la
imatge
seleccionada
com
avatar
del
nostre
perfil.
i
Podem observar els canvis realitzats també a la part superior dreta del nostre
backend.

57. FI BLOC3
Dubtes i preguntes?

58. CURS DE WORPRESS
4COCREACIÓ
• Veure
projectes
dels
alumnes
• Trucs
i
consells

59. CURS DE WORPRESS
PROJECTES
Recent
Post
Widget
Extended
Easy
Facebook
Like
Box
Plugin

60. CURS DE WORPRESS
GOOGLE ANALYTICS
Instalar
codi
google
analyVcs
1.Copia
i
enganxar
“script
codi
analy<cs”
dins
opcions
tema,
caixa
insertar
codi.
2.Manualment
a
l’arxiu
header.php,
enganxar
el
“script
codi
analy<cs”
entre
e<quetes
<head>
i
</head>
3.Mitjançant
un
plugin:
google
analy<cs
by
yoast,
google
analy<cs
for
wordpress,
google
analy<cs
dashboard
for
WP,
...
Exercici
pràcVc
(instal·∙lar
plugin
“google
analyVcs
by
yoast”

61. CURS DE WORPRESS
GOOGLE ANALYTICS
Per
instal·∙lar
un
plugin,
tens
dues
opcions:
1.Des
d’“Afegir
plugins”
busques
per
“paraula
clau”
i
cliques
“Instal·∙lar
ara”.
2.Des
d’FTP
amb
l'arxiu
en
.ZIP
i
No instal·lis plugins dels quals no estàs segur, poden espatllar el teu lloc web.
Com més plugins tinguis, més hauràs de revisar la teva pàgina.
Exercici
pràcVc
(instal·∙lar
plugin
“google
analyVcs
by
yoast”

62. CURS DE WORPRESS
1.
IdenVfica
i
defineix
el
Vpus
de
pàgina
web
que
vols
fer
Existeixen
molts
<pus
de
pàgina
web.
Pot
ser
una
corpora<va,
una
de
negocis,
una
bo<ga
virtual,
….
El
primer
pas
després
d'instal·∙lar
WordPress
és
definir
quin
<pus
de
pàgina
web
necessites
per
després
poder
buscar
temes
i
plugins
compa<bles.
2.
Busca
un
tema
que
coincideixi
amb
el
que
necessites
Un
dels
avantatges
més
importants
de
WordPress
és
que
hi
ha
una
gran
varietat
de
dissenys
i
temes
per
a
tot
<pus
de
necessitat.
I
si
es
requereix
d'una
mica
més
avançat,
es
pot
modificar
mitjançant
codi.
3.
UVlitza
plugins
i
temes
acuradament
Instal·∙la
només
els
plugins
i
temes
que
realment
necessi<s.
Acudeix
a
la
comunitat
i
assessora't
per
usuaris
amb
més
experiència.
CONSELLS GENERALS

63. CURS DE WORPRESS
1.
Actualitzà
regularment
plugins
i
tema
És
important
mantenir
la
web
actualitzada
per
evitar
spam,
malware,
virus,
etc..
2.
Fer
copies
de
seguretat
Web
Recomanem
plugin
“backWPup”
3.
UVlitzar
algun
plugin
seguretat:
Recomanem
plugin
“wordfence”
CONSELLS SEGURETAT
i
Recomanem canviar el usuari que ve per defecte: moon, admin,...

64. CURS DE WORPRESS
Market
places
de
temes
WordPress:
• Studiopress
(Premium)
• Woothemes
(Premium)
• Elegant
Themes
(Premium)
• ThemeForest
(Premium)
Plugins
Recomenats:
• Akismet
(an<spam)
• Contact
Form7
(formularis
contacte)
• Google
analy<cs
for
wordpress
(analy<cs)
• Cookie
Law
Info
(avis
legal
cookies)
• Discus
(per
ges<onar
comentaris)
• Shareaholic
(compar<ció
xarces
socials)
• TinyMCE
Advanced
(editor)
Idiomes
(amb
plugins):
Plugins
gra<s
qtranslate
i
Plugin
de
pago
wpml
RECURSOS

65. @CDmonFacebook.com/Its.CDmon info@cdmon.com
Fem el que ens agrada
www.cdmon.cat
b
blog.cdmon.cat
@creativacioSMFacebook.com/creativacioSM info@creativacio.comb