Com personalitzar el Peu de pàgina de GeneratePress

En aquest article veurem com pots adaptar el peu de pàgina que ve per defecte amb el tema GeneratePress perquè quedi integrat amb les característiques que vols pel teu WordPress.

Personalitzar el peu de pàgina és tan important pel teu lloc web com incloure el teu propi logo, crear menús de navegació o tenir un formulari de contacte. I no obstant, no són poques les webs que deixen el peu de pàgina tal com els ve amb la seva instal·lació de WordPress.

El resultat d’aquesta mancança és una aparença mal acabada. I si tens intenció de donar una imatge més professional de la teva empresa o marca a internet, no et pots permetre tenir un peu de pàgina que no reflecteix ni l’estil ni el contingut propi del teu lloc web.

Així que desfes-te sense por de missatges de Powered by WordPress i similars amb el tema GeneratePress i fes que la part inferior de la teva web estigui a l’alçada!

Què és el Peu de pàgina?


El Peu de pàgina és la secció que es troba sempre al final del teu lloc web, i que es repeteix sempre a totes les pàgines.

Sol incloure informació que vols que estigui sempre disponible pels visitants i usuaris, de manera que no hagi d’anar a cercar-la en una pàgina específica. Així, dades de contacte, xarxes socials o la informació legal obligatòria són exemples que normalment pots trobar en aquesta ubicació.

El Peu de pàgina de GeneratePress

El Peu de pàgina del tema GeneratePress té els següents elements que pots personalitzar:

  • Una espai amb diferents àrees de Ginys. Per defecte en venen tres d’activades.
  • La barra inferior del peu de pàgina. Per defecte inclou un Copyright amb el nom del teu lloc i un missatge de “Gràcies al GeneratePress”.
  • Un botó de tornar a dalt que sura quan navegues per la pàgina. Si el cliques des de qualsevol punt tornes a la part de dalt de la pàgina sense necessitat de rodar manualment amb el ratolí o d’arrossegar la barra lateral de desplaçament vertical del navegador.
Peu de Pàgina GeneratePress

Per personalitzar el peu de pàgina de GeneratePress, podem tractar aquests elements sobretot des del personalitzador del WordPress. Però en algun cas també ho podem fer des de l’administrador intern del nostre lloc.

Format del peu de pàgina de GeneratePress


El primer que ens trobam a l’hora de configurar el peu de pàgina és el format. Però açò no vol dir que sigui necessàriament el primer que hagis de tocar, com veurem més endavant. Per fer-ho, des del personalitzador has de clicar a Format > Peu de pàgina.

Opcions generals

Les opcions de configuració del format són les següents:

Amplada del peu de pàgina: Complet o Contingut. Si ho configures a Complet, el peu de pàgina abarcarà tota l’amplada de la pàgina, mentre que si ho poses com a Contingut, s’ajustarà a l’amplària que determinis pel contenidor general del GeneratePress a l’apartat Format > Contenidor > Amplada del contenidor.

Amplada interior del peu de pàgina: amb les mateixes opcions que abans. En aquest cas, es refereix a l’amplada màxima que podran tenir els continguts que vagin dins el peu de pàgina.

Peu de pàgina de GeneratePress: personalització del format

Ginys de peu de pàgina: Per defecte n’hi ha tres. Però els pots eliminar tots o posar-ne fins a cinc, segons les teves necessitats.

Botó tornar a dalt: Per defecte ve deshabilitat. El pots activar per donar l’opció als usuaris a tornar a dalt de tot de la pàgina amb un sol clic. Aquest botó no queda fix al peu de pàgina, sinó que sura pel lloc i apareix quan un visitant comença a desplaçar-se cap avall.

Separacions de l’Àrea de Ginys del Peu de pàgina: Pots determinar en píxels les separacions o espais interns de l’àrea de Ginys. Pots configurar el valor de les separacions de la part superior, dreta, inferior i esquerra de forma individual. Si cliques la icona de l’enllaç, els valors es modificaran de manera conjunta.

Separacions de la barra del peu de pàgina: Tens les mateixes opcions d’espaiat anteriors de la barra del peu de pàgina.

Copyright: En aquest camp hi pots introduir el contingut que vulguis per la barra del peu de pàgina. Per tant des d’aquí pots substituir el “gràcies al GeneratePress” per qualsevol altra cosa.

Personalització del Copyright

Anem a veure aquest apartat amb més detall. Com pots veure a la imatge superior, tens indicat que hi pots incloure HTML (per exemple per introduir enllaços), o shortcodes (codis curts) que generin qualsevol contingut. I també dues etiquetes:

  • “%copy%” perquè aparegui el símbol de ©
  • “%current_year% perquè l’any s’actualitzi tot sol.

Anem a veure un exemple. Si escrius el següent:

%copy% Nom del teu lloc %current_year% - Tots els Drets Reservats | <a href="adreça-URL-del-teu-avís-legal">Avís Legal</a>

Amb aquest text t’apareixerà a la barra inferior del peu de pàgina © Nom del teu lloc 2019 – Tots els Drets Reservats | Avís Legal. A més, l’any s’actualitzarà automàticament sense que tu l’hagis de modificar cada 1 de gener.

Lògicament has de canviar “Nom del teu lloc” per la denominació del teu negoci, marca personal o domini. I on diu “adreça-URL-del-teu-avís-legal” hi has de posar l’adreça URL de la teva pàgina de documentació legal perquè l’Avís Legal quedi correctament enllaçat.

L’àrea de Ginys del peu de pàgina


Si has d’incloure ginys al Peu de pàgina de GeneratePress, la meva recomanació és que sigui el primer que facis abans de fer canvis de format. Sobretot pel que fa a amplada, espais i colors.

El motiu és que segons el contingut que hi posis, potser hauràs de fer modificacions posteriors. Per tant, defineix prèviament el nombre d’àrees de ginys que voldràs i introdueix els continguts.

I després pots adaptar el format i altres paràmetres del personalitzador al contingut que necessites.

Així que des del personalitzador anam a la secció de Ginys i tindrem el nombre d’arees de ginys de peu de pàgina que haguem definit.

Per exemple si al format del peu de pàgina hem deixat les tres àrees de ginys per defecte, aquestes seran les que apareixeran aquí.

A més, també pots incloure ginys a la barra inferior del peu de pàgina. Aquests ginys compartiran espai amb el contingut que posis al camp del Copyright.

Recorda que aquests ginys també els pots gestionar des de l’administració del WordPress a la barra lateral d’eines, des d’Aparença > Ginys.

Per a cada àrea de ginys hi pots posar tots els ginys que tens disponibles tant des del personalitzador com des de l’administració. Els ginys poden variar segons les extensions que tenguis al teu WordPress.

Per saber-ne més sobre els Ginys o Widgets en general, tens la unitat 6 del Curs WP Inicial.

Tipografia


Per definir la tipografia dels textos del peu de pàgina tens una secció pels Ginys i una altra per la barra inferior del Peu de pàgina.

Des del personalitzador, a Tipografia > Ginys (Widgets) pots configurar els títols dels Ginys amb els següents paràmetres:

  • Font: tria el tipus de lletra
  • Pes de la font: pot anar des d’un valor 100 fins a 900, normal o negreta.
  • Transformació de text: Per definir que es visualitzi sempre amb el mateix estil en majúscules, minúscules, primer lletra majúscula o sense canvis.
  • Mida de la font
  • Marge inferior

El paràmetre de mida del contingut no afecta el títol del giny, sinó la mida dels textos del giny.

Has de tenir present que aquest configuració no afecta només la tipografia dels ginys del peu de pàgina, sinó la de totes les àrees de ginys de GeneratePress, com les barres laterals, capçalera, etc…

Per tant qualsevol canvi que facis aquí també s’aplicarà a la resta d’ubicacions.

Des de Tipografia > Peu de pàgina podràs configurar els paràmetres de font, pes, transformació de text i mida específicament pel camp de Copyright del Peu de pàgina

Colors del peu de pàgina


Si ja tens els continguts que vols pel teu Peu de pàgina, i un cop ja has definit el format i la tipografia, és el moment d’adaptar-ne els colors.

Des del personalitzador, tenim dues seccions per aquesta feina:

Des de Colors > Footer Widgets (Ginys del Peu de pàgina) podràs personalitzar els colors següents:

  • Color de fons de l’Àrea de Ginys
  • Color del text
  • Color dels enllaços
  • Color dels enllaços quan passes amb el cursor (hover)
  • Color del títol del Giny

A diferència de la tipografia, que afecta tots els ginys tant si són del peu de pàgina com si són a una altra ubicació, pel color sí que pots definir un tractament del color específic pel peu de pàgina. Per definir els colors de la barra lateral hi ha una opció diferenciada.

Des de Colors > Footer (Peu de pàgina) tens les opcions per personalitzar el color de la barra inferior del peu de pàgina i del botó de tornar dalt de tot.

Imatges de fons al peu de pàgina


Finalment, també podem establir imatges de fons al peu de pàgina. Des del personalitzador, a la secció Imatges de fons > Peu de pàgina tens dos apartats. Un per la imatge de fons de l’àrea de ginys i un altre per la imatge de fons de la barra inferior. Tots dos es poden configurar igual.

Paràmetres de les imatges de fons

En cada cas tens un botó per seleccionar la imatge de fons que desitges i els següents quatre paràmetres:

Repetició

Si la mida de la imatge no cobreix tota l’àrea de giny o de la barra inferior, segons el tamany de la pantalla, pots definir si vols que la imatge es repeteixi. La repetició és útil per a imatges de patrons o sanefes.

Les opcions són:

  • Repetir fins a cobrir-ho tot
  • Repetir només verticalment
  • Repetir només horitzontalment
  • No repetir.

Mida

En aquest cas determines com serà el tamany de la imatge en relació a l’àrea que ha d’omplir. Aquí les opcions que tens són:

  • Ho pots deixar en automàtic com ve per defecte, i la imatge mantindrà les seves mides d’altura i amplada originals.
  • Que cobreixi el 100% de l’amplada, i l’altura s’ajustarà per mantenir l’aspecte.
  • Que cobreixi tota l’àrea (cover), de manera que la imatge s’ajusta i amplia tant en amplada com en altura.
  • O que estigui encaixada (contain) i que la imatge aparegui sencera dins l’àrea.

Adjunt

Amb aquest paràmetre defineixes el comportament de la imatge. Les opcions disponibles són:

  • Adjunta: és com ve per defecte. Així la imatge de fons es desplaça amb l’element quan navegues amunt o avall.
  • Fixa: la imatge no es mou quan navegues amunt o avall (efecte parallax)
  • Local: la imatge de fons vincula el seu desplaçament al del contingut de l’element o àrea corresponent.
  • Inherit: es detecta aquesta propietat des del seu element primari.

Posició

Finalment amb aquest paràmetre pots definir com vols que sigui el posicionament de la imatge que es mostrarà dins l’àrea.

Conclusions


Descuidar-te de personalitzar el peu de pàgina de WordPress no té excusa amb GeneratePress. Oblida’t del Powered by WordPress i similars i posa un peu de pàgina que reflecteixi tant l’estil com la identitat del teu projecte digital.

Amb GeneratePress pots modificar el format del peu de pàgina perquè s’adapti al teu lloc, incloure el teu propi text de Copyright, tots els ginys de contingut que necessitis, i modificar les tipografies, colors i imatges de fons al teu gust.

Finalment, només em queda demanar-te un favor. Si t’ha agradat l’article i t’ha resultat útil, comparteix-lo a les xarxes socials i deixa’m el teu comentari!

Altres articles que et poden interessar

No marxis sense dir res!

Informació sobre Protecció de Dades Personals - JoanLlompart.com t’informa que les dades de caràcter personal que proporciones emplenant aquest formulari seran tractades per Joan Llompart Muñoz com a responsable d’aquest lloc web; Finalitat: gestionar els comentaris en aquest blog; Legitimació: Consentiment de l’interessat; Destinataris: les teves dades es desen als servidors de Webempresa (UE) – Veure política de privacitat de Webempresa; Drets: pots accedir, rectificar, limitar o suprimir totes les teves dades a info@joanllompart.com; Per a més informació consulti la informació legal en aquest lloc web.