👍🏼 Adding a Flourish Scroll Stories Section
From the top menu bar, click on the Add Menu (
Shortcut: M)Search for and select Flourish Scroll Stories
Select it
Hover over the canvas and click where it says Add section here
🎨 Styling Flourish Scroll Stories
Spacing top: Add padding to the top of the Flourish Scroll section in pixels or % to keep spacing between sections
Spacing bottom: Add padding to the bottom of the Flourish Scroll section in pixels or % to keep spacing between sections
Width: The width of a Flourish Scroll section can't be altered, it'll always be set to cover the 100%
Height: Set the height of the section in Pixels, % or set it to Auto so that it grows as you add content to it
Min H: Sets the minimum amount of height pixels a Flourish Scroll section can be. A red stippled horizontal line inside your section will reflect the minimum height
Clip content: Toggle to hide the content that goes beyond the section's edges
Resize to fill vertically: Click to set the section's height to 100%
Aspect Ratio
Specifying and locking the aspect ratio of a Flourish Scroll Stories section will allow you to adjust and resize it but still maintain the overall relationship between height and width.
Tip: Right-click the aspect lock to open up a menu of popular aspect ratios.
⚙️ Configuration options
Parameter | Description |
Flourish story URL | Add your story URL |
Number of slides | Calculate how long a slide should show |
Play for how long | Bottom of the page: Set the story to play until the bottom of the page
Distance: Set a specific distance in pixels
To element: Set the story to play until the specified element is reached |
Organizing Flourish Scroll Stories
Once a Flourish Scroll Stories section has been added it'll appear in the layers panel, you can drag it above or below other sections to place it where you need it in your project. Follow the steps below to learn how to do it.
Select the section in the layers panel
Click and hold it
Drag it above or below the section you want