Skip to main content
Web Central Quarterly Enhancements Webinar | Watch Now...

Search

We are excited to announce the launch of updated product names, logos, and headers within our user interfaces as part of the CivicPlus® Solution Rebranding initiative. These changes mark the first step toward creating a cohesive and seamless user experience across all solutions in our portfolio. As part of this transition, users may notice minor design updates. While the functionality you rely on remains unchanged, we are in the process of updating screenshots and other resources on our Help Centers to reflect the new branding. We appreciate your patience and understanding as we work to complete these updates.

Change the Appearance of a Field

  • Updated:

This article will show you how to change the appearance of a Field in an existing Form. You have the option to change the color and font of the entire Field or just the Label, Instructions, and/or Input.

 

Who can use this feature?

System Admin Slash Owner Slash.png Publisher Slash Author

  

 

Instructions

  1. Navigate to Modules > Content > Form Center
    Navigate to Form Center
  2. Select the category that contains your desired form
    select a category
  3. Select the form that contains the field you want to modify
    select a form
  4. Locate the Fields area and select the field you want to modify
    select a field
  5. Select the Visual tab
    field visual tab
  6. Modify Visual properties
    update visual tab
    • Area: Select which area to modify
      • Field: Entire field (background)
      • Label: The top label area
      • Instructions: The bottom text area
      • Input: Input area for applicable fields
    • Text: 
      • Font: Select font
      • Font Size: Select font size
      • Format: Select Bold, Italic, Underline
      • Color: Select the font color
    • Default: Select These styles are the default for this form to make this appearance the default
    • All Fields: Select Apply these styles to all fields on this form to make this appearance override for all forms on this field
  7. Click Save Changes
    field save changes
  8. Click Save
    save

Feedback About the Article

Let us know what was helpful or not helpful about the article below.

1 comment

Date Votes
  • Celena Mangus

    Some feedback for the forms center, there is an issue with accessibility with the following code:

    <textarea aria-hidden="true" id="e_28" name="fields[14].Value" style="display: none;"></textarea>

    and the code causes the following flag with monsido:

    aria-hidden="true": This attribute (aria-hidden) is set to "true," which means that the element and its content are hidden from assistive technologies like screen readers. In other words, it's making this <textarea> invisible to users who rely on screen readers to access web content.

    0

Please sign in to leave a comment.