CURS DE WORDPRESS Nivell Bàsic

CURS DE WORPRESS

   

1 INTRODUCCIÓ A WORDPRESS •  Coneixent  WordPress  •  Instal·∙lació  de  WordPress  •  Configuració  de  WordPress  

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

3 PERSONALITZACIÓ WORDPRESS •  Widgets  •  Plugins    

4 COCREACIÓ •  Veure  projectes  dels  alumnes  •  Trucs  i  consells  

CURS DE WORPRESS

1 INTRODUCCIÓ A WORDPRESS •  Coneixent  WordPress  •  Instal·∙lació  de  WordPress  •  Configuració  de  WordPress  

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

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.  

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,…    

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.  

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

       

CURS DE WORPRESS

INSTAL·LACIÓ DE WORDPRESS

Important!  Guarda  dades  accés  a  WordPress  

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

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ó)  

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.      

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%.  

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“.  

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.

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.

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.

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/

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ó.  

CURS DE WORPRESS

OPCIONS TEMA Per  personalitzar  el  tema  anar  a  Aparença  >>Opcions  del  tema  

Exercici  pràcVc  (afegir  enllaç  al  teu  mail)  

CURS DE WORPRESS

OPCIONS TEMA

Exercici  pràcVc  (afegir  logo  i  escollir  disseny)  

CURS DE WORPRESS

OPCIONS TEMA

Exercici  pràcVc  (afegir  slider)  

Exercici  pràcVc  (afegir  favicon)  

FI BLOC1 Dubtes i preguntes?

CURS DE WORPRESS

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

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  

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)  

CURS DE WORPRESS

DESCRIPCIÓ PÀGINES    Explica  caracterísVques  de  les  pàgines  

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                            

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  

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.  

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

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.      

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ú)  

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”

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.  

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.

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”.    

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.

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  

CURS DE WORPRESS

GESTIÓ ENTRADES

 Veure  com  es  poden  visualitzar  les  entrades  i  les  propietats.  

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)    

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.

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)  

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.

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.      

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.  

FI BLOC2 Dubtes i preguntes?

CURS DE WORPRESS

   3 PERSONALITZACIÓ WORDPRESS

•  Widgets  •  Plugins    

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.                    

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)  

CURS DE WORPRESS

WIDGETS TEMA Exercici  pràcVc  (inserir  widgets)  

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.

CURS DE WORPRESS

INSTAL·LAR PLUGIN

Exercici  pràcVc  (instal·∙lar  plugin  “contact  form  7”)  

CURS DE WORPRESS

INSTAL·LAR PLUGIN

Exercici  pràcVc  (configurar  “contact  form  7”  i  posar-­‐lo  a  la  pàgina  contacte)  

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.        

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.

FI BLOC3 Dubtes i preguntes?

CURS DE WORPRESS

   

4 COCREACIÓ •  Veure  projectes  dels  alumnes  •  Trucs  i  consells  

CURS DE WORPRESS

   

PROJECTES

Recent  Post  Widget  Extended  

Easy  Facebook  Like  Box  Plugin  

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”    

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”    

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

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,...

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

@CDmon Facebook.com/Its.CDmon info@cdmon.com

Fem el que ens agrada

www.cdmon.cat

b   blog.cdmon.cat

@creativacioSM Facebook.com/creativacioSM info@creativacio.com b