¿Qué es un organigrama embebido y por qué te conviene tenerlo en tu web?
Las páginas corporativas de tipo "Sobre nosotros", "Quiénes somos", "Equipo" o "Estructura" suelen ser de las más visitadas de una web empresarial. La mayoría de las empresas las dejan vacías o con una foto de grupo, porque mantener un organigrama actualizado en HTML es un infierno: cada vez que entra o sale alguien hay que avisar al equipo web, tocar el código, publicar, repasar que no se haya roto la maquetación responsive…
El embed de Organigrama Online te da el atajo: una sola vez pegas un código en tu web, y a partir de ahí cualquier cambio que hagas en el organigrama (entradas, salidas, ascensos, cambio de departamentos) aparece automáticamente en tu web corporativa en menos de un minuto. Nunca más vuelves a tocar el código.
Cómo funciona en 3 pasos
Abre el organigrama
Entra en Organigrama Online con tu cuenta Pro y abre el organigrama que quieras mostrar en la web.
Pulsa "Insertar"
En la barra superior del editor verás el botón Insertar. Pulsa, ponle un nombre identificativo (por ejemplo "Web corporativa"), elige si quieres mostrar fotos y bandas salariales y genera el código.
Pégalo en tu web
Copia el iframe generado y pégalo donde quieras en el HTML de tu web (o en el bloque que tu CMS use). Tu organigrama aparece en cuanto guardes los cambios.
El código que vas a pegar
El código es un sencillo iframe estándar. Funciona en cualquier web sin instalar plugins ni librerías. Esto es lo que pegas:
Los parámetros id y t los rellena la app automáticamente cuando generas el código — tú solo copias y pegas. El id identifica el organigrama y t es el token de inserción (revocable en cualquier momento).
¿Listo para insertar tu organigrama?
Empieza con 7 días gratis del Plan Pro. Sin tarjeta de crédito.
Cómo insertarlo según tu plataforma
Funciona en cualquier sistema que permita pegar HTML personalizado, que son básicamente todos. Estos son los más usados:
WordPress Más usado
- Edita la página donde quieres el organigrama (Gutenberg o editor clásico).
- Añade un bloque HTML personalizado (en inglés:
Custom HTML). - Pega el código del iframe.
- Pulsa Vista previa para comprobarlo y luego Publica.
No necesitas plugins. Funciona también con WPBakery, Elementor (módulo HTML) y la mayoría de page builders.
Wix
- En el editor de Wix, pulsa el botón + (Añadir).
- Selecciona Embed → Embed Code → HTML iframe.
- Pega el código en el panel que aparece.
- Ajusta el tamaño del bloque arrastrando.
- Publica los cambios.
Squarespace
- En el editor de página, añade un Code Block (bloque de código).
- Asegúrate de que está en modo HTML (no Markdown).
- Pega el código del iframe.
- Guarda y publica los cambios de la página.
Webflow
- Arrastra un Embed element a tu canvas en el editor de Webflow.
- Se abre un editor de código — pega el iframe.
- Guarda y publica el sitio.
Web propia (HTML)
- Abre el archivo HTML de la página donde quieres mostrar el organigrama.
- Pega el iframe en el sitio del código donde lo necesites (por ejemplo dentro de un
<section>). - Sube el archivo a tu servidor.
Shopify, Notion, Confluence…
- Cualquier herramienta que permita pegar HTML/iframe sirve.
- En Shopify usa el bloque Custom HTML.
- En Notion los iframes funcionan vía /embed.
- En Confluence usa la macro HTML (si el admin la tiene activada).
Qué se ve y qué NO se ve en el embed
El embed muestra solo lo que decidas tú al generar el código. Por defecto está configurado para máxima privacidad:
| Información | Por defecto | Configurable |
|---|---|---|
| Nombre, cargo y departamento | SÍ visible | No (siempre visible) |
| Estructura jerárquica completa | SÍ visible | No (siempre visible) |
| Antigüedad (si la has rellenado) | SÍ visible | No (siempre visible) |
| Fotos de las personas | SÍ visible | Sí, puedes ocultarlas |
| Bandas salariales (mín-máx) | OCULTAS | Sí, puedes mostrarlas |
| Posibilidad de editar | NO | No (nunca editable desde el embed) |
| Posibilidad de descargar | NO | No (nunca descargable desde el embed) |
| Lista de colaboradores invitados | NO | No (invisible siempre) |
¿Cómo se actualiza automáticamente?
El embed comprueba si hay cambios en el organigrama cada 60 segundos. Si detecta una modificación (editaste un nombre, añadiste una persona, cambiaste un cargo), redibuja la vista. Es transparente para el visitante de tu web — el organigrama simplemente se actualiza sin que tenga que recargar la página.
Esto significa que mantener el organigrama de tu web al día se reduce a editar en Organigrama Online. Te ahorras el trayecto "editar Excel interno → avisar al equipo web → modificar HTML → publicar → comprobar responsive" que en empresas medianas suele tardar semanas.
Seguridad y control del token
Cada código de inserción está vinculado a un token único y privado. Tres cosas importantes:
- Revocable en un click: si el token se filtra o quieres dejar de mostrar el organigrama en una web concreta, lo revocas desde el editor. Al instante deja de funcionar.
- Vinculado a tu plan Pro: si tu suscripción Pro deja de estar activa, los embeds dejan de servir datos automáticamente (defensa server-side). Cuando vuelves a Pro, vuelven a funcionar.
- Múltiples tokens por organigrama: puedes generar uno por cada web donde quieras embeberlo (web pública, intranet, página de RRHH interna). Cada uno con sus propias opciones de visibilidad de fotos y salarios.
Casos de uso típicos
- Página "Sobre nosotros": organigrama público con fotos y cargos, sin salarios. Refuerza confianza y transparencia con clientes potenciales.
- Intranet de empleados: mismo organigrama pero con bandas salariales visibles (cumpliendo así parte de las obligaciones de transparencia retributiva 2026).
- Manual de onboarding: cuando entra alguien nuevo, ya ve quién es quién sin necesidad de PowerPoints obsoletos.
- Página de inversores: para startups, mostrar el equipo directivo y la estructura corporativa en la sección "Team" del pitch online.
- Sites de RRHH y selección: en ofertas de empleo, mostrar al candidato la estructura para que sepa dónde encajaría.
Comparativa con alternativas
| Cómo | Esfuerzo | Actualización | Coste |
|---|---|---|---|
| Organigrama Online (embed) | 5 min — copy/paste de iframe | Automática, <1 min | 5,99 €/mes Pro (incluye todo) |
| Imagen estática (PNG) en la web | Cada cambio: editar herramienta → exportar → reemplazar imagen → publicar | Manual, suele estar desactualizado | Coste del software más coste del equipo web |
| Lucidchart embed | Configuración media | Automática si pagas plan superior | Team plan $9-$30/usuario/mes |
| Visio + export a web | Alto. Requiere desarrollador. | Manual | Licencias Office + tiempo dev |
| Construir tu propio organigrama en HTML/JS | Muy alto. Días de desarrollo. | Lo que programes | Tiempo de developer (horas+€) |