Skip to main content
Skip table of contents

Add Report Image

Images uploaded to the CMS must be high-resolution and should be saved with the recommended naming convention. Step-by-step guidance on saving images is available on the Getting Started with Reports in the CMS page.

Break up text into multiple Section Content blocks to place images as close to their reference as possible. For most images, the best placement will be either right before or right after the paragraph where the figure is referenced. An image might need to placed a few paragraphs from its reference in order to balance web and PDF formatting. See the Layout Options section below and the PDF Formatting page for additional guidance.

Adding an Image

  1. From the Content tab in the CMS Create Report editor, select the Add Report Image content block. 

  2. Title Text: Paste the figure title into the text field.

  3. Caption: This optional field can be used to provide additional detail or description not captured by the title. This is a useful field to use when a title is particularly long and some information can be pulled out from a title into a caption.

  4. Source Title: Paste the source title for the image into the text field. If no source should be listed for the image, leave the field blank.

  5. URL: Paste a source link if applicable. Keep the auto-populated text “<nolink>” if you are including a Source Title that does not need a URL link.

  6. Image: Select Add media to upload your figure file. All files should be prepared for upload using the high-resolution guidance.

    1. Previously uploaded Seasonal Calendars or AOC maps can be added to your report from the Media Library by searching for these files in the Name field. Review naming guidance for these image types.

    2. To add a new image: Select Choose file > select the figure file from your folder library > Open

    3. Alternative text: Provide alternative text summarizing the image using the Writing Alt Text guidance.

    4. Language: The language should match the language of the report. Select from the drop-down menu.

    5. Click Save > Insert selected. Your figure should appear in the media library and already be selected (blue outline/checkmark).

Image Formatting Settings

Don’t forget to check the formatting settings for each image.

  1. Show Figure Label: Click button to toggle on (button should appear green) for any image that should have a figure label. 
    Note: This should remain off for AFI and HFA maps and Seasonal Calendars (button should remain gray).

  2. Show full-width in PDF: Turn toggle on for figures that you would like to display full-width in the web-generated PDF.
    Note: Seasonal Calendars should always be set to show full-width (button should appear green).

  3. Float Position: The float position determines where the image will be located in the report PDF. By default, images float right; that is, they are placed in the right hand side of the PDF. To position images side-by-side in the PDF, set the first image to Float: Left and the second image to Float: Right.

Layout Options

The easiest way to build a report that looks good both on the website and the PDF is to look at the PDF formatting as you go and adjust as needed. It is best to preview the PDF after adding a few images and/or visualizations so you can adjust the layout as you go.

To preview your PDF at any time before publishing, click Save and Preview, then use the Download the Report button on the report webpage. The information below can be used to adjust the settings for text, images and visualizations as needed.

Some important notes for this section:

  • Images and visualizations are referred to collectively as “figures” in this section.

  • Section Content and Section Titles are referred to collectively as “text” in this section.

Text that comes after a figure in the website will be the text that wraps around the figure in the PDF. You will need to plan text and figure placement accordingly.

A single figure with text wrapped

Within the CMS, place items in the order below, and use the default settings:

  1. Figure

  2. A Section Title or Section Content block that includes the text that will wrap around the figure.

Two figures stacked vertically with a large block of wrapped text

Within the CMS, place items in the order below, and use the default settings:

  1. Figure 1

  2. Figure 2

  3. A Section Title or Section Content block that includes the text that will wrap around the figures.

If the first figure fits on a page, but the second figure doesn’t, this may create a gap of white space.

If this happens, see the Common Issues and Solutions section below.

Two figures side by side

Place items in the order below, using the indicated settings:

  1. Figure 1: Float left

  2. Figure 2: Float right

If, as in the example here, your figures are not the same size and you want the text not to wrap, you will need to turn on the Show full width PDF toggle for the text block.


JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.