El bloc Imatge amb punts calents permet afegir una imatge dins l’editor Gutenberg de WordPress amb punts interactius. Els punts calents es poden configurar per mostrar informació o enllaços quan els usuaris hi fan clic o hi passen el cursor, cosa que el fa molt útil per fer imatges interactives o guies visuals.
1. Inserir un bloc Imatge amb punts calents
Podeu afegir aquest bloc fent clic al botó “+” i cercant “Imatge amb punts calents”. Una vegada afegit, podreu pujar una imatge des de la Mediateca o bé pujar-ne una de nova.
2. Afegir i personalitzar punts calents
Després d’afegir la imatge, podeu començar a afegir punts calents clicant “Drop Point” i, a continuació, fent clic sobre el punt concret de la imatge on vulgueu afegir el punt.
Quan afegeixes un punt, apareixen algunes opcions, entre les quals destaquem:
Edició de contingut (content):
- Títol (title): Podeu afegir el títol que voleu que aparegui en clicar sobre la icona del punt calent.
- Afegir URL (enter URL): També podeu associar un enllaç URL, que s’obrirà en clicar sobre la icona del punt calent.
Edició de posició (position):
Podeu editar la posició del punt calent editant les coordenades i la posició de la icona del punt calent, tot i que és més recomanable fer-ho directament des de la imatge, arrossegant amb el ratolí la icona fins al punt que us interessi. Aquesta segona opció us permetrà ser més concrets a l’hora de ressituar la posició de la icona.
Edició d’estil (style):
- Icona (point icon): Podeu escollir la icona que voleu que aparegui sobre la imatge, que marcarà el punt calent.
- Fons de la icona (point background): Podeu canviar el fons de la icona que marca el punt calent.
Després d’aplicar algun d’aquests estils, i clicant a la icona del punt calent, la imatge quedaria així:
3. Més opcions
Clicant els tres punts a la barra d’eines, pots accedir a opcions com duplicar el bloc, suprimir-lo, moure’l, i més. També ho pots fer des de la “Vista de llista”.
