G

Advanced Widget Customization

About This Course
Five advanced, optional things a TripWorks booking widget can do: custom CSS and JavaScript tracking hooks, selling in another language, deep-linking a widget's URL, and where booking attribution (UTMs, GA4) actually comes from.
Transcript

Custom CSS and JavaScript

If you want the widget to match your site pixel for pixel — exact fonts, colors, spacing, buttons — you can add your own CSS on the widget's Code tab, layered right on top of the widget's defaults.

The same tab supports custom JavaScript that hooks into four real moments in the booking journey: Widget Load, View Item, Add to Cart, and Conversion. Each hook hands your code a real data object — confirmation code, totals, currency, the widget's name and ID, even the UTM values and referral URL — enough to fire your own analytics or ad-pixel events at exactly the right step.

Both are account-manager features, since they run your own code inside the widget — reach out to your account manager to get them enabled and add your code.

Most teams don't actually need the JavaScript side. TripWorks already pushes those same four events to your page's dataLayer automatically, so if you're using Google Tag Manager, you likely have what you need without writing a line of code.

Selling in another language

If you sell to international guests, set the widget's default language right in the builder's Advanced settings — English, Spanish, French, German, Italian, or Portuguese.

To open one specific link in a different language without changing the widget's saved default, add a language parameter to that link:

…/widget/<widget-id>?language=es

One campaign link can open in Spanish while everything else stays in the widget's regular default — same widget, same catalog, just presented differently.

The widget does not automatically detect a guest's browser language or location — language is always an explicit setting, either the builder's default or a link override.

Deep-linking a widget's URL

A widget's URL accepts parameters that preselect what a guest sees before they even land:

  • defaultView — open straight onto calendar, agenda, catalog, categories, or giftCards.
  • category — preselect a category.
  • date — open on a specific date.
  • hideNav — hide the widget's top navigation for a cleaner embed.

Add them to any widget link the same way you'd add a language parameter, and that link does the picking for you — no separate widget to build per campaign.

Where your bookings actually come from

TripWorks automatically captures the landing URL, referrer, UTM parameters, and ad click IDs on every booking that comes through your widget — there's nothing to turn on.

Connect Google Analytics from Setup → Integrations, drop in your GA4 Measurement ID, and every booking reports as a real purchase event — with revenue and the exact activities booked — broken down per widget, so you can see which page or campaign actually converts.

Next steps

None of this is required to launch a widget. Come back to whichever piece you need, when you need it — or book a demo if you want a walkthrough on your own account.