Learn how to manage and use assets and files effectively in your documentation.
Assets and files are essential components of documentation, providing visual aids, downloadable content, and additional resources. This guide will help you understand how to manage and use assets effectively.
📁 Managing Assets
Acceptable File Types
You can use various file types in your documentation, including:
The following file types are supported:
Images
.jpeg, .jpg, .png, .gif, .svg, .tiff, .ico, .dvu
Documents and Archives
.csv, .zip, .pdf, .xls, .xlsx, .json
How to Add Assets
To add an asset to your documentation, follow these steps:
Add the asset file to the docs/assets directory of your project.
Use the following syntax to reference the asset in your Markdown files:
Replace your-asset-file.ext with the actual file name and extension.
For downloadable files, you can use the following syntax:
This will create a link that users can click to download the file.
Ensure that the asset is properly linked and accessible in your documentation.
Example of Asset inside Markdown
Example of Asset as icon
Assets can be organized as you prefer, but it's recommended to keep them in the docs/assets directory for better organization and accessibility, but you can also use subdirectories like docs/assets/images or docs/assets/icons.
FAQ
The maximum file size for assets is 10 MB. If you need to use larger files, consider hosting them externally and linking to them.
Yes, you can use external assets by linking to their URLs.
Make sure to use the correct relative path to the asset file in your Markdown. If the asset is not displaying, check the file path and ensure the file exists in the specified location.
Yes, you can use assets in custom components by referencing them with the correct relative path.
For large projects, consider organizing assets into subdirectories based on their type or usage (e.g., images, icons, documents) to keep them manageable.
Ensure that the SVG file is correctly formatted and that the path to the file is correct. Also, check if the SVG file has any restrictions on being displayed in certain contexts.
SVG icons can inherit styles from the surrounding CSS. If you want to maintain the original colors of the SVG, ensure that you do not have conflicting CSS styles applied to the icon.
Otherwise, you can set fill and stroke attributes directly in the SVG file to define the colors explicitly.
For categories icons you should use fill="currentColor" in the SVG file to inherit the color from the parent element.
