Skip to main content

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.

Add a Single Image to Your Page

  • Updated:

Who can use this feature?

System Administrator | Owner | Publisher | Author
 

 

Article Navigation

 

Not finding what you are looking for? View some additional resources.

 

New UI Instructions

  1. Click Try New UIThe button labeled Try New UI in the top-right corner of the page.
  2. Navigate to your page
  3. Click ContentThe button labeled Content in the vertical left-hand navigation menu.
  4. Search for your desired image or scroll through the available content The text entry field labeled Search Content beneath the Content header.
  5. Drag-and-drop the image onto your page The selected image being drug and dropped on the page.
  6. Configure the Image Options in the Widgets menu The Content, Widget Format, Content Appearance, and Options tabs under the Widget Options header.
    • ContentThe Widget Items in the Content tab.
      • Widget Items: View items currently within the widget
        • Actions: Modify, Preview, Delete or Remove items
    • Widget Format: Select a format The Calendar, Event, Link List, Single Image, Slideshow, and Stacked widget buttons under the Widget Format header.
      • Calendar: Monthly calendar with events
      • Event: Show as events
      • Link List: Present links, no images
      • Single Image: A single image
    • Content Appearance: Customize the inclusion and the appearance of content fields, columns, etc. The Widget Skin drop-down menu, and Remove Background Styles and Hide Loading Placeholders checkbox toggles under the Content Appearance header.
      • Widget Skin: Select a widget design skin
      • Remove Background Styles: Mark the box to remove any background styles
      • Hide Loading Placeholders: Mark the box to hide placeholders while the page is loading
    • OptionsThe Header, Link, and Alt Text text entry fields under the Options header.
      • Header: Create a header
      • Link: Assign a link to the image
      • Open in New Window: Forces the link to open in a new window when clicked
      • Alt Text: The text that will appear on the page if the image fails to load
  7. Click Save (blue disc) at the top of the page The floppy disk icon labeled Save.

 

Go to Article Navigation

 

Old UI Instructions

  1. Upload the image to the HCMS
  2. Navigate to your desired page
  3. Ensure that Live Edit is OnThe pencil icon at the top of the page to the right of the gear icon.
  4. Search for your imageThe text entry field labeled Find content and widgets below the Search header.
  5. Drag-and-drop the image to the desired location on your page The piece of content under the Recent Content header dragged and dropped onto the page.
    • Note: Available areas to drop an asset will show in blue boxes.
  6. Modify the information The dropdown menus and text entry fields in the Widget Options menu on the left-hand side of the page.
    • Widget Format: Select Single Image
      • Other options:
        • Calendar: Creates a Calendar
        • Event: Only suitable for event assets
        • Link List: Creates a dynamic list of documents
        • Slideshow: Create a slideshow
        • Stacked: Stack widgets
    • Widget Items: Will populate appropriately
    • Header: Create an Image header
    • Link: Add a link (make the image a hyperlink)
      • Open in New Window: Open the link in a new window
    • Alt Text: Create alt text for accessibility
    • Background Styles: Select to Remove Background Styles
    • Breakpoint: Change your breakpoint number to your desire
  7. Choose a saving option The button labeled Save in the top-right corner of the page, below the Try New UI button.
    • Save: Will save the version and show it to the public
    • Save as Copy: Will save the version as a copy, but not publish it to the public
    • Cancel: Will not save the changes made

 

Go to Article Navigation

Comments

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

0 comments

Please sign in to leave a comment.