Mis Áreas
Ayuda

Cómo crear un lienzo con hipervínculos

27-06-2025 20:53
  • 0 Respuestas
  • 0 Me gusta
  • 76 Visitas

¿Sabías que podemos agregar accesos directos en el lienzo para que los colaboradores ingresen fácilmente a distintas secciones de la plataforma o incluso a enlaces externos?  

 

Con esta funcionalidad, podemos dirigir a los usuarios a áreas como Objetivos, Aprendizaje, Desempeño o Habilidades, así como a páginas web externas que consideremos relevantes.

 

Para configurar accesos directos a secciones de la plataforma, primero debemos generar los enlaces correspondientes.

Estos deben seguir el formato general de los enlaces profundos, que te detallamos a continuación:

 

https://nombredelsitio.sabacloud.com/Saba/Web_spf/nombredelentorno/common/profile/plans/?moduleContext=contexto

 

Donde:

  • <nombre del sitio> y <nombre del entorno> se obtienen desde la URL de nuestro entorno Saba.
AnaJofre_0-1751049969794.png

 

 

  • El <contexto> cambia según la sección a la que quiera dirigir:

 

    • goals para Objetivos
    • learning para Aprendizaje
    • followup&filterKey=REVIEWS&typeKey=REVIEWS para Desempeño
    • competency para Habilidades

 

Para configurar los hipervínculos en el lienzo, podemos usar la herramienta de nuestra preferencia.  

 

Es este caso, vamos a usar Image Map Generator (IMG): https://www.image-map.net/

 

En primer lugar, debemos seleccionar una imagen de nuestra PC o cargar una desde un sitio web externo. 

 

AnaJofre_1-1751049969796.png

 

Una vez que subimos la imagen, dibujamos las áreas clickeables usando el cursor. Usamos el cursor para dibujar rectángulos sobre las zonas de la imagen que queremos convertir en botones

 

AnaJofre_2-1751049969814.png

 

 

 

En cada área debemos ingresar una URL del enlace y título descriptivo. Podemos agregar tantos hipervínculos sean necesarios.

 

En el campo Target, se define cómo se abrirá el hipervínculo al hacer clic sobre el área seleccionada:

  • _self: el enlace se abrirá en la misma pestaña
  • _blank: el enlace se abrirá en una nueva pestaña del navegador

 

Una vez que hayamos terminado, hacemos clic en ¡Muéstrame el código!

 

AnaJofre_3-1751049969815.png

 

 

El programa nos proporciona el código de la imagen con sus respectivos hipervínculos.

Copiamos y guardamos ese código.

 

 

 

AnaJofre_4-1751049969824.png

 

 

En segundo lugar, vamos a incorporar la imagen en la plataforma de talento

 

  1. Vamos a talento, Configurar panel de control > editar. Para que la imagen este visible para toda la nomina elegimos “Todos”

 

AnaJofre_5-1751049969869.png

 

 

  1. Subimos la imagen (sin hipervínculos).

 

 

AnaJofre_6-1751049969881.png

 

 

  1. Luego hacemos click en el símbolo del código fuente:

 

AnaJofre_7-1751049969885.png

 

 

 

  1. En el código, seleccionamos desde el asterisco después de src=" hasta el siguiente antes de alt=, y copiamos ese fragmento.

 

Esto representa el código de la imagen.

 

AnaJofre_8-1751049969888.png

 

 

  1. Pegamos ese fragmento en el lugar correspondiente dentro del código que guardamos previamente del IMG.  Luego de src=” hasta el siguiente asterisco (“)

 

 

AnaJofre_9-1751049969892.png

 

 

Para centrar el lienzo, agregamos la etiqueta <center> al inicio y al final del código.

 

AnaJofre_10-1751049969911.png

 

 

¡¡Ahora sí, guardamos!! 🤗

 

 

AnaJofre_11-1751049969936.png

 

 

 

Cuando los usuarios hagan clic en cada uno de los botones de la imagen, serán redirigidos a los hipervínculos configurados.

 

Colaboradores