Video recording in the Advanced WYSIWYG editor

Prev Next

NOTE

Floik AI features are available across all Document360 plans as an add-on. To purchase or learn more, please contact our support team.

Document360 offers built-in screen recording and formatting options, allowing you to capture your screen and enhance the video directly within your articles without needing external tools.

For instance, technical writers often need to add visuals to their articles. Switching between different tools to record and insert videos takes time. Instead of using multiple screenshots, they can use Document360’s built-in screen recording to create video demos. This helps readers understand better. Writers can edit videos with tools like blur, spotlight, crop, and trim before publishing.


Accessing the Screen recorder

To access the screen recorder:

  1. Navigate to the desired article in the Advanced WYSIWYG editor.

  2. Type the Slash command /Record video and press Enter.

  3. If you haven't installed the Document360 Screen Recorder extension, Click Install.

    NOTE

    This extension is currently supported only in the Chrome browser.

  4. Click Add to Chrome in the Chrome web store page.

  5. Once installed, return to the Knowledge base portal.

Accessing the screen recorder in the Advanced WYSIWYG editor

Recording the screen

  1. The Video capture panel will appear with two options:

    • Screen only video: Captures only the screen.

      1. If you select Screen only video, the Screen only video panel will appear.

      2. Select the desired audio from the dropdown, if required. If no audio is needed, select No audio.

      3. Click Next.

    • Screen + Camera video: Captures both the screen and the presenter via the camera.

      1. If you select Screen + Camera video, the Screen + Camera video panel will appear.

      2. Select the desired camera and audio options from the dropdown menus.

      3. Click Next.

  2. Select the screen to capture:

    • Chrome tab: Records only the selected Chrome tab.

    • Window: Records only the selected window.

  3. Click Share.

    The selected screen will appear along with the Screen recording panel.

  4. Choose the recommended resolution (16:9 or 4:3).

  5. Click Start capturing to begin recording.

  6. Click Discard to cancel and return to the previous screen.

  7. In the Blur selected section, click Add to hide specific areas of the screen when recording sensitive information.

  8. If needed, enable the Show recording controls on screen toggle. A Document360 logo will appear in the bottom left corner of the recording screen. Clicking the logo will pause the recording. This logo will also be visible in the recorded video.

During recording, mouse clicks and interactions will be captured, with click indicators displayed for easier guide editing.

  1. Click Pause to pause the recording and Record to resume.

  2. To stop recording, click Stop sharing in the floating panel or Stop recording in the Screen recording panel.

    After recording, the system will take some time to import the video into the article.

Recording a video using the Record video feature in the Advanced WYSIWYG editor

Adding interactive elements

Once processed, the recorded video will appear in the Video editor panel.

  1. Click the Play () icon to preview the recorded video.

    The Video editor provides formatting tools, including:

Video editor interface showing project settings and editing options for content creation.

Add elements:

a. Call to action: To add an interactive button in the video

  1. Enter the title and description.

  2. In the Branches section, enter the button name and select the desired action:

    1. External URL: Enter the destination link.

    2. Next step: Displays a message or information for the user.

  3. Click Add new to include another button.

  4. Choose the desired button position under the Position section.

  5. Enable the AI voiceover toggle to add narration:

    1. Select a voice.

    2. Enter the narration script.

    3. Click the Play icon to preview.

  6. Click Apply.

It shows how to add a call out action button to a recording video in the Advanced WYSIWYG editor

b. Blur: Hide sensitive information in screen recordings

  1. Click Add new to blur areas in the video.

  2. Enter a name for the blur.

  3. Select the Start time and End time for the blur. Use the Fine-tune milliseconds () option for precise adjustments.

  4. Choose a shape: Circle or Rectangle.

  5. Adjust the Intensity slider to modify opacity.

  6. Click Apply to save changes.

It shows how to add a blur element to a recording video in the Advanced WYSIWYG editor

c. Spotlight: Highlight important areas in the video

  1. Click Add to create a spotlight.

  2. Enter a name for the spotlight.

  3. Select the Start time and End time. Use the Fine-tune milliseconds () option for precise adjustments.

  4. Choose a shape: Circle or Rectangle.

  5. Click Apply to save changes.

It shows how to add a spotlight element to a recording video in the Advanced WYSIWYG editor

Edit

d. Crop

  1. Select an Aspect ratio: Original, Custom, Square, Landscape, or Portrait.

  2. Adjust the Crop output (width and height) based on the selected ratio.

  3. Click Apply to save changes.

It shows how to crop a recording video in the Advanced WYSIWYG editor

e. Trim

To trim any part of the recorded video:

  1. Click Add now to add a new trim to the video.

  2. Set the From and To timings.

  3. Click Apply and click Done.

It shows how to trim a recording video in the Advanced WYSIWYG editor

Voice

You can choose how the video is narrated:

  1. Original voice: Uses the original background voice.

  2. AI voice: Allows AI-generated voiceovers in multiple languages.

  3. Click AI voiceover to select the desired AI voiceover from multiple languages. The video script will be rendered in the Script section.

  4. No voice: No voiceover will be applied.

  5. Subtitles: Click Subtitles to add subtitles to the videos. If the video has a voiceover, the auto-generated subtitles will appear here, and you can edit them as needed.

    Alternatively, you can manually enter your own voiceover script. Enable the Display subtitles checkbox to show subtitles in the video.

  6. In the Added elements dropdown, you can view the elements that are added in the video. From here, click the Edit () icon to edit the desired element. Click the Delete () icon next to the elements to delete, and click the Eye () icon to hide the mouse clicks across the video.

  7. Click Close to save changes.

NOTE

The maximum video size for recording video is 150 MB.

Editing the recorded video

Once the video is added to an article, you can apply the following formatting options:

Editing options available for a recorded video in the Advanced WYSIWYG editor

  1. Align left: Aligns the video to the left.

  2. Center: Aligns the video to the center.

  3. Align right: Aligns the video to the right.

  4. Inline left: Places the video inline on the left.

  5. Inline block: Displays the video as an inline block element.

  6. Inline right: Places the video inline on the right.

  7. Resize: Adjusts the video dimensions.

  8. Copy: Copies the video to the clipboard for reuse in another article or category within the same project.

  9. Edit: Allows further modifications, including:

    • Add elements: Blur and Spotlight

    • Edit: Crop, Trim, and Music

    • Voice: Original voice, AI voice, and No voice