Skip to content
English
  • There are no suggestions because the search field is empty.

Capture a Webpage Using HTML

Capturing a webpage as HTML lets Content Developers and Instructional Designers bring a web-based screen into Skyllful Studio, and this article explains how to capture the page with the SingleFile Chrome extension, edit the HTML, and add the screen to the Screen Library.

 What tools do you need?

You need the following tools before you begin.

  • Google Chrome browser.
  • The SingleFile Chrome extension.
  • A plain text editor, such as Notepad.

Before you begin

Capture only webpages you are authorized to use. Before you capture a page, make sure any dynamic content you want to include is visible on screen. Sign in, expand menus, and load images first, because SingleFile captures only what is visible when you save.


How do you capture a webpage with SingleFile?

Step
Action
1 Install the SingleFile extension from the Chrome Web Store.
2 Pin SingleFile to your Chrome toolbar.
3 Open the webpage you want to capture.
4 Make all dynamic content visible on the page.
5 Select the SingleFile icon in the toolbar.
6 Select Save in the popup.

What happens after you capture the page?

SingleFile processes the page and downloads a single HTML file that contains the whole page. The file holds the entire page in one document, so you can edit it in a plain text editor before you bring it into Studio.


How do you add the screen to Skyllful Studio?

Step
Action
1 In Skyllful Studio, open the main menu, expand Studio, and select Screen Library.
2 Drag your HTML file into Choose files or drag and drop them here, or select the area to browse for the file.
s2_04_img01_screen-library-upload

The Screen Library upload area.

 

Note: A captured webpage is added as an HTML screen. Each screen card shows its type in the lower left corner, so an HTML screen is marked HTML. To see only these screens, set Filter by Type to HTML.


Important notes

SingleFile captures only the content that is visible when you save, so load all dynamic content first. Capture webpages only when you are authorized to use them.

If you need to change the captured page before you upload it, see Edit an HTML Capture.


Skyllful Knowledge Base | Content Developers, Instructional Designers