JavaScript (and Google Tag Manager) Integration

Besides our server-side integration, the InternalLinking.io API also works with a client-side integration. You can simply put a script block in manually or add it via Google Tag Manager (GTM) and add an empty HTML element in your HTML template, e.g. in the footer. The script will pull the links with the API key we provide and update the HTML page automatically.

1. The JavaScript block

  • NOTE - you can create your API key in the Integration view of your workspace.
  • NOTE - we are about to migrate the endpoint, contact us for the new URL before working on the integration.
<script src="https://isentropic-snow-282609.ew.r.appspot.com/api/js-internal-linking/?apikey=XXX" defer></script>

2. Empty HTML element

<div id="similarai-relatedSearches" class="nav"></div>

For an example of one of our clients using this client side integration, look at Utility Bidder. You can find their internal links get pulled in and rendered, when you open a page such as https://www.utilitybidder.co.uk/business-electricity/

image

Add script block with Google Tag Manager

  1. Go to the GTM tags and add a new tag:
<script>
  var script = document.createElement('script');
  script.defer = true;
  script.src = "https://isentropic-snow-282609.ew.r.appspot.com/api/js-internal-linking/?apikey=XXX";
  document.getElementsByTagName('head')[0].appendChild(script);
</script>

  1. Add a new trigger. For instance, this could be the page view event for pages that are supposed to pull the internal links from Similar.ai.

  2. Preview and Publish.

JavaScript with WPCode Plugin

1. Import JavaScript into the WordPress Footer - Make sure the WPCode plugin is installed prior to proceeding. - Navigate to https://wordpress.dev.similar.ai/wp-admin/admin.php?page=wpcode-headers-footers on your WordPress admin dashboard.

image

2. Embed HTML Code within Post Editor - Create a Code Block: Initiate a new code block within the post editor.

image

  • Paste HTML code: Copy <div id="similarai-relatedSearches"></div> and paste it into the code block and switch to Edit as HTML mode.

image

3. Re-paste the HTML code

image

image

Questions, features or bugs?

For any questions or support, please feel free to contact us at hello@similar.ai. Alternatively, suggest improvements or new features for our internal linking tool.