Personalitza les imatges i els fons a Vendes en línia Square
Les imatges són un element fonamental en qualsevol lloc web. Poden afegir-hi un toc personal, fer vendre més articles i millorar la presència online en general. A l’editor de webs de Vendes en línia Square, la majoria de seccions ofereixen una opció d’imatge perquè la personalitzis, com ara:
Pujar diverses imatges amb una secció de la galeria d’imatges i triar entre diferents dissenys, com ara galeries estàtiques o presentacions de diapositives.
Connectar el compte d’Instagram amb una secció del canal de continguts d’Instagram perquè puguis sincronitzar i mostrar les imatges de les xarxes socials.
Destacar els millors articles i categories amb una secció d’articles destacats que permeti que els clients facin comandes i comprin en un tres i no res.
Les seccions generals de text i imatge et permeten afegir diverses formes de continguts, amb opcions de personalització addicionals per triar.
A la majoria de les altres seccions hi podràs afegir una imatge de fons.
T’oferim alguns consells més per gestionar les imatges de fons i les imatges que no ho són al web de Vendes en línia Square.
Imatges que no són de fons vs. imatges de fons
![Square-Online-Non-Background-vs-Background-Images-CA](http://images.ctfassets.net/gc4s9mi2asix/677Fl7TNTBtdxg8vFjsrYM/de332fc3e308958cc2fc9d034831b160/Screen_Shot_2022-09-14_at_6.25.48_PM.png)
Quan treballis amb imatges a l’editor de webs, veuràs que n’hi ha de dues classes principals:
Que no són de fons: aquestes imatges són part del contingut afegit que es mostra al web, juntament amb el text. Normalment, se’ls pot fer clic amb el botó dret per copiar-les o obrir-les en una altra pestanya del navegador. També es coneixen com a imatges en primer pla.
De fons: aquestes imatges no formen part del contingut principal que apareix al web, sinó que estan al fons (o al darrere) del text i les imatges que no són de fons. Poden considerar-se com a part del disseny o estil del lloc web i no s’hi pot fer clic amb el botó dret per copiar-les o obrir-les en una altra pestanya del navegador.
Afegeix una secció amb una opció d’imatge al lloc web
![Square-Online-Add-Section-with-Image-Option-CA](http://images.ctfassets.net/gc4s9mi2asix/205KFfGShajKuSEVkBeZBm/c5e0feaf4793c6b862a7bcdd99406e12/Screen_Shot_2022-09-14_at_1.02.54_PM.png)
Per afegir una imatge al web, primer obre l’editor de webs de Vendes en línia Square i escull o crear una pàgina on afegir-la. A continuació, selecciona + > Secció per obrir el menú de seccions.
La majoria de seccions de la categoria Organitza inclouen una imatge que no és de fons. Selecciona qualsevol secció per veure com queda a la pàgina. També pots afegir-hi una altra secció i modificar-ne la imatge de fons. Quan trobis una que t’agradi, selecciona Afegeix per afegir-la a la pàgina.
Afegeix una imatge a la secció
![Square-Online-Image-Asset-Manager-in-Editor-CA](http://images.ctfassets.net/gc4s9mi2asix/4eVhn2fkTjLV3l8SmGCeZe/cee93f53ee9d4f46f7461bc9502c2c3d/CA.png)
Per afegir imatges a la secció:
Que no són de fons: a l’opció d’imatge del tauler d’edició, selecciona Afegeix una imatge.
De fons: al tauler d’edició, ves a Personalitza > Fons, tria Imatge al menú desplegable i selecciona Afegeix una imatge.
Amb qualsevol d’aquestes opcions, s’obrirà la finestra emergent del gestor de recursos, on podràs seleccionar o pujar les imatges.
Nota: per tenir accés a les opcions de fotos prèmium, has de millorar la subscripció de Vendes en línia Square.
Hi ha diverses opcions per afegir una imatge des de la finestra emergent de l’administrador de recursos:
- Selecciona Les meves imatges per mostrar totes les imatges generals que s’han pujat al web seleccionat del compte de Square. Si tens més d’un web, fes servir el menú desplegable Web per passar de l’un a l’altre.
- Selecciona Els meus logotips per consultar tots els que s’han pujat al web seleccionat del compte de Square. Si tens més d’un web, fes servir el menú desplegable Web per passar de l’un a l’altre.
- Selecciona Fotos prèmium per tenir accés a més de 100 milions de fotos de qualitat prèmium i sense drets d’autor (cal millorar el pla).
- Selecciona Instagram per connectar el compte d’Instagram i fer servir les fotos del teu perfil al web.
Per pujar una imatge nova, ves a Les meves imatges o a Els meus logotips a l’administrador de recursos i selecciona l’enllaç per triar un fitxer des del dispositiu. Pots pujar els tipus de fitxer d’imatge següents:
- JPG
- PNG
- GIF
A les directrius generals següents, trobaràs una sèrie de consells pel que fa a les imatges que es mostren al web de Vendes en línia Square.
Imatges que no són de fons:
- per afegir-les a una pàgina del web, la millor opció és fer servir fitxers .jpeg que no superin els 1000 píxels al costat més llarg.
- Per obtenir imatges d’alta qualitat, et recomanem que facis servir un lloc web d’allotjament de fotos per a fotògrafs (per exemple, Flickr.com) i que les incrustis al web des d’allà. Els dissenys de Square no estan pensats per a imatges de mida gran, sense comprimir ni d’alta qualitat, perquè hem d’allotjar milions d’imatges de milions de venedors i creadors. Per aquest motiu, allotjar-les amb tercers pot ser la millor manera d’assegurar-te que no perds qualitat d’imatge.
Imatges de fons:
- per a les imatges que formen part del disseny del web (p. ex., capçalera, bàner i imatges de fons), és millor fer-les servir de 2000 x 1000 píxels com a mínim. Aquesta resolució serà suficient per tenir una imatge nítida que ocupi tota l’amplada de pràcticament qualsevol mida de pantalla.
Modifica grups de seccions
Alguns dissenys de secció et permeten copiar parts de la secció anomenada Grups perquè hi puguis afegir més contingut i imatges sense haver d’afegir una altra secció a la pàgina. A Grup, al tauler d’edició, veuràs una llista dels grups que conté la secció.
Per inserir un nou grup de text i imatge al text predeterminat, selecciona Afegeix un grup. Per copiar un grup existent, selecciona ••• > Duplica. Els grups nous o duplicats es mostraran a la llista del tauler d’edició. Pots reorganitzar l’ordre dels grups a la pàgina arrossegant un grup cap a un lloc nou de la llista.
Modifica les imatges que no són de fons
![Square-Online-Edit-Non-Background-Image-CA](http://images.ctfassets.net/gc4s9mi2asix/2YNiaW6Xer2zaE1JB3l50k/b911490e2d3846807a76af063d510369/Screen_Shot_2022-09-14_at_2.40.46_PM.png)
Per modificar una imatge que no és de fons al lloc web de Vendes en línia Square:
- A l’editor de webs de Vendes en línia Square, ves a la pàgina que conté la imatge que vols modificar.
- Selecciona la secció que conté la imatge i, a continuació, selecciona la imatge en qüestió perquè apareguin les opcions d’imatge al tauler d’edició.
- Selecciona Modifica per ajustar com calgui les opcions disponibles. Si no t’agraden els canvis, selecciona Recupera l’original.
- Desa les modificacions i Publica el web per veure-hi els canvis.
Nota: depenent del disseny de la secció, veuràs més o menys opcions per editar les imatges.
Per pujar una altra imatge, selecciona Substitueix al tauler d’edició. També pots seleccionar la icona de la paperera per eliminar la imatge. Si canvies d’idea, fes servir la fletxa de Desfés per tornar un pas enrere.
Al tauler d’edició, també pots afegir un enllaç a la imatge o afegir text alternatiu per millorar el SEO i l’accessibilitat web. Aquí t’expliquem com afegir un enllaç al web i optimitzar les pàgines web per millorar el SEO.
Nota: l’accessibilitat és un aspecte important del disseny d’un lloc web, per fer-lo accessible a tantes persones com sigui possible, molt especialment aquelles que tenen alguna discapacitat. Pots consultar més informació sobre accessibilitat per als llocs web de Vendes en línia Square si vols veure més consells relacionats amb les imatges.
Amb totes les alternatives i solucions que existeixen, protegir del tot una imatge a internet pot ser pràcticament impossible. No obstant això, tens l’opció de fer servir les pàgines protegides amb contrasenya al lloc web de Vendes en línia Square per protegir-ne el contingut.
També pots desactivar l’opció de fer clic amb el botó dret al teu lloc web en alguns navegadors, per impedir que les imatges es puguin copiar fàcilment. Tingues en compte que fer això no et proporciona una protecció total, però ajuda a frenar alguns intents. Per desactivar el clic amb el botó dret al lloc web:
- A la Vista general de Vendes en línia Square, ves a Configuració > Eines de seguiment.
- Selecciona Afegeix un nou codi.
- A la finestra emergent, introdueix el codi i el nom del codi als camps corresponents (et mostrem el codi a continuació).
- Col·loca el codi al peu de pàgina seleccionant Final del cos.
- Selecciona Desa.
- Publica el web des de l’editor de webs de Vendes en línia Square per veure-hi els canvis.
Codi: <body oncontextmenu=”return false;”>
Hi ha molta gent que treballa amb imatges en línia (com ara fotògrafs) que, en comptes de fer això per protegir les imatges, fa servir programes de disseny gràfic per afegir un segell o una marca d’aigua a les versions en línia de les seves fotos. Tot i que això no n’evita el robatori, les protegeix de l’ús maliciós, ja que, en la majoria de casos, treure la marca d’aigua fa que la foto quedi inservible.
Modifica les imatges de fons
![Square-Online-Edit-Background-Image-CA](http://images.ctfassets.net/gc4s9mi2asix/4zeEiBlxVaDIBxCadWYXJM/16a71f8f341d86b42dea2e1a0ab17ba3/Screen_Shot_2022-09-14_at_3.19.31_PM.png)
Pots millorar la llegibilitat d’una secció a Vendes en línia Square ajustant la foscor o la claredat de la imatge de fons. Les imatges clares poden fer-se més clares si el text té per defecte un color més fosc, i les imatges fosques es poden enfosquir si el text té per defecte un color més clar. Per ajustar la llegibilitat d’una secció al lloc web de Vendes en línia Square:
- A l’editor de webs de Vendes en línia Square, ves a la pàgina que conté la imatge de fons que vols ajustar.
- Selecciona la secció on hi ha la imatge i ves a Personalitza > Fons al tauler d’edició.
- Selecciona Modifica i ajusta la llegibilitat de la imatge movent el lliscador.
- Desa les modificacions i Publica el web per veure-hi els canvis.
Si vols, també pots ampliar i redreçar la imatge de fons.
Per pujar una altra imatge, selecciona … > Substitueix al tauler d’edició. També pots seleccionar la icona de la paperera per eliminar la imatge. Si canvies d’idea, fes servir la fletxa de Desfés per tornar un pas enrere.
Per canviar la imatge de fons de la secció per un color a Vendes en línia Square:
- A l’editor de webs de Vendes en línia Square, ves a la pàgina que conté la imatge de fons que vols ajustar.
- Selecciona la secció on hi ha la imatge i ves a Personalitza > Fons al tauler d’edició.
- Al menú desplegable, tria Color seleccionat, per canviar-lo pel color del web que tens seleccionat, o bé Color personalitzat, per canviar-lo per un altre color.
Aquí t’expliquem com triar colors per al lloc web de Vendes en línia Square.
Modifica els vídeos de fons
Nota: si vols fer servir un vídeo com a fons, canvia a un pla superior de Vendes en línia Square.
A més de GIF d’alta qualitat, també hi pots pujar els teus propis vídeos com a fons per afegir animacions al contingut. Primer selecciona la secció de la imatge de capçalera a la pàgina web i tria Vídeo com a opció de fons al tauler d’edició. Des d’aquí, podràs substituir o eliminar el fitxer de vídeo quan vulguis. També pots ajustar l’hora d’inici, l’hora de finalització o la velocitat de reproducció del vídeo.
Nota: l’espai màxim d’emmagatzematge per als fitxers de vídeo és de 20 GB.
A més, al web hi pots afegir vídeos que no siguin de fons, amb so i altres funcions, mitjançant YouTube, altres allotjadors de vídeo o els teus propis fitxers. Aquí tens més informació sobre com incloure vídeos al lloc web.
Opcions d’imatge a la versió per a mòbils del web
Tot i que la versió per a mòbils del lloc web no es pot modificar per separat respecte de la versió d’ordinador, tens opcions d’imatge específiques per a mòbils, pensades perquè les imatges tinguin el millor aspecte possible sigui quina sigui la mida de la pantalla. Entre les opcions hi ha:
Pots ajustar el punt focal de la imatge de fons d’una secció perquè el tema de la imatge es mantingui centrat al lloc web per a mòbils de Vendes en línia Square. Per començar:
- A l’editor de webs de Vendes en línia Square, ves a la pàgina que conté la imatge de fons que vols configurar per a mòbils.
- Selecciona la secció on hi ha la imatge i ves a Personalitza > Fons al tauler d’edició.
- Selecciona … > Estableix el tema de la imatge.
- Col·loca el punt indicador al tema o element principal de la imatge de fons. Això ajudarà a mantenir-lo sempre centrat al lloc web per a mòbils.
- Selecciona Desa quan hagis acabat. Pots assegurar-te que la modificació s’ha fet correctament al lloc web per a mòbils si canvies a la vista per a mòbils. Ajusta-la de nou a la versió per a ordinador com escaigui.
- Publica el lloc web per veure-hi els canvis.
Resolució de problemes
Si has pujat diverses imatges al lloc web de Vendes en línia Square amb el mateix nom de fitxer, és possible que es comportin de maneres no desitjades. Per exemple, pot ser que es mostrin de sobte a la pàgina equivocada, que canviïn de lloc o, fins i tot, que no es mostrin. Per evitar-ho, comprova que cada imatge tingui un nom de fitxer diferent abans de pujar-la a l’editor de webs.
Si tens aquest problema, prova els passos següents per solucionar-ho:
A l’editor de webs de Vendes en línia Square, elimina totes les imatges que es mostren de manera incorrecta.
A l’ordinador o al dispositiu, comprova que tots els fitxers d’imatge tinguin noms propis i diferents.
A l’editor de webs, torna a pujar les imatges al lloc web.
Publica el web perquè s’hi mostrin els canvis.