Skip to main content
Tangiblee
 > 
Help Center
 > 
 > 

Managed Integration (Recommended)

Tangiblee recommends this integration as it is utilized by 95% of our retail clients. With this option, the Tangiblee team does 99% of the integration. Just add our script to your website and you're done. Tangiblee will provide the client with one line of code that tailors Tangiblee to the current PDP layout and ensures Tangiblee's CTA is shown on relevant PDPs.

Tailoring Tangiblee to the PDP of the client is done via a mapping code script (aka tangiblee-mapper.js). The Tangiblee team will create the tangiblee-mapper.js and maintain it for the client in the case of Managed Integration. The script created for the client is a wrapper to the tangiblee-mapper.js that loads from Tangiblee CDN the tangiblee-mapper.js bundled with the Tangiblee API script (tangiblee.js) into a tangiblee-bundle.min.js.

Tangiblee recommends directly installing the script to relevant product SKU pages usually in the body before the closing tag. Tangiblee does not recommend publishing our script via Google Tag Manager (GTM) installation given the latest updates in IOS 17. Direct install will also result in a faster Call-To-Action (CTA) loading time.

The Tangiblee script should be directly installed:

  • in the <body> in most cases usually before the closing tag of <body> and we recommend using attribute Async!
  • Or in the <head> tag however Async! attribute is required
  • may be added to ALL product detail pages as CTA will only show on approved products

The Tangiblee script has been:

  • Optimized for performance and is tested with PageSpeed periodically
  • built with Lazy loading capability, to load minimal resources before the user clicks on Tangiblee CTA, and load all the rest after the user opens Tangiblee.

In some cases, clients need more than one Tangiblee Script, for example, one script for the production website (PRD) and one script for the staging website (STG) each needing to show a different configuration of Tangiblee. To support multiple environments for one client, each with a different configuration, each script is set with its own revision. The client version is the last folder on the path of the script script, as you can see in the example below, the revision is revision_1 which is the default revision.

<script async src="https://cdn.tangiblee.com/integration/3.1/managed/www.tangiblee-integration.com/revision_1/variation_original/tangiblee-bundle.min.js"></script>

Below are a few examples demonstrating how Managed integration works on different use cases using Tags each with its own revision.

Typical Use-Case Managed Integration

This example and explanation covers the typical use-case of using Tangiblee Managed Integration.  It is usually done when integrating a single script onto the Client’s website (PRD).

This demo link of Tangiblee Managed Integration has the default revision set to the script: revision_1

As seen in the example link, revision_1 is part of the path to tangiblee-bundle.min.js. It is a default version that the Tangiblee team will provide when using Managed Integration on a given type of PDP.

When a client plans to roll out an update to the PDP code, it is important to notify the Tangiblee team & provide Tangiblee with a link to the STG or DEV environment prior to deploying the update. In notifying Tangiblee ahead of time, the team can update the tangiblee-mapper.js, if needed, and test it on the new PDP to ensure continuous service on PRD after rollout.

If a change is detected by the Tangiblee team, we will work as quickly as possible given our team workload.  However, this is not a 100% fail-proof process and the updates made by Tangiblee may not reflect 100% of the changes made by the client.

Therefore, we strongly recommend that you update the Tangiblee team every time you make changes to your PDP code, structure, or layout.

Below are the highlights of the configuration example above, and the Tag:

  1. One SKU on a PDP
  2. One active locale,
  3. No Price/Currency/ATC in-widget
  4. No Order Tracking
<script async src="https://cdn.tangiblee.com/integration/3.1/clients/www.tangiblee-integration.com/revision_1/variation_original/tangiblee-bundle.min.js"></script>

[.bad]Please note: this is not your Integration Snippet, but an example for the sake of this guide. Your Tangiblee point of contact will share an Integration Snippet specifically for your website during the Onboarding Process.[.bad]

Advanced Use-Case Managed Integration

The classic use case for using another Tag with a different revision is for a new website or a new PDP design, typically on the staging environment (STG). In that case, Tangiblee can provide a Tag with a new revision for the STG to ensure each environment has its own configuration.

This new version will have a newer revision_X param in a path to the tangiblee-bundle.min.js file.

Below are the highlights of the configuration, and the Tag:

  1. One SKU on a PDP
  2. One active locale
  3. No Price/Currency/ATC in-widget
  4. No Order Tracking
<script async src="https://cdn.tangiblee.com/integration/3.1/managed/www.tangiblee-integration.com/revision_2/variation_original/tangiblee-bundle.min.js"></script>