| 6dd74de | | | 1 | > **Warning** |
| 6dd74de | | | 2 | > |
| 6dd74de | | | 3 | > ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. |
| 6dd74de | | | 4 | > |
| 6dd74de | | | 5 | > ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/configuration.md](../../packages/mermaid/src/docs/config/configuration.md). |
| 6dd74de | | | 6 | |
| 6dd74de | | | 7 | # Configuration |
| 6dd74de | | | 8 | |
| 6dd74de | | | 9 | When mermaid starts, configuration is extracted to determine a configuration to be used for a diagram. There are 3 sources for configuration: |
| 6dd74de | | | 10 | |
| 6dd74de | | | 11 | - The default configuration |
| 6dd74de | | | 12 | - Overrides at the site level are set by the initialize call, and will be applied to all diagrams in the site/app. The term for this is the **siteConfig**. |
| 6dd74de | | | 13 | - Frontmatter (v10.5.0+) - diagram authors can update selected configuration parameters in the frontmatter of the diagram. These are applied to the render config. |
| 6dd74de | | | 14 | - Directives (Deprecated by Frontmatter) - diagram authors can update selected configuration parameters directly in the diagram code via directives. These are applied to the render config. |
| 6dd74de | | | 15 | |
| 6dd74de | | | 16 | **The render config** is configuration that is used when rendering by applying these configurations. |
| 6dd74de | | | 17 | |
| 6dd74de | | | 18 | ## Frontmatter config |
| 6dd74de | | | 19 | |
| 6dd74de | | | 20 | The entire mermaid configuration (except the secure configs) can be overridden by the diagram author in the frontmatter of the diagram. The frontmatter is a YAML block at the top of the diagram. |
| 6dd74de | | | 21 | |
| 6dd74de | | | 22 | ```mermaid-example |
| 6dd74de | | | 23 | --- |
| 6dd74de | | | 24 | title: Hello Title |
| 6dd74de | | | 25 | config: |
| 6dd74de | | | 26 | theme: base |
| 6dd74de | | | 27 | themeVariables: |
| 6dd74de | | | 28 | primaryColor: "#00ff00" |
| 6dd74de | | | 29 | --- |
| 6dd74de | | | 30 | flowchart |
| 6dd74de | | | 31 | Hello --> World |
| 6dd74de | | | 32 | |
| 6dd74de | | | 33 | ``` |
| 6dd74de | | | 34 | |
| 6dd74de | | | 35 | ```mermaid |
| 6dd74de | | | 36 | --- |
| 6dd74de | | | 37 | title: Hello Title |
| 6dd74de | | | 38 | config: |
| 6dd74de | | | 39 | theme: base |
| 6dd74de | | | 40 | themeVariables: |
| 6dd74de | | | 41 | primaryColor: "#00ff00" |
| 6dd74de | | | 42 | --- |
| 6dd74de | | | 43 | flowchart |
| 6dd74de | | | 44 | Hello --> World |
| 6dd74de | | | 45 | |
| 6dd74de | | | 46 | ``` |
| 6dd74de | | | 47 | |
| 6dd74de | | | 48 | ## Theme configuration |
| 6dd74de | | | 49 | |
| 6dd74de | | | 50 | ## Starting mermaid |
| 6dd74de | | | 51 | |
| 6dd74de | | | 52 | ```mermaid-example |
| 6dd74de | | | 53 | sequenceDiagram |
| 6dd74de | | | 54 | Site->>mermaid: initialize |
| 6dd74de | | | 55 | Site->>mermaid: content loaded |
| 6dd74de | | | 56 | mermaid->>mermaidAPI: init |
| 6dd74de | | | 57 | ``` |
| 6dd74de | | | 58 | |
| 6dd74de | | | 59 | ```mermaid |
| 6dd74de | | | 60 | sequenceDiagram |
| 6dd74de | | | 61 | Site->>mermaid: initialize |
| 6dd74de | | | 62 | Site->>mermaid: content loaded |
| 6dd74de | | | 63 | mermaid->>mermaidAPI: init |
| 6dd74de | | | 64 | ``` |
| 6dd74de | | | 65 | |
| 6dd74de | | | 66 | ## Initialize |
| 6dd74de | | | 67 | |
| 6dd74de | | | 68 | The initialize call is applied **only once**. It is called by the site integrator in order to override the default configuration at a site level. |
| 6dd74de | | | 69 | |
| 6dd74de | | | 70 | ## configApi.reset |
| 6dd74de | | | 71 | |
| 6dd74de | | | 72 | This method resets the configuration for a diagram to the overall site configuration, which is the configuration provided by the site integrator. Before each rendering of a diagram, reset is called at the very beginning. |