How to model an author page

An "Author" Custom Type is useful to create dedicated pages for the authors of your content.

Page structure

The author has only one name so we'll add a:

Title field to the static part of our Custom Type

1 of 4

< PreviousNext >

To write a complete biography or description of our author's life and achievements we'll use a:

Rich Text field with some formatting constraints if you don't want the content editors to be able to change the heading level

2 of 4

< PreviousNext >

We'll add an :

Image field with responsive views to manage our author's profile picture

3 of 4

< PreviousNext >

The social media links are going to be modeled with a repeatable group of two fields as follows:

Inside a "Group field":

Key Text field for the label of the social media link
Link field for its URL

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

{
  "Main": {
    "fullname": {
      "type": "StructuredText",
      "config": {
        "single": "heading1",
        "label": "Full Name",
        "placeholder": "Author's Full Name"
      }
    },
    "bio": {
      "type": "StructuredText",
      "config": {
        "multi": "paragraph, strong, em, hyperlink, list-item, o-list-item",
        "allowTargetBlank": true,
        "label": "Author's bio",
        "placeholder": "Enter a short description of the author"
      }
    },
    "profile_picture": {
      "type": "Image",
      "config": {
        "constraint": {
          "width": null,
          "height": null
        },
        "thumbnails": [
          {
            "name": "thumbnail",
            "width": 75,
            "height": 75
          }
        ],
        "label": "Profile picture"
      }
    },
    "social_media": {
      "type": "Group",
      "config": {
        "fields": {
          "name": {
            "type": "Text",
            "config": {
              "label": "Name",
              "placeholder": "Social media name"
            }
          },
          "link": {
            "type": "Link",
            "config": {
              "allowTargetBlank": true,
              "label": "Link",
              "placeholder": "Link to the social media page"
            }
          }
        }
      }
    }
  }
}See More

How to model an author page

Page structure

How to set it up in Prismic

What editors will see

Read next

Table of Contents