In This Article

How to Add a Site Tool to Your Website

After you've customized your PSAI site conversion tool, it's time to actually put your app to use and start generating leads for your business. In most cases (but not all), this means putting your app onto your website where visitors can see it and interact with it. 

Follow the instructions below to add your new site tool to your website. For more specific instructions for Wix, WordPress, or Squarespace, check out this article instead.

1. Go to Site Tools

Navigate to Site Tools.

Click_site_tools_.jpg

2. Find the Tool to Add

Scroll through the tools on your Site Conversion Tools page to find the one you're looking for. If you have many tools to sort through, then use the filters or the search bar to make it easier!

Site_tools_filter_and_search.jpg

3. Copy the Site Tool Code

Once you've located the tool in question, you can copy the necessary code directly from this page by clicking the "Copy" button.

Click_copy_for_site_tool.jpg

Alternatively, you can share the code with a developer or other team member by clicking Share.

4. Paste the Code into Your Website

Now that your marketing source code is copied from PSAI, you'll need to insert it onto your website.

The exact instructions for where and how to paste your code will vary depending on the Display Type of your app—whether it's floating or embedded. Follow the general guidelines below for each Display Type.

Need a refresher on Display Types? Check out some Display Type examples here.

Where to Paste Code for Floating Apps

Floating elements refer to the first two Display Types: Button Opens Popup and Auto Popup. (As an easy reminder, both say "Floating" underneath.)

Floating_elements.png

Because floating elements "float" over your website (and do not affect anything underneath), they do not need to be placed in a very specific or precise place on the web page. The code simply has to be pasted somewhere within your website files, preferably as close to the end as possible.

We recommend pasting the code immediately before the closing body tag of your website, which looks like this:

 </body>

The closing body tag is most often found in your website's footer files, although the exact means of locating and editing the footer file will vary depending on which website platform you use (such as WordPress, Squarespace, GoDaddy, etc.). Some platforms may also require you to place the code elsewhere than your footer file.

Find more specific instructions in our overview on adding floating elements to your website.

Where to Paste Code for Embedded Elements

The third possible Display Type is Embed on Page, as shown below. In PSAI, embedded elements are most commonly used for Quote Forms or Weather Widgets.

Embedded_elements.png

Unlike floating apps, embedded elements actually sit within a web page itself. Embedded elements do affect what's on the page around them, so where you paste an embedded form's code is more important than it is with a floating element.

As a general rule of thumb, you should paste the code on the correct web page(s) and in the correct spot where you'd like the form to appear. For example, maybe you want your form to be in the middle of your home page or at the bottom of your Contact Us page.

Depending on your website platform, you might paste the PSAI code directly into that spot, or you might paste the PSAI code itself elsewhere and instead place some kind of "shortcode" or placeholder into that spot. The exact method will vary depending on your specific website set-up and platform.

For detailed instructions on WordPress, Wix, and other common platforms, please see our overview on how to add an embedded form to your site.




Having trouble adding a PSAI app to your website?

The quickest way to get help is to submit a support ticket. Be sure to mention the type of app you're trying to add as well as your website platform (Wix, WordPress, etc.). Use this link or open the Help widget in the bottom right corner of your screen.