Skip to content
Integrations

Add the Website Grader widget to your website

Last updated: May 17, 2022

Applies to:

Partner Account

The Website Grader widget is an embeddable version of HubSpot’s Website Grader that HubSpot solutions partners and providers can add to your HubSpot-hosted or external websites. The widget consists of a form and a module that you can add to your webpage.

Integration requirements

You must have the following permissions in HubSpot:

Add the Website Grader widget to your account

  • Navigate to https://widget.grader.com/.
  • Click Add to portal
  • Select the account you want to add the widget to, then click Choose Account.
  • You'll be asked to grant permission for the Website Grader Widget to access your HubSpot account. Click Connect app.
  • You can add the Website Grader widget to a HubSpot hosted page or an external website. Select an option, then follow the instructions to complete the widget set up in your account.
wsg-hubspot-hosted

 

Embed the widget on a HubSpot hosted page

If embedding the widget on your HubSpot hosted website:

  • Select the A HubSpot hosted page checkbox.
  • Click Next. 
  • Add privacy disclaimer text to your form.
    • In the Company name field, enter your company's name.
    • In the Privacy policy URL field, enter a link to your company's privacy policy.
  • Click Next
  • To automatically add the Website Grader widget to your account, click Install module 
  • To view the module in your account, click Open portal. The module will be named “HubSpot Website Grader widget”.

After the module has been added to your account, you can edit the module’s fields and style the form fields, then add it to a page template, or add it to a page using the drag and drop page editor.

Embed the widget on an external page

If embedding the Website Grader widget on an external page:

  • Select the An external website checkbox.
  • Click Next
  • A form called “Website Grader Widget Form” will be created automatically in your account. To edit the form fields, click Edit this form. You can create a custom form as well.
  • Click Next
  • Add privacy disclaimer text to your form.
    • In the Company name field, enter your company's name.
    • In the Privacy policy URL field, enter a link to your company's privacy policy.
  • Click Next
  • In the Customize section, use the styling options to edit the logos and text that appear on the page. To review your changes, click Preview
  • Click Next
  • In the Add the widget to your website section, click Copy, then add the code to your website before the closing body tag.

After the widget has been added to your website page, visitors can scan a website URL after entering their email address and receive an overall grade for their website based on its performance. There will also be a marketing email titled Website Grader Result Email added to your portal. You can send this email to contacts who fill out the Website Grader on your website. 

Segment contacts based on their website score

After adding the Website Grader widget to your account, the following contact properties will be created:

  • Grader Result: Performance Score (out of 30)
  • Grader Result: Mobile Score (out of 30)
  • Grader Result: SEO Score (out of 30)
  • Grader Result: Security Score (out of 10)
  • Grader Result: Overall Score (out of 100)
  • Grader Website

This is how you can interpret the scores and what is being measured:

Score type

What's being measured

Performance

The size of the network payload.

The number of requests the page makes.

The amount of time it takes for the page to become fully interactive.

The percentage of bytes used for caching website assets.

The number of redirects on the page.

The size of all unminified CSS and Javascript files. 

The number of images that are appropriately sized.

Mobile

Whether the content is sized correctly for the viewport.

How mobile-friendly the font size is

How mobile-friendly the tap targets on the page are

SEO

Whether the page is blocked from indexing by search engine crawlers.

Whether the page has a meta description and descriptive text in the links. 

Whether the page has plugin-based content.

Security

Whether the page loads over HTTPS or HTTP.

If the page includes front-end Javascript with known security vulnerabilities

You can segment contacts into lists based on their scores in each category after they scan their website URL with the widget. 

  • In your HubSpot account, navigate to Contacts > Lists.
  • In the upper right, click Create list.
  • In the left panel, select Contact-based to create a list of contacts.
  • In the right panel, enter a name for your list, then select Active list or Static list.
  • In the upper right, click Next.
  • In the Filter type section, select Website Grader Widget: Ran Grader
  • Click the name of the Website Grader properties, then refine the filter accordingly.
Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.