diff --git a/editor.mdx b/editor.mdx index bae5ff72d..da93b4e03 100644 --- a/editor.mdx +++ b/editor.mdx @@ -112,6 +112,55 @@ Use the sidebar file explorer to browse your documentation files. Click on any f Press Command + P on macOS or Ctrl + P on Windows to search for files by name. +### Manage images and media + +The Images and Media view provides a centralized interface for browsing, previewing, and managing your image and video assets. + +#### Access the media manager + +Select **Images and Media** from the sidebar navigation to open the media manager. + + + Images and Media view in the visual editor + + Images and Media view in the visual editor in dark mode + + +#### View modes + +The media manager offers two view modes to help you browse your assets: + +- **Tree view**: Browse assets organized by folder structure. This view is ideal for navigating large collections of assets organized in directories. +- **Gallery view**: Browse assets as thumbnails grouped by folder. This view is ideal for quickly scanning and identifying visual assets. + +Use the view toggle button in the toolbar to switch between tree and gallery views. + +#### Preview assets + +Select any image or video asset to preview it in the preview panel. The preview panel displays: + +- Full-size preview of images +- Video playback controls for video files +- File metadata including dimensions and file size + +#### Configure assets + +Select the kebab menu icon on any file or folder to access configuration options: + +- **Configure**: View and edit file metadata including file name, path, size, and dimensions +- **Copy path**: Copy the file path to your clipboard for use in your documentation +- **Delete**: Remove the file or folder from your repository + +The configuration sheet displays detailed information about your selected asset, making it easy to reference file paths and verify asset properties. + ### Create new pages Select the **Create a new file** icon in the file explorer sidebar. diff --git a/guides/media.mdx b/guides/media.mdx index 9641c5317..3f84bf757 100644 --- a/guides/media.mdx +++ b/guides/media.mdx @@ -10,6 +10,10 @@ keywords: ["screenshots", "GIFs", "videos", "media best practices"] Screenshots, GIFs, and videos can enhance documentation but require ongoing maintenance as UI elements change. Use them selectively to avoid unnecessary upkeep. + + Use the [Images and Media view](/editor#manage-images-and-media) in the visual editor to browse, preview, and manage your image and video assets in one centralized location. + + Key guidelines: - **Media should be supplementary.** If a workflow is clear in text alone, avoid adding visuals.