{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-docs/themes/sidebars.yaml"},"props":{"codeGuideFiles":[],"dynamicMarkdocComponents":[],"metadata":{"type":"markdown"},"seo":{"title":"Affiliate Hydration Cheatsheet","description":"Fluid is the open e-commerce platform built for direct-sales."},"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"affiliate-hydration-cheatsheet"},"children":["Affiliate Hydration Cheatsheet"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["A single storefront page is cached once and served to every visitor — attributed or anonymous. Affiliate-specific values (name, avatar, link URLs) are filled in on the client by the FairShare SDK. This page tells theme authors which variable to use in which context and how to avoid the traps."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"the-mental-model"},"children":["The mental model"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Under hydration:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["rendered HTML is affiliate-independent"]},". It contains placeholders (sentinels, custom elements, or data attributes) where affiliate values would go."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["FairShare SDK runs on every page"]}," and swaps those placeholders with the resolved affiliate's values."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Anonymous visitors"]}," (URL has no rep prefix) get the same HTML with fallback values (",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["\"home\""]}," for URL segments, empty for text)."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["If you author a theme assuming affiliate values are baked into the HTML at render time, your theme will break under hydration. This page explains what changes."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"the-three-mechanisms"},"children":["The three mechanisms"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"#"},"children":["#"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Mechanism"},"children":["Mechanism"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Use for"},"children":["Use for"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Example"},"children":["Example"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["1"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Custom element"]}," — ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<fluid-affiliate-*>"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Text content that displays an affiliate field"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<span>Hi, <fluid-affiliate-name>friend</fluid-affiliate-name></span>"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["2"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Data attribute"]}," — ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data-fluid-affiliate-*"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["An HTML attribute value (",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["src"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["href"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["alt"]},") that should hold an affiliate field"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<img data-fluid-affiliate-src=\"avatar\">"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["3"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Inline sentinel"]}," — ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ username }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["A rep username embedded ",{"$$mdtype":"Tag","name":"em","attributes":{},"children":["inside"]}," a string (URL path segment, JSON attribute)"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<a href=\"/{{ username }}/shop\">"]}]}]}]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Each mechanism solves a case the others can't:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["A custom element can't live inside an attribute."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["A whole-attribute data marker would replace the entire value."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The inline sentinel is safe only in attributes dereferenced on user interaction (",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["href"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["action"]},"), not eagerly-fetched ones (",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["src"]},")."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"variable-reference"},"children":["Variable reference"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"text-fields--affiliate-name-email-initials-avatar-url-my_site_url"},"children":["Text fields — affiliate name, email, initials, avatar URL, my_site_url"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Do not"]}," use these in template text or attributes; the raw value only exists on mysite renders."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Use"]}," the corresponding custom element:"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Field"},"children":["Field"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Custom element"},"children":["Custom element"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Fallback text"},"children":["Fallback text"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Name"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<fluid-affiliate-name>"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["put default inside the tag"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Email"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<fluid-affiliate-email>"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["put default inside the tag"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Initials"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<fluid-affiliate-initials>"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["put default inside the tag"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Avatar URL"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<fluid-affiliate-avatar>"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["put default inside the tag"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["MyHub URL"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<fluid-affiliate-my-site-url>"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["put default inside the tag"]}]}]}]}]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<p>Shop with <fluid-affiliate-name>our team</fluid-affiliate-name></p>\n<span class=\"badge\"><fluid-affiliate-initials>FA</fluid-affiliate-initials></span>\n","lang":"html"},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The element lives in the light DOM (no Shadow DOM) so surrounding theme styles apply normally."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"attribute-values--same-fields-when-used-inside-src--href--alt"},"children":["Attribute values — same fields, when used inside ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["src"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["href"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["alt"]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Use a data marker on the host element:"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Attribute"},"children":["Attribute"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Marker"},"children":["Marker"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Fills"},"children":["Fills"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Image source"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data-fluid-affiliate-src=\"<field>\""]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["src"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Link href"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data-fluid-affiliate-href=\"<field>\""]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["href"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Alt text"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data-fluid-affiliate-alt=\"<field>\""]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["alt"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Any text"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data-fluid-affiliate=\"<field>\""]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["textContent"]}," (when a custom tag isn't usable)"]}]}]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<field>"]}," is one of ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["name"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["email"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["avatar"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["initials"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["my_site_url"]},"."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<img data-fluid-affiliate-src=\"avatar\" data-fluid-affiliate-alt=\"name\" />\n<a data-fluid-affiliate-href=\"my_site_url\">View store</a>\n","lang":"html"},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["my_site_url"]}," normally resolves to ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<page-origin>/my/<username>"]},". To point at a different origin (e.g. a preview environment or a whitelabelled domain), add ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data-fluid-affiliate-base-url"]}," on the same element:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<!-- Default: uses the current page's origin -->\n<a data-fluid-affiliate-href=\"my_site_url\">View store</a>\n\n<!-- Explicit origin override -->\n<a\n  data-fluid-affiliate-href=\"my_site_url\"\n  data-fluid-affiliate-base-url=\"https://staging.example.com\"\n>View store</a>\n","lang":"html"},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The SDK resolves the affiliate's ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["my_site_url"]}," against the supplied base URL instead of ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["window.location.origin"]},". Only affects ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["my_site_url"]},"; other fields ignore this attribute."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"url-path-segments---username--and-its-siblings"},"children":["URL path segments — ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ username }}"]}," and its siblings"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["For a rep username embedded inside a URL string, use the inline sentinel:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"liquid","header":{"controls":{"copy":{}}},"source":"<a href=\"/{{ username }}/shop\">Shop</a>\n<form action=\"/{{ username }}/join\">...</form>\n","lang":"liquid"},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ username }}"]}," compiles to ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["__fluid_affiliate_username__"]}," under hydration. The SDK swaps every occurrence with the resolved rep username, falling back to ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["\"home\""]}," for anonymous visitors."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Other identifiers:"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Variable"},"children":["Variable"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Emits under hydration"},"children":["Emits under hydration"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Use for"},"children":["Use for"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ username }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Sentinel"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Path segments in link/form URLs (e.g., ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["/<username>/shop"]},")"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ share_guid }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Sentinel"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Sharing-link surfaces where a stable identifier is needed"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ affiliate_guid }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Sentinel"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Legacy alias for ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["share_guid"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ sharing_id }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Sentinel"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Sharing link variants where external IDs override the username"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ external_id }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Real value"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Backend-only surfaces (webhooks, non-cached contexts)"]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"company-url-helpers--company.shop_page_url--company.join_page_url"},"children":["Company URL helpers — ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["company.shop_page_url"]},", ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["company.join_page_url"]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["These already emit URLs with the sentinel baked in when hydration is on:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"liquid","header":{"controls":{"copy":{}}},"source":"<a href=\"{{ company.shop_page_url }}\">Shop</a>\n<!-- Renders to: <a href=\"/__fluid_affiliate_username__/shop\">Shop</a> under hydration -->\n","lang":"liquid"},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["No theme edit is needed. The SDK swaps the sentinel client-side."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"fields-that-stay-real-no-hydration"},"children":["Fields that stay real (no hydration)"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Variable"},"children":["Variable"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Value under hydration"},"children":["Value under hydration"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ affiliate.web_rep_store_enabled }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Real (company-level setting, not per-rep)"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ affiliate.logged_in_rep_for_store }}"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Real"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ affiliate.sign_in_url }}"]}," / ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["sign_out_url"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Real placeholders (",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["\"#\""]},") — use client-side JS to populate"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ company.* }}"]}," (except URL helpers above)"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Real (not affiliate-dependent)"]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"conditional-visibility--the-pattern-that-replaces--if-affiliate.x-"},"children":["Conditional visibility — the pattern that replaces ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{% if affiliate.X %}"]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Under hydration, ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["{{ affiliate.name }}"]}," at render time is the placeholder — never ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["blank"]},". So:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"liquid","header":{"controls":{"copy":{}}},"source":"          <!-- ALWAYS true under hydration - broken -->\n  <span>Hi, {{ affiliate.name }}</span>\n","lang":"liquid"},"children":[]}]},"headings":[{"value":"Affiliate Hydration Cheatsheet","id":"affiliate-hydration-cheatsheet","depth":1},{"value":"The mental model","id":"the-mental-model","depth":2},{"value":"The three mechanisms","id":"the-three-mechanisms","depth":2},{"value":"Variable reference","id":"variable-reference","depth":2},{"value":"Text fields — affiliate name, email, initials, avatar URL, my_site_url","id":"text-fields--affiliate-name-email-initials-avatar-url-my_site_url","depth":3},{"value":"Attribute values — same fields, when used inside src , href , alt","id":"attribute-values--same-fields-when-used-inside-src--href--alt","depth":3},{"value":"URL path segments — {{ username }} and its siblings","id":"url-path-segments---username--and-its-siblings","depth":3},{"value":"Company URL helpers — company.shop_page_url , company.join_page_url","id":"company-url-helpers--company.shop_page_url--company.join_page_url","depth":3},{"value":"Fields that stay real (no hydration)","id":"fields-that-stay-real-no-hydration","depth":3},{"value":"Conditional visibility — the pattern that replaces {% if affiliate.X %}","id":"conditional-visibility--the-pattern-that-replaces--if-affiliate.x-","depth":2}],"frontmatter":{"seo":{"title":"Affiliate Hydration Cheatsheet"}},"lastModified":"2026-07-02T20:56:17.000Z"},"slug":"/docs/themes/affiliate-hydration","userData":{"isAuthenticated":false,"teams":["anonymous"]}}