ClickHelp User Manual

Insert Videos

To make your online documentation more interactive, informative, and visually attractive, you can try inserting videos in it.

As a rule, such visual content helps a lot with explaining some difficult parts of your manual to the readers. 

In ClickHelp, you can add videos from such popular web services like Vimeo, YouTube, and Screencast.com.



Insert Video from YouTube

YouTube is the biggest video-sharing service, and ClickHelp has some special functionality to work with it. When adding a video from YouTube, you get a set of additional options.

To insert a video from YouTube :

  • Go to the Insert tab of the editor's toolbar.
  • Click the Insert YouTube Video... item in the Media section.   
    The Insert Video button on the Insert tab of the Ribbon bar
  • Paste the video's URL copied from YouTube to the Insert YouTube Video dialog that will open.
    Paste the video's URL to the Insert YouTube Video dialog
  • The preview of the YouTube video will be displayed.
    The preview of the YouTube video
  • Click the More options check-box in the bottom-left corner to configure YouTube-specific options for the video.
    Click the More options checkbox in the Insert YouTube Video dialog to configure specific options
  • On the Style Setting tab, you can set the video's position in the topic, assign a CSS class , etc.
    The Style Settings in the Insert Video dialog
  • Click Ok .

Insert Video from Vimeo

To add a video from Vimeo to your help topic do the following:

  • Open your Vimeo dashboard.
  • Open a video.
  • Click the share button.
    The Share button on the Vimeo dashboard
  • Copy the embed code.
    Copy the embed code of the Vimeo video
  • Open a topic in ClickHelp.
  • Click Custom HTML.
    Click the Custom HTML button on the Insert tab of the Ribbon bar
  • Insert the code.
  • Click OK.

Insert Video from Screencast.com

To add a video from Screencast to your help topic do the following:

  • Open your Screencast dashboard.
  • Hover your mouse over a video.
  • Click the Share button.
    The Share button on the Screencast dashboard
  • Copy the embed code.
    Click the Copy button to copy the embed code of the Screencast video
  • Open a topic in ClickHelp. 
  • Click Custom HTML.
    The Custom HTML button on the Insert tab of the Ribbon bar
  • Insert the code.
  • Click OK.

Insert Videos from ClickHelp File Manager

  1. Take your video file. Typically, it has the MP4 extension/file type.
  2. Open File Manager in ClickHelp, create the Video folder to have a single place where all your videos reside.
    The File Manager button in the main menu of the Projects page
  3. Upload the MP4 file to the folder.
  4. Once the file is uploaded, click it and you will be able to copy its full URL from the box at the bottom of the File Manager dialog. OK, now you have your video file URL, so we can proceed.
  5. Open a topic you would like to insert your video into.
  6. Make a new line at the point where you need to have the video.
  7. On the editor toolbar, switch to the Insert tab and click Custom HTML
    The Custom HTML button on the Insert tab of the Ribbon bar
  8. Paste this code into the dialog that appears:
    HTML
    <video width="700px" controls="">
    <source src="/resources/Storage/video/sample-video.mp4" type="video/mp4" />
    Your browser does not support the video tag.
    </video>
    You may need to change some parts of the code above, like the video frame width in pixels or the video URL (if the name or path is different). But the code structure will remain the same - it's just a single video tag.
  9. Click Ok in the Custom HTML dialog, unlock your topic and you will see your video embedded into the topic.

That's all, your video has been added.