Prefill Text Fields Using URL Parametes

Pre-fill text options using custom product URLs lets you automatically fill in single-line text fields on your storefront when customers visit a link. This is useful for personalized ad campaigns, promotional links, or pre-configured products where you already want a specific name or text filled in.

Use Cases

Pre-filled URLs are ideal when you want to create personalized shopping experiences for your customers:

• Personalized Ads: Run targeted ads for specific customer segments (e.g., targeting audiences named "Jason" with an ad link that opens a t-shirt with "Jason" already typed and rendered on the live mockups).
• Pre-configured Product Links: Share direct links via customer support or social channels showcasing sample names on your bestsellers without requiring buyers to type them.

How It Works

When a customer opens a product link containing query parameters, Teeinblue automatically detects them and applies the values to your personalization form:

• Option Title Matching: The URL parameter must match the exact Option Title you set in your Artwork editor in Teeinblue Portal.
• Case Sensitivity: Matching is strictly case-sensitive. For example, if your option title in the portal is Name, your URL parameter must be ?Name=Emily (a parameter like ?name=Emily will be ignored).
• Works Across All Storefront Languages: Matching is based on the original portal title, not on the translated titles displayed on your storefront. One single ad link will work for all customer languages.
• Instant Mockup Preview: As soon as the page loads, the text input fills in and the preview canvas re-renders with the text.
• Full Customer Freedom: Customers can still freely edit, replace, or clear the pre-filled text before adding the product to cart.

Step-by-Step Setup

Step 1. Find your Option Title in Teeinblue Portal

• In Teeinblue Portal, go to Campaigns (or Artworks).
• Open your Campaign and click Edit artwork on the printarea card.
• Select your text layer and open its Personalization Settings.
• Check the exact text inside the Option title field. Note the exact uppercase and lowercase letters.

Step 2. Add Parameters to Your Product Link

Take your standard product URL and append a question mark (?) followed by your Option Title=Value.

Example 1: Basic Single Field

If your option title is Name:

https://yourstore.com/products/personalized-t-shirt?Name=Emily

Storefront result:

• Name field → Emily
• Live mockup preview updates immediately with Emily.

Example 2: Combined with Shopify Variant

You can combine Teeinblue parameters with Shopify's default variant parameter using an ampersand (&):

https://yourstore.com/products/personalized-t-shirt?variant=67845120065749&Name=Emily

Storefront result:

• Variant 67845120065749 is automatically selected.
• Name field → Emily.

Example 3: Multiple Fields

You can pre-fill multiple text fields at the same time:

https://yourstore.com/products/personalized-mug?First Name=Emily&Last Name=Jones

Storefront result:

• First Name field → Emily
• Last Name field → Jones

How Values Are Formatted and Restricted

Pre-filled values from URLs undergo the same formatting and sanitization rules as if a customer typed them by hand:

• Text Case: If you set the option to UPPERCASE or lowercase, the URL value will automatically format accordingly (e.g., ?Name=jason becomes JASON).
• Max Length: If the text in the URL exceeds the maximum allowed characters, it is truncated to the limit (e.g., ?Name=Alexander becomes Alexa if the limit is 5).
• Font Character Restrictions: If your font restricts numbers or accented letters, unsupported characters are automatically stripped.
• Emojis & Invisible Characters: Emojis and hidden formatting symbols are always filtered out.
• Blacklisted Words: If the URL contains a prohibited word from your blacklist, the word will still appear in the input, but form validation will block the customer from adding to cart and show the error notice.

Important Notes & Limitations

• Hidden layers & conditional toggles:
• • Classic Artworks: If a text layer has its own show/hide toggle that is turned off by default, passing a URL value will automatically turn the toggle on and display the field.
  • Artwork v2: If a text layer is hidden behind a separate conditional toggle option (dependency), the parent toggle will not automatically switch on. However, once the customer turns on that toggle, the pre-filled text is already there waiting for them.
• Where pre-fill works:
• • Storefront product pages (both SDK v1 and v2).
  • Direct forms embedded on the product page and modal popup forms ("Personalize" button).
• Where pre-fill does NOT work:
• • Cross-sell and Add-on product popups.
  • The "Edit Customization" screen opened from the shopping cart.
  • Multi-line paragraph text, numbers, dates, dropdowns, and photo upload options.
  • Headless integrations, Make/Integromat, or Shopify Admin order previews.
• Tracking parameters:
• • Standard ad tracking parameters (such as utm_source, utm_campaign, fbclid) that do not match any option title are safely ignored and will not interfere with personalization.

Updated on: 26/10/2026