Service Titan Knowledge Base

Install onclick attribute and button element for ServiceTitan Web Scheduler 2.0 into WordPress: recommended workflowLast updated on 05/12/2023

The Web Scheduler 2.0’s onclick attribute code may not work with preset button elements in website editors such as WordPress. This article provides the recommended steps to install the onclick attribute code and button element for Web Scheduler 2.0 into the WordPress website editor.

Things to know

  • The main scheduler script should be installed at the end of the website <body> first prior to installing the button code.

  • For more information on installing ServiceTitan’s Web Scheduler 2.0, see Set Web Scheduler for Office Employees

  • The ServiceTitan Web Scheduler 2.0 requires a button element and an onclick attribute installed in the website code in order to trigger the scheduler widget popup. However, the onclick attribute code may not work with the preset button elements in certain website editors (such as WordPress). Instead of a preset button element, use a custom HTML code block to install the button and attribute code. 

  • Follow the Retrieve button HTML code workflow first to create the button HTML (you can skip this section if you already have a button HTML code). Then follow the Use a custom HTML code block to install the button code section to install the button code into WordPress.

Workflows

Retrieve button HTML code

Add a preset button element to your site and then copy that button’s source HTML code to use in a custom HTML code block. If you already have the button HTML code on hand, you can skip this section and go straight to the Use custom HTML code block to install button code section.

  1. In your company’s WordPress website editor, click on the home icon in the upper left corner and then click Visit Site.

  2. Then click Edit Page from the top navigation bar.

  3. In the site editor, click on the + icon at the top.

  4. Search for and click the Button option to add a button element to your site.

  5. Enter the desired customer-facing text (for example, Schedule Now!) into the new button.

  6. Click the 3 dots on the right in the new button menu, and select Edit as HTML.

  7. Highlight and then copy the HTML code that appears in the box.

  8. Delete the button element that was just added.

  9. Move on to the next Use a custom HTML code block to install the button code section.

Use a custom HTML code block to install the button code

  1. In the WordPress site editor, click on the + icon at the top.

  2. Search for and click the Custom HTML option to add a custom HTML code block to your site.

  3. Paste your button HTML code into the custom HTML box.

  4. Copy the following onclick attribute code:

    1. onclick=STWidgetManager(“ws-open”)

  5. Paste the attribute code from step 12 into the custom HTML code block - it can be inserted into the opening tag (for example, <button onclick=STWidgetManager(“ws-open”)>Button Text</button>).

  6. Edit the button’s design as needed.

  7. Click Preview from the upper right corner of the website editor to preview the button and scheduler widget.

  8. Once the scheduler button is satisfactory, click on Update from the upper right corner to save changes.

Related Content

Important note: Some features may not be currently included in your account and additional configuration may be required. Please contact technical support for details.

Disclaimer: Information provided in this article is for informational purposes only and it should not be construed to be legal advice. Information provided in this article may also not constitute the most up-to-date legal or other information. You should not act or refrain from acting on the basis of any information in this article to meet any compliance requirements without seeking independent legal or other professional advice.