FAQ Schema Generator

JSON-LD for any website

Add this to the page that shows these questions and answers, word for word. Use it on one page only, not on every page of your site.

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "How long does a 30 ml bottle last?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "About two months if you use three or four drops a day."
      }
    },
    {
      "@type": "Question",
      "name": "Is it fragrance-free?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Yes. It's made with jojoba and argan oil and has no added fragrance."
      }
    },
    {
      "@type": "Question",
      "name": "Do you ship outside the US?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Yes, we ship to most countries. You'll see the delivery time and cost at checkout."
      }
    }
  ]
}
</script>

Shopify section (shows the FAQ and adds the markup)

In Shopify admin, go to Online Store, then Themes. Next to your live theme, click the three dots and choose Edit code. In the Sections folder, add a new section called geo-faq and replace its contents with this code. Save. Then click Customize, open the page or product template you want, choose Add section, and pick FAQ.

{%- comment -%}
  FAQ section made with FirstPicked's free FAQ Schema Generator: https://firstpicked.com.au/tools/faq-schema-generator
  Shows your questions and answers on the page and adds FAQPage structured data (JSON-LD) built from
  the same text, so the two always match. Change the questions in the theme editor (Customize).
{%- endcomment -%}
{%- assign geo_qa_count = 0 -%}
{%- for block in section.blocks -%}
  {%- if block.settings.question != blank and block.settings.answer != blank -%}
    {%- assign geo_qa_count = geo_qa_count | plus: 1 -%}
  {%- endif -%}
{%- endfor -%}

{%- if geo_qa_count > 0 -%}
  <div class="geo-qa">
    {%- if section.settings.heading != blank -%}
      <h2 class="geo-qa__heading">{{ section.settings.heading | escape }}</h2>
    {%- endif -%}
    {%- for block in section.blocks -%}
      {%- if block.settings.question != blank and block.settings.answer != blank -%}
        <div class="geo-qa__item" {{ block.shopify_attributes }}>
          <h3 class="geo-qa__question">{{ block.settings.question | escape }}</h3>
          <p class="geo-qa__answer">{{ block.settings.answer | escape | newline_to_br }}</p>
        </div>
      {%- endif -%}
    {%- endfor -%}
  </div>

  <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "FAQPage",
      "mainEntity": [
        {%- assign geo_qa_comma = '' -%}
        {%- for block in section.blocks -%}
          {%- if block.settings.question != blank and block.settings.answer != blank -%}
            {{ geo_qa_comma }}
            {
              "@type": "Question",
              "name": {{ block.settings.question | json }},
              "acceptedAnswer": {
                "@type": "Answer",
                "text": {{ block.settings.answer | json }}
              }
            }
            {%- assign geo_qa_comma = ',' -%}
          {%- endif -%}
        {%- endfor %}
      ]
    }
  </script>
{%- endif -%}

{% stylesheet %}
  .geo-qa { max-width: 72rem; margin: 0 auto; padding: 2rem 1.5rem; }
  .geo-qa__item { padding: 1rem 0; border-top: 1px solid rgba(0, 0, 0, 0.1); }
  .geo-qa__question { margin: 0 0 0.5rem; }
  .geo-qa__answer { margin: 0; }
{% endstylesheet %}

{% schema %}
{
  "name": "FAQ",
  "tag": "section",
  "class": "geo-qa-section",
  "max_blocks": 20,
  "disabled_on": {
    "groups": [
      "header",
      "footer"
    ]
  },
  "settings": [
    {
      "type": "text",
      "id": "heading",
      "label": "Heading",
      "default": "Questions and answers"
    }
  ],
  "blocks": [
    {
      "type": "question",
      "name": "Question",
      "settings": [
        {
          "type": "text",
          "id": "question",
          "label": "Question"
        },
        {
          "type": "textarea",
          "id": "answer",
          "label": "Answer"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "FAQ",
      "blocks": [
        {
          "type": "question",
          "settings": {
            "question": "How long does a 30 ml bottle last?",
            "answer": "About two months if you use three or four drops a day."
          }
        },
        {
          "type": "question",
          "settings": {
            "question": "Is it fragrance-free?",
            "answer": "Yes. It's made with jojoba and argan oil and has no added fragrance."
          }
        },
        {
          "type": "question",
          "settings": {
            "question": "Do you ship outside the US?",
            "answer": "Yes, we ship to most countries. You'll see the delivery time and cost at checkout."
          }
        }
      ]
    }
  ]
}
{% endschema %}

Your questions are already filled in. Change them later in Customize: the FAQ on the page and the markup change together.

Questions for the whole store, like shipping and returns, belong on one page, like your FAQ or shipping page. A product template shows the same section on every product. So for questions about one product, use the product metafield version.

A different FAQ on each product (product metafield)

Each product keeps its own questions in a product field, and one section shows them with the markup.

1. Create the field once. In Shopify admin, open any product. In the Metafields section, click Add definition. Name it FAQ, check that Namespace and key says custom.faq, click Select type and choose JSON (under Advanced), then save.

2. Fill it in for each product. Open the product and click its FAQ field. Paste that product's questions and answers in the format below, then save.

   Value for this product's FAQ field (JSON)

   [
     {
       "q": "How long does a 30 ml bottle last?",
       "a": "About two months if you use three or four drops a day."
     },
     {
       "q": "Is it fragrance-free?",
       "a": "Yes. It's made with jojoba and argan oil and has no added fragrance."
     },
     {
       "q": "Do you ship outside the US?",
       "a": "Yes, we ship to most countries. You'll see the delivery time and cost at checkout."
     }
   ]

3. Add the section once. In Edit code, add a new section called geo-product-faq. Replace what's in it with the code below, then save. Then click Customize, open your product template, choose Add section, and pick Product FAQ. Products with an empty FAQ field show nothing.

   Section filesections/geo-product-faq.liquid

   {%- comment -%}
     Product FAQ section made with FirstPicked's free FAQ Schema Generator: https://firstpicked.com.au/tools/faq-schema-generator
     Reads each product's FAQ from the product metafield custom.faq (type JSON), written like this:
     [{"q": "Your question?", "a": "Your answer."}]
     Shows the questions and answers and adds FAQPage structured data from the same text.
     Products with an empty FAQ field show nothing.
   {%- endcomment -%}
   {%- assign geo_qa_items = product.metafields.custom.faq.value -%}
   {%- assign geo_qa_count = 0 -%}
   {%- for item in geo_qa_items -%}
     {%- if item.q != blank and item.a != blank -%}
       {%- assign geo_qa_count = geo_qa_count | plus: 1 -%}
     {%- endif -%}
   {%- endfor -%}
   
   {%- if geo_qa_count > 0 -%}
     <div class="geo-qa">
       {%- if section.settings.heading != blank -%}
         <h2 class="geo-qa__heading">{{ section.settings.heading | escape }}</h2>
       {%- endif -%}
       {%- for item in geo_qa_items -%}
         {%- if item.q != blank and item.a != blank -%}
           <div class="geo-qa__item">
             <h3 class="geo-qa__question">{{ item.q | escape }}</h3>
             <p class="geo-qa__answer">{{ item.a | escape | newline_to_br }}</p>
           </div>
         {%- endif -%}
       {%- endfor -%}
     </div>
   
     <script type="application/ld+json">
       {
         "@context": "https://schema.org",
         "@type": "FAQPage",
         "mainEntity": [
           {%- assign geo_qa_comma = '' -%}
           {%- for item in geo_qa_items -%}
             {%- if item.q != blank and item.a != blank -%}
               {{ geo_qa_comma }}
               {
                 "@type": "Question",
                 "name": {{ item.q | json }},
                 "acceptedAnswer": {
                   "@type": "Answer",
                   "text": {{ item.a | json }}
                 }
               }
               {%- assign geo_qa_comma = ',' -%}
             {%- endif -%}
           {%- endfor %}
         ]
       }
     </script>
   {%- endif -%}
   
   {% stylesheet %}
     .geo-qa { max-width: 72rem; margin: 0 auto; padding: 2rem 1.5rem; }
     .geo-qa__item { padding: 1rem 0; border-top: 1px solid rgba(0, 0, 0, 0.1); }
     .geo-qa__question { margin: 0 0 0.5rem; }
     .geo-qa__answer { margin: 0; }
   {% endstylesheet %}
   
   {% schema %}
   {
     "name": "Product FAQ",
     "tag": "section",
     "class": "geo-qa-section",
     "enabled_on": {
       "templates": [
         "product"
       ]
     },
     "settings": [
       {
         "type": "text",
         "id": "heading",
         "label": "Heading",
         "default": "Questions and answers"
       }
     ],
     "presets": [
       {
         "name": "Product FAQ"
       }
     ]
   }
   {% endschema %}
   

Source: Shopify Help Center