Mode Embed | Documentation Siovos Archi

Vue d'ensemble#

Le mode Embed permet d'afficher vos diagrammes d'architecture directement dans d'autres applications via une iframe. C'est ideal pour integrer vos architectures dans votre documentation existante.

Activer le mode Embed#

Ouvrez votre projet
Allez dans Parametres du projet (icone engrenage)
Dans la section Partage, activez Mode Embed
Un code d'integration est genere automatiquement

Section Partage et Integration dans les parametres du projet

Code d'integration#

Une fois active, vous obtenez un code iframe :

<iframe
  src="https://app.archi.siovos.com/embed/votre-project-id"
  width="100%"
  height="600"
  frameborder="0"
  allowfullscreen
></iframe>

Parametres disponibles#

Parametre	Description	Valeur par defaut
`width`	Largeur de l'iframe	`100%`
`height`	Hauteur de l'iframe	`600px`
`theme`	Theme (light/dark/auto)	`auto`
`zoom`	Niveau de zoom initial	`1`
`fit`	Ajuster a la vue	`true`

Exemple avec parametres :

<iframe
  src="https://app.archi.siovos.com/embed/votre-project-id?theme=dark&fit=true"
  width="100%"
  height="800"
  frameborder="0"
  allowfullscreen
></iframe>

Integrations#

Notion#

Dans Notion, tapez /embed
Collez l'URL d'embed : https://app.archi.siovos.com/embed/votre-project-id
Ajustez la taille si necessaire

Le diagramme s'affiche directement dans votre page Notion.

Confluence#

Dans Confluence, utilisez la macro iframe
Collez l'URL d'embed
Configurez la hauteur (recommande : 600px minimum)

Documentation (Docusaurus, GitBook, etc.)#

Ajoutez directement le code iframe dans vos fichiers Markdown/MDX :

<iframe
  src="https://app.archi.siovos.com/embed/votre-project-id"
  width="100%"
  height="600"
  frameborder="0"
  allowfullscreen
></iframe>

README GitHub#

GitHub ne supporte pas les iframes dans les README, mais vous pouvez :

Ajouter un lien vers l'embed
Utiliser une image statique avec un lien
Integrer dans votre documentation GitHub Pages

Mode lecture seule#

L'embed est toujours en lecture seule :

Les visiteurs peuvent naviguer (pan/zoom)
Aucune modification possible
Pas de creation de nodes
Pas d'acces aux commentaires

Vue embed d'un diagramme en lecture seule

Securite#

Acces#

L'URL d'embed est unique et non-indexee. Seules les personnes avec le lien peuvent voir le diagramme.

Desactiver#

Pour revoquer l'acces :

Allez dans les parametres du projet
Desactivez le mode Embed
L'ancien lien ne fonctionne plus

Une nouvelle URL sera generee si vous reactivez le mode.

Token de securite#

Chaque URL embed contient un token unique. Si vous pensez que le lien a ete compromis :

Desactivez le mode Embed
Reactivez-le
Un nouveau token est genere
Mettez a jour vos integrations

Personnalisation visuelle#

Theme#

L'embed respecte le parametre theme :

light : Force le theme clair
dark : Force le theme sombre
auto : Suit les preferences systeme du visiteur

Fit to view#

Avec fit=true, le diagramme est automatiquement ajuste pour etre visible entierement au chargement.

Zoom initial#

Controlez le niveau de zoom initial avec zoom=0.8 (80%), zoom=1 (100%), etc.

Performance#

Chargement#

L'embed est optimise pour un chargement rapide :

Assets minimises
Mise en cache
Chargement progressif

Responsive#

L'embed s'adapte a la taille du conteneur :

Utilisez width="100%" pour une largeur fluide
Definissez une hauteur minimale appropriee

Limitations#

Fonctionnalites non disponibles#

Modification des nodes/edges
Commentaires
Panneau de proprietes
Export
Checklist

Navigateurs supportes#

L'embed fonctionne sur tous les navigateurs modernes :

Chrome, Firefox, Safari, Edge
Mobile (iOS, Android)

Cas d'usage#

Documentation technique#

Integrez vos architectures directement dans votre documentation pour que les developpeurs aient toujours la reference a jour.

Onboarding#

Ajoutez les diagrammes dans vos documents d'onboarding pour aider les nouveaux arrivants a comprendre l'infrastructure.

Presentations#

Utilisez l'embed dans vos slides pour des presentations interactives (les spectateurs peuvent zoomer).

Wiki d'entreprise#

Centralisez vos architectures dans votre wiki avec des embeds, tout en maintenant une source unique de verite dans Siovos Archi.

Prochaines etapes#

Raccourcis clavier : Gagnez en productivite