Skip to main content

Snippets

The video gives you details about what snippets are and these design components can be used to enhance your web application.

1. Adding a Snippet​

Go to Snippets, click Add Snippet and create your design element for the web page and choose Create Snippet.

DrapCode SignUp Form

2. Dropping a Snippet​

Go to Components and in Pre-built Sections choose the snippet for eg., footer (for this use case). Then drag-and-drop it onto the page. Similarly, you can choose as per your preference.

DrapCode SignUp Form

3. Adding the Same Snippet on Every Page​

Go to Pages choose Snippet. Then drag-and-drop it onto the new page.

DrapCode SignUp Form

3.1 mention the Snippet to Duplicate​

A pop-up will appear in which you can mention the snippet which you wnat to duplicate onto this page i.e., footer in this use case. Then Save.

DrapCode SignUp Form

4. Preview the Snippet​

Go to Preview and it will display the common snippet.

DrapCode SignUp Form

5. Moving the Snippet Layer​

Once you add a snippet its layer is created which you can add and move from the many layers by dragging-and-dropping.

DrapCode SignUp Form

You can modiy the main snippet and save. You can then preview its changes on every page that has that snippet.

DrapCode SignUp Form