Skip to main content

Embed a contextual help Touchpoint

After creating your contextual help Touchpoint, follow the steps below to embed your Touchpoint into any web site or application for which you have rights of authorship.



Copy the embed code

Note to user   NOTE:  Skip this section if you already have copied the code after creating your Touchpoint.

  1. From the Site tools menu on the MindTouch toolbar, select Control panel.
  2. Navigate to System Settings > Integrations > Web Widgets.
  3. Scroll down the page to the Currently enabled web widgets section, find your Touchpoint and click Copy code to clipboard.

Screenshot of an enabled F1 contextual help widget in the control panel

Embed the Touchpoint

  1. Find the location in your site or application where you want to embed the Touchpoint and paste the embed code directly into the HTML.

Screenshot of embedded F1 contextual help code

  1. To trigger your contextual help dialog, you need to create a link in your HTML that contains the specified CSS selector you specified when creating your Touchpoint.

An F1 link in HTML

important note   For the Touchpoint to work, you must assign two attributes within your <a> tag when embedding your Touchpoint: (1) A class attribute to specify your custom CSS selector (Default: "F1"), and (2)  an href attribute to specify the page which your contextual help dialog is to open.

Note to user   NOTE:  The href URL may be different from the search location URL you specified when creating the Touchpoint. You can use a custom content ID if you wish to dynamically update your external links.

  1. Save your HTML changes.

View your Touchpoint

  1. View your site or web application in your browser of choice.
  2. The Touchpoint link appears like any other site link, unless you have a specific style for it.

An F1 help link

  1. When the link is clicked, a dialog with the appropriate help article loaded appears.

Screenshot of an F1 contextual help dialog

  • Was this article helpful?