Installing the Uptick Digital Advertising Widget

Enhance your site by seamlessly integrating our advertising widget. The setup is quick and consists of two core steps. By following these guidelines, you can embed our widget and showcase targeted advertising to your audience.

Inserting the HTML Placeholder

The initial step involves setting a placeholder where the advertising widget will appear. Utilize the following HTML snippet to designate the widget’s position on your page:

<div data-uptick-target="content" class="uptick-target section"></div>

For Styling: To ensure a seamless appearance that complements your site’s design, we advise enhancing the HTML snippet with any additional classes that might help. The offer HTML will render inside this div.

Configuring the Checkout

In order for us to customize and track the offers sent over there are some variables to configure before activating the script. Replace these values with the information from the order.

<script>
  window.uptick = {
    page: "thank_you", // Can also be "status" for the Order Status page
  }
</script>

Optional Parameters

The only required parameter is page. However you may also specify some optional parameters as well. One that may be of interest would be first_name which helps with personalization.

<script>
  window.uptick = {
    page: "thank_you", // Can also be "status" for the Order Status page
    first_name: "Reggie"
  }
</script>

The next would be country for any specific targeting or exclusions we might want to implement.

<script>
  window.uptick = {
    page: "thank_you", // Can also be "status" for the Order Status page
    first_name: "Reggie",
    country_code: "US"
  }
</script>

You can also include order amount information, which can be useful for certain types of offers.

<script>
  window.uptick = {
    page: "thank_you", // Can also be "status" for the Order Status page
    total_price: "$49.99",
    shipping_price: "$9.99"
  }
</script>

Embedding the Activation Script

The activation script is crucial as it powers the widget and fetches the required content. After setting your placeholder from Step 1 and configuring in Step 2, proceed with embedding the below script:

<script src="https://app.uptick.com/i/places/AAAAAAAA-BBBB-CCCC-DDDD-EEEEEEEEEEEE/offers.js"></script>

Note:

  • Position the script tag after the DIV element. This sequencing ensures the widget locates the placeholder without any hiccups and populates it efficiently.

  • The script tag contains an ID (AAAAAAAA-BBBB-CCCC-DDDD-EEEEEEEEEEEE). Ensure that you replace this with the correct ID assigned to your integration. Using an incorrect or generic ID will lead to unsuccessful widget activation.

Troubleshooting Tips:

  • If you encounter any layout disruptions, confirm that you’ve placed the script tag in the right sequence and used the appropriate integration ID.
  • Ensure that no other scripts or styles on your page conflict with our widget’s functionality. If the issue persists, reach out to our technical support team for further assistance.