See below for how to collect feedback directly from your HubSpot website using Marker.io!

Why HubSpot

Why Marker.io?

How to add marker.io to HubSpot

Widget not displaying on your HubSpot website?


Why HubSpot

HubSpot CMS combines website creation with the power of a CRM platform to customize the buying journey.


Why Marker.io?

With the power of Marker.io, collecting website feedback on HubSpot is a breeze, saving hours of developer time. Collect your Webflow feedback directly into your favorite PM tools and issue trackers.


How to add marker.io to HubSpot

We will follow the instructions from this link, but check back often as these are subject to change:

https://knowledge.hubspot.com/design-manager/add-a-javascript-file-to-hubspot

Create your javascript file

  • Within app.marker.io navigate to your project settings > widget > Installation > Add code manually and copy code.

  • In your HubSpot account, navigate to Marketing > Design Tools.

  • In the left sidebar menu, click File > New file. You may need to click the folder folder icon to expand the menu.

  • In the dialog box, click the What would you like to build today? dropdown menu and select JavaScript.

  • design-manager-new-file-javascript
  • Click Next.

  • In the File name field, enter the name marker for your JavaScript file.

  • To update the file's location, in the File location section, click Change and select the folder to add the file.

  • Click Create.

  • Type or paste your JavaScript code from app.marker.io into the code editor.

  • Remove the <script> and </script> tags from the code

  • You should now have a file that resembles:

  • In the upper right, click Publish changes to take your changes live.

Get the public URL of your JavaScript file.

The public URL of your JavaScript file will resemble: {{ get_asset_url('/marker.js') }}

To get your unique public URL, following on from the steps above:

  • In the left sidebar menu, select your JavaScript file.

  • Click Actions > Copy public URL.

Add the Marker.io widget to an individual page

  • In your HubSpot account, navigate to Marketing > Website > Website Pages or Landing Pages.

  • Hover over the page that you want to edit, then click Edit.

  • In the page editor, click the Settings tab.

  • Click Advanced options.

  • In the Footer HTML section, paste the public URL as the value for the script tag's source:

<!-- start Main.js Do Not Remove -->
<script src='insert your file's public URL here'></script>
<!---End Main.js-->

Sample

<!-- start Main.js Do Not Remove -->
<script src='{{ get_asset_url('/marker.js') }}'></script>
<!---End Main.js-->
  • To publish your changes to the live page, in the upper-right, click Update.

You should now see the widget on your page

Add the Marker.io widget to all pages

  • In your HubSpot account, click the settings icon in the main navigation bar.

  • In the left sidebar menu, navigate to Website > Pages.

  • Click the Choose a domain to edit its settings dropdown menu and select the domain to add the JavaScript file to.

  • In the Site footer HTML section, paste the public URL as the value for the script tag’s source:

<!-- start Main.js Do Not Remove -->
<script src='insert your file's public URL here'></script>
<!---End Main.js-->
  • Click Save.

You should now see the widget on all of your pages


Widget not displaying on your HubSpot website?

If your widget is not displaying, try the following:

  • Ensure your website[s] is listed under website domains. Navigate to your project settings > Settings > General > Website domains. Check that the correct website domain(s) is listed here.


Still having issues? Contact us anytime in the chat at the bottom right of our website.

Did this answer your question?