How to Model a template for Modals/Pop-ups

Modals are an easy way to deliver important information and drive action. A modal is a popup dialog box that displays a small amount of content within an existing window by temporarily covering part of the window. In this article, we are going to cover how to build effective content modeling for your modals.

Page structure

Title field with h2 heading

1 of 4
< PreviousNext >

Rich Text field with multiple formatting options for the main text section

2 of 4
< PreviousNext >

Image field for the small image on the sidebar

3 of 4
< PreviousNext >

CTA button - optionally you can add a Group field to handle multiple buttons:

Key Text - button label

Link - button link

4 of 4
< PreviousNext >

How to set it up in Prismic

  • Create a new repeatable Custom Type
  • Copy the JSON below and paste it under the "JSON Editor" of this new Custom Type
CopyExpand/Collapse

What editors will see

How to model content for your project Sarah will be glad to help you come up with a solid content model for your project. (It’s free.) Schedule a call