--- title: "Custom Personal Background Page" slug: "custom-personal-background-page" description: "Customize a personal background page in Slate for detailed applicant data, integrating address widgets for accuracy." updated: 2026-08-05T14:50:50Z published: 2026-08-05T14:50:50Z canonical: "knowledge.technolutions.net/custom-personal-background-page" --- > ## Documentation Index > Fetch the complete documentation index at: https://knowledge.technolutions.net/llms.txt > Use this file to discover all available pages before exploring further. # Custom Personal Background Page > [!NOTE] > šŸ“š Part of the series **Application Building Phase II:** [**The Slate-hosted Application**](/v1/docs/introduction-to-the-slate-hosted-application) In the default Slate-Hosted Application, the personal background page (identified by the part ID `per`) consists of a pre-made module that allows students to enter their name, addresses, contact information, and biographical details. This article covers the creation of a **custom personal background page** in the Slate-Hosted Application using a Slate-Hosted Application Page-scoped form. ![](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/Personal%20background%20page(2).png?sv=2026-02-06&spr=https&st=2026-10-12T11%3A53%3A30Z&se=2026-10-12T12%3A53%3A30Z&sr=c&sp=r&sig=b2nYtxNm4TRynyk%2BBIE8651QNLeVixzfcZOEAtM%2FkvM%3D) ## Before you begin There are four main steps to recreating the personal information page in the Slate-hosted application: 1. Create a *Personal Background* form with the scope **Slate-hosted Application Page**. This form will contain the personal background questions and a special Address widget that opens a popup where the applicant can add multiple addresses. 2. Create another form that stores contains the **Address widget**. 3. Add the Address widget form to the host form, as well as any other fields with which you want to collect personal information. 4. In the **Application Editor**, add the Slate-hosted Application Page-scoped form to an application. If you don’t feel like doing all that, or if you just want a finished product to work from, you can import our example personal background page form and customize it as needed. #### Try an example with Suitcase šŸ’¼ Use [Suitcase](/v1/docs/suitcase-import) to import our ready-made example personal background page form. Open and re-save each form field to break caching from the suitcase import. This suitcase contains: - Slate-hosted Personal Background page - The address widget form ```ID 547028c0-5602-4dfc-a916-3aaeac21442a:slate-examples ``` ## Step 1: Creating the *Personal Background* Slate-hosted application page In addition to hosting the address widget, this form will include the rest of the personal background form fields applicants will complete. To create the Slate-hosted application page: 1. Go to **Forms**. 2. Select **New Form**. 3. Configure the following settings: - **Page Title**: The page title will display to an applicant as the name of the page. Enter something like `Personal Background`. - **Folder:** Keep organized by saving application pages within a clear folder structure. - **Status:** Set the status to **Confirmed/Active**. 4. Select **Save**. 5. Select **Edit Form**. 6. Select **Edit Properties**. 7. In the Edit Properties popup, configure the following: - **General Settings:** From the *Scope* list, select **Slate-Hosted** **Application Page.** - **Merge Fields:** Add any desired exports that should pulled into the form. ![](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/4892402564763.png?sv=2026-02-06&spr=https&st=2026-10-12T11%3A53%3A30Z&se=2026-10-12T12%3A53%3A30Z&sr=c&sp=r&sig=b2nYtxNm4TRynyk%2BBIE8651QNLeVixzfcZOEAtM%2FkvM%3D) 8. Select **Save.** 9. **With the exception of the address block**, add the [form fields](/v1/docs/form-palette) to collect all the personal information required from your applicants. > [!CAUTION] > šŸ”” Important! > > You must collect the personal information page’s address information with another, embedded form that uses the **Address widget**, which we’ll cover in the next section. If you use a [Street Address](/v1/docs/form-palette#street-address) or [Location](/v1/docs/form-palette#location) [form field widget](/v1/docs/form-palette) to collect address information on a Slate-hosted application page, you run the risk that submitted address data loses its `region` value. ## Step 2: Creating an *Address Information* form The Address widget lets the user submit more than one address. It is stored on its own form with the *widget* scope. We’ll embed this form onto your original Slate-hosted application form later on. To create the form that stores the Address widget: 1. Go to **Forms**. 2. Select **New Form**. 3. Configure the following settings: - **Page Title:** Give the form a name, like `Custom Address Widget (Personal Background Page)`. - **Status:** Confirmed/Active - **Folder:** Add the form to an existing folder, or select **Other** to create a new one. 4. Select **Save**. 5. Select **Edit Form.** 6. Select **Edit Properties**. 7. Configure the following settings: - **Scope:** Select **Address Widget** from the *Page Construction Widgets* section. - **Custom List Fields:** Add exports, filters and sorts as needed to present the applicant's submitted information on the application page. For example, you could create a *Location* [subquery export](/v1/docs/subquery-exports-outputs) that builds a full location (with conditional comma) out of the address parts that exist: ![](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/4892662558747.png?sv=2026-02-06&spr=https&st=2026-10-12T11%3A53%3A30Z&se=2026-10-12T12%3A53%3A30Z&sr=c&sp=r&sig=b2nYtxNm4TRynyk%2BBIE8651QNLeVixzfcZOEAtM%2FkvM%3D) The example *Location* subquery export, expanded: ![](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/4892906298907.png?sv=2026-02-06&spr=https&st=2026-10-12T11%3A53%3A30Z&se=2026-10-12T12%3A53%3A30Z&sr=c&sp=r&sig=b2nYtxNm4TRynyk%2BBIE8651QNLeVixzfcZOEAtM%2FkvM%3D) 8. Select **Save**. 9. Configure the widget with the form fields applicants should complete. > [!WARNING] > šŸ“ Note > > Map all fields in the widget to system fields of the same scope. Any custom fields created to be used in the widget should match the scope of the widget. ## Step 3: Embedding the *Custom Address Widget* form on the *Personal Background* form with a Widget Table Now, we’ll add the Address widget to the first form we made. 1. Return to the *Personal Background* form you [made earlier](/v1/docs/custom-personal-background-page#step-1-create-the-slatehosted-application-page). 2. From the form builder palette, drag in a **Widget Table**. 3. From the **Widget Form** list, select the widget form created in the previous section. ![Add_Address_Widget_to_Host_Form.png](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/4893158018587.png?sv=2026-02-06&spr=https&st=2026-10-12T11%3A53%3A30Z&se=2026-10-12T12%3A53%3A30Z&sr=c&sp=r&sig=b2nYtxNm4TRynyk%2BBIE8651QNLeVixzfcZOEAtM%2FkvM%3D) 4. Select **Save.** 5. Add any additional fields or instructions to the form. ## Step 4: Adding the host form to a Slate application 1. Go to **Database** → **Application Editor**. 2. Select the `/apply/` link for the application base to which you want to add the new page. **NOTE**: If only one application base exists, only `/apply/` will appear. 3. Select **Edit Menu**. 4. Select **Add Link**. 5. Configure the following settings: - **Type**: Custom Form Page - **Subtype**: Select the Slate-Hosted-Application-Page-scoped form you created. - **Label**: Enter the name to display as the page link in the application navigation. 6. Select **Save**. The new form appears at the bottom of the application menu. 7. Drag this page to where it belongs in the application page order. ![](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/4893485256731.png?sv=2026-02-06&spr=https&st=2026-10-12T11%3A53%3A30Z&se=2026-10-12T12%3A53%3A30Z&sr=c&sp=r&sig=b2nYtxNm4TRynyk%2BBIE8651QNLeVixzfcZOEAtM%2FkvM%3D) The application form widget is now active in the application. Be sure to test that data entered into the widget is saving back to the appropriate table on the Profile tab of the Person record. > [!TIP] > ⭐Best Practice: Auto-PDF > > Application form widgets, and by extension the custom application pages that use them, lack some compatibility with the Slate [Auto PDF](/v1/docs/auto-pdf) feature, which converts application data into automatically generated PDFs. When Slate converts the application data, the questions asked in a form page appear, but *submitted widget information* will not. To get the most out of your Slate-hosted application, we suggest migrating your reading process from Auto PDF to a [custom portal dashboard](/v1/docs/portals-in-reader) that supports all new widget functionality. ## Region values are missing from application address entry If you’re collecting applicant address information on the personal background page directly with an *Address* form field, you might find that `region` data is being dropped from submissions. You can fix this on an existing personal background page by following steps to [create an address form](/v1/docs/custom-personal-background-page#step-2-create-the-address-widget) and [embed that form on the Personal Background form with a Widget Table](/v1/docs/custom-personal-background-page#step-3-adding-the-address-widget-to-the-host-form). ## Further customization If you’re looking to collect applicants’ birth address information or use their supplied citizenship data to conditionally display other parts of the personal background page form, see [Customizing Additional Details on the Personal Background Page](/v1/docs/using-location-block-to-capture-birth-address).