Skip to main content

​
The Challenge

You want section settings like headlines to support both:
  • Static copy: “Shop our best sellers”
  • Dynamic copy: “Shop [cc-creator-first-name]‘s picks”

​
The CC Dynamic Text Snippet

Create snippets/cc-dynamic-text.liquid: 
{% comment %}
  Usage: {% render 'cc-dynamic-text', text: section.settings.heading, cc_creator: cc_creator %}
{% endcomment %}

{% liquid
  assign output = text
  
  if cc_creator
    assign output = output | replace: '[cc-creator-first-name]', cc_creator.cc-creator-first-name
    assign output = output | replace: '[cc-creator-full-name]', cc_creator.cc-creator-first-name | append: ' ' | append: cc_creator.cc-creator-last-name
    assign output = output | replace: '[cc-creator-discount-code]', cc_creator.cc-collab-discount-code
    assign output = output | replace: '[cc-creator-discount-amount]', cc_creator.cc-collab-discount-amount
  else
    assign output = output | replace: '[cc-creator-first-name]', 'our expert'
    assign output = output | replace: '[cc-creator-full-name]', 'our team'
    assign output = output | replace: '[cc-creator-discount-code]', ''
    assign output = output | replace: '[cc-creator-discount-amount]', ''
  endif
%}

{{ output }}

​
Usage in Sections

<h1>
  {% render 'cc-dynamic-text', text: section.settings.heading, cc_creator: cc_creator %}
</h1>

​
Supported Tokens

TokenWith CreatorWithout CreatorNotes
[cc-creator-first-name]Sarahour expertMost commonly used
[cc-creator-full-name]Sarah Jonesour teamFor formal contexts
[cc-creator-discount-code]SARAH15(empty string)Pair with conditional rendering
[cc-creator-discount-amount]15(empty string)Numeric — add % or $ in your template

​
Extending with Custom Tokens

You can extend the snippet to support additional tokens. Common additions: 
{% liquid
  assign output = text
  
  if cc_creator
    assign output = output | replace: '[cc-creator-first-name]', cc_creator.cc-creator-first-name
    assign output = output | replace: '[cc-creator-full-name]', cc_creator.cc-creator-first-name | append: ' ' | append: cc_creator.cc-creator-last-name
    assign output = output | replace: '[cc-creator-discount-code]', cc_creator.cc-collab-discount-code
    assign output = output | replace: '[cc-creator-discount-amount]', cc_creator.cc-collab-discount-amount
    assign output = output | replace: '[SHOP_TITLE]', cc_creator.cc-creator-shop-title
    assign output = output | replace: '[BIO]', cc_creator.cc-creator-shop-description
  else
    assign output = output | replace: '[cc-creator-first-name]', 'our expert'
    assign output = output | replace: '[cc-creator-full-name]', 'our team'
    assign output = output | replace: '[cc-creator-discount-code]', ''
    assign output = output | replace: '[cc-creator-discount-amount]', ''
    assign output = output | replace: '[SHOP_TITLE]', 'Our Shop'
    assign output = output | replace: '[BIO]', ''
  endif
%}

{{ output }}

​
Supporting Custom Fields

For custom fields specific to your merchant program, add additional replace lines: 
{% comment %} Custom field tokens — add as needed {% endcomment %}
{% if cc_creator %}
  {% assign output = output | replace: '[SPECIALTY]', cc_creator.data.value['cc-specialty'] %}
  {% assign output = output | replace: '[LOCATION]', cc_creator.data.value['cc-location'] %}
{% else %}
  {% assign output = output | replace: '[SPECIALTY]', '' %}
  {% assign output = output | replace: '[LOCATION]', '' %}
{% endif %}

​
Handling Empty Tokens Gracefully

When a token resolves to empty (e.g., no discount code), the surrounding text might look awkward. Use conditional rendering around the entire element: 
{% comment %} ❌ Awkward: "Use code  for % off!" (when no discount) {% endcomment %}
<p>{% render 'cc-dynamic-text', text: 'Use code [cc-creator-discount-code] for [cc-creator-discount-amount]% off!', cc_creator: cc_creator %}</p>

{% comment %} ✅ Better: Only show the discount line when the code exists {% endcomment %}
{% if cc_creator and cc_creator.cc-collab-discount-code != blank %}
  <p>{% render 'cc-dynamic-text', text: section.settings.discount_text, cc_creator: cc_creator %}</p>
{% endif %}

​
Example Settings

In your section schema, include info text so merchants know which tokens are available: 
{
  "type": "text",
  "id": "heading",
  "label": "Heading",
  "default": "Shop [cc-creator-first-name]'s favorites",
  "info": "Tokens: [cc-creator-first-name], [cc-creator-full-name], [cc-creator-discount-code], [cc-creator-discount-amount]"
},
{
  "type": "textarea",
  "id": "subheading",
  "label": "Subheading",
  "default": "Hand-picked by [cc-creator-first-name] just for you",
  "info": "Tokens: [cc-creator-first-name], [cc-creator-full-name]"
}