Editing Screens

Customize captured screens
** Only when demo is captured using "Record HTML" screens will be editable **
Storylane provides quick editing capabilities for captured HTML pages so your demo can be customized.
Open "HTML" story and switch to "DESIGN" mode in the Editor for editing.
Editing Content
  • Change Text - Click on any text element and inline edit them
  • Replace Images - Click on logos or images and update them from library
  • Graphs / Charts - You can edit graph and chart text when they are captured in SVG format. When you click on the elements you will get the option to edit
Story about editing content on a screen
Anonymize Elements
  • Blur Elements - Click on any element and blur the content. Its useful to hide any sensitive data
  • Delete Element - Will completely remove the elements from the screen and auto-adjust the screen alignment.
  • Hide Element - It's useful if you don't want the screen to auto-align, and also provides option to unhide the elements later
Story about anonymising elements
Embed Content
Click on element you would like to embed with new content -> choose "Embed Content" . List of different content that can be embedded:
  • Video / GIF / Audio / PDF - upload various file types to make it interactive in the screen
  • Any Embed - You can embed media player (youtube/vimeo/loom etc), maps, charts etc
Story showing how to embed content
Global Search & Replace
Search for any text across all your screens quickly and replace them. It will list total matches found on each screen allowing you to verify and replace
Story showing how to search and replace a string, globally
Copy / Paste Elements
Click on element -> three dots -> choose "Copy Element" to copy to clipboard. Then, you can choose element you would like updated and select "Paste Element" .
Story showing how to copy/paste an element
** If you made any mistake during editing of your screen, you can click on undo icon to revert changes