Identidad Visual
La seccion de Identidad Visual te permite personalizar la apariencia de tu empresa en todas las paginas publicas, incluyendo vacantes y pagina de carrera.
Acceder a Identidad Visual
- Ve a Mis Empresas
- En la empresa deseada, haz clic en el menu de acciones
- Selecciona "Identidad Visual"
Que puedes personalizar
Informacion de la empresa
| Campo | Descripcion | Limite |
|---|---|---|
| Nombre de empresa | Nombre que aparece en headers | 255 caracteres |
| Tagline | Eslogan o frase corta | 500 caracteres |
| URL del sitio web | Enlace a tu pagina principal | URL valida |
Logo
Formatos soportados:
- PNG (recomendado para logos con transparencia)
- JPEG/JPG
- GIF
- WebP
- SVG
Especificaciones:
- Tamano maximo: 5 MB
- Dimensiones recomendadas: 300 x 100 pixeles
- Proporcion: Horizontal funciona mejor
Para subir un logo:
- Haz clic en "Subir Logo"
- Selecciona el archivo de tu computadora
- El logo aparece en la vista previa
- Guarda los cambios
Para eliminar el logo:
- Haz clic en el icono de eliminar junto al logo
- Confirma la eliminacion
- Guarda los cambios
Texto alternativo del logo
El texto alternativo (alt text) es importante para:
- Accesibilidad (lectores de pantalla)
- SEO
- Cuando la imagen no carga
Ejemplo: "Logo de Mi Empresa" o "Mi Empresa - Soluciones Tecnologicas"
Configuracion de colores
Colores disponibles
| Color | Uso | Valor por defecto |
|---|---|---|
| Color primario | Botones, enlaces, acentos | #1890ff (azul) |
| Color secundario | Elementos secundarios, tags | #52c41a (verde) |
| Fondo del header | Background del encabezado | #001529 (azul oscuro) |
| Texto del header | Texto y logo en el header | #ffffff (blanco) |
Selector de color
Para cambiar un color:
- Haz clic en el campo de color
- Usa el selector visual o escribe el codigo hexadecimal
- El cambio se refleja en la vista previa
Colores preestablecidos
El selector incluye colores sugeridos:
- Azules: #1890ff, #2f54eb
- Verdes: #52c41a, #13c2c2
- Rojos: #f5222d
- Morados: #722ed1, #eb2f96
- Naranjas: #fa541c, #fa8c16, #faad14
- Neutros: #001529, #262626, #ffffff, #000000, #f0f0f0
Formato de color
Los colores deben estar en formato hexadecimal:
- Correcto: #1890ff
- Incorrecto: rgb(24, 144, 255)
- Incorrecto: azul
Vista previa en tiempo real
Mientras editas, veras una vista previa que muestra:
- Header: Con logo, nombre de empresa y tagline
- Tarjeta de vacante simulada: Como se vera una publicacion de empleo
- Botones: Con el color primario aplicado
- Tags: Con colores secundarios
Elementos de la vista previa
| Seccion | Contenido |
|---|---|
| Header | Logo, Nombre de Empresa, Tagline de la empresa |
| Cuerpo | Desarrollador Frontend, Tags (Ciudad, Remoto, Tiempo Completo), Responsabilidades |
| Accion | Boton "Aplicar Ahora" con color primario |
Habilitar/Deshabilitar branding
Toggle de activacion
- Activo: Tu branding personalizado se muestra en paginas publicas
- Inactivo: Se usa el branding por defecto de Talivo
Cuando deshabilitar
- Mientras configuras el branding inicial
- Para pruebas A/B
- Si quieres usar temporalmente el estilo por defecto
Donde se aplica el branding
Tu identidad visual aparece en:
- Pagina de carrera: Header y estilos de toda la pagina
- Listado de vacantes: Tarjetas de cada vacante
- Detalle de vacante: Pagina individual de cada empleo
- Formulario de aplicacion: Encabezado del formulario
- Chatbot: Colores del widget (si esta habilitado)
Guardar cambios
- Realiza tus modificaciones
- Verifica en la vista previa
- Haz clic en "Guardar"
- Espera la confirmacion
Nota: Los cambios pueden tardar unos minutos en reflejarse en paginas publicas debido al cache.
Acceso a la funcion
Funcionalidad premium
La personalizacion de branding puede estar limitada segun tu plan de suscripcion:
- Plan basico: Funcionalidad limitada o no disponible
- Plan profesional: Acceso completo
Si ves un mensaje de "Funcionalidad no disponible", contacta a tu administrador sobre actualizar el plan.
Mejores practicas
Para el logo
- Usa fondo transparente: PNG o SVG con transparencia
- Alta resolucion: Minimo 300px de ancho
- Formato horizontal: Mejor legibilidad en headers
- Contraste: Asegurate que se vea bien sobre el fondo del header
Para los colores
- Contraste adecuado: Texto legible sobre fondos
- Consistencia con tu marca: Usa los colores oficiales
- Accesibilidad: Considera daltonismo y discapacidad visual
- Prueba en diferentes pantallas: Los colores pueden verse diferentes
Para el tagline
- Breve y memorable: Maximo 50-60 caracteres ideal
- Describe tu propuesta de valor: Que te hace unico
- Evita jerga interna: Debe ser claro para candidatos
Problemas comunes
"El logo no se ve bien"
Posibles causas:
- Formato no compatible
- Archivo muy grande (>5MB)
- Dimensiones inadecuadas
Solucion: Usa PNG de 300x100px con fondo transparente.
"Los colores no se ven en la pagina publica"
Causa: El branding puede estar deshabilitado.
Solucion: Verifica que el toggle "Activo" este encendido.
"Los cambios no aparecen"
Causa: Cache de la pagina.
Solucion:
- Espera 5-10 minutos
- O usa el boton de revalidar cache en la pagina de carrera
Ejemplo de configuracion
Nombre de empresa: TechCorp Solutions Tagline: Innovacion que transforma
Logo: techcorp-logo.png (300x80px, fondo transparente) Alt text: Logo de TechCorp Solutions
Color primario: #2563eb (azul corporativo) Color secundario: #10b981 (verde acento) Fondo header: #1e293b (gris oscuro) Texto header: #ffffff (blanco)
URL sitio web: https://techcorp.com Estado: Activo