Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Panel
panelIconIdatlassian-check_mark
panelIcon:check_mark:
panelIconText:check_mark:
bgColor#E3FCEF

Good News! You only need to make this change once. This change will propagate to every page on your site after you re-publish the pages.

...

It is recommended that you work with two browser windows open as you compelte this process.

1️⃣ Locate the code to fix

When viewing a page report in Siteimprove, the default view shows page content. When you click on the
Show HTML button, Siteimprove will highlight the issue location in the code.

...

Defining viewport parameters is set in the <meta> tags in the site template.

Instructions

  1. In Cascade CMS, go to the page identified in the page report. In the sample above, the “presentation template” page is selected.

  2. Click the …more drop down menu and select Show Regions. The Region Assignments sidebar appears.

  3. The Region Assignments provide a map of each region created in a template. We have already identified the page zoom issue in the head files. Click Head Files. The block “head-files” appears.

    Image Added
  4. Each mapped region is hyperlinked to the asset. Click the head-files block to go to the asset in your site.

    Image Added


    Note the breadcrumb trail for the head-files block. It is located inside the _cascade folder for your site. Files in the _cascade folder control a specific region on every page in your site. Making a change to this asset will require you to re-publish your pages in your site for the changes to take effect.

2️⃣ Update the Meta Tag

  1. On the XML Block: head-files page, click Edit. The advanced editor window opens.

...


  1. Image Added

  2. Click on the Toggle Fullscreen Mode icon to expand the code view.

    Image Added

  3. On or around line 3 of the code, locate the content meta tag highlighted in the Siteimprove page report and select in your Cascade CMS advanced editor.

  4. Copy the content meta tag code block below and replace the meta tag in Cascade CMS.

    Code Block
    <meta content="width=device-width, initial-scale=1, shrink-to-fit=yes, user-scalable=yes" name="viewport”/>
  5. Click Preview Draft and then Submit to save to Cascade CMS.

    updating-meta-tag.mov

  6. Verify that your XML block was saved. If your XML block includes the Draft button next to the title, this means you have an error in your code. Usually this means you have forgotten a closing quote or slash.

    Image Added

    1. If your XML was not saved correctly, you will see an error message that states “asset failed validation” when you click the Submit button.

      Image Added
    2. Click Edit.

    3. Correct your code and repeat step 5.

  7. After you have successfully saved the XML code block, go to the page in Cascade CMS that was identified in the Siteimprove page report and publish the page.

3️⃣ Verify successful remediation

  1. Return to the Siteimprove to recheck the page.

  2. You can recheck the page from the page report window or the list of pages in the issue overview page.

    Image Added

...

  1. When you return to the issues overview page in Siteimprove, the page you fixed will no longer be listed for this particular issue.

Info

On the page report window if you have successfully corrected all issues on that page you will see a “Great Job! All occurrences on this page have been fixed” badge.