I'm getting the error local.ERROR: Cannot render an array variable as a string: {{ hero_small }} and I'm bangin' my head trying to figure out what's the source.

I've used this many times on other version 2 sites without any issues. I'm doing this on a site we upgraded from V1 to V2. There's a lot of content in there from pre-migration, but I'm not seeing anything that stands out as an issue.

Statamic Version: 2.9.2

Notes: I'm using various partials and section/yields because we're updating an existing project and trying to limit the amount of templates I've gotta completely rebuild. This is for a hero banner that's gotta load above navigation, etc. that's coded into the layout template; the hero's page specific though. I'm not getting any errors when I run it thru an online Yaml linter either.

Fieldset Code

homepage fieldset

title: "Homepage"
hide: true
fields:

  # META INFO
  meta_partial:
    type: partial
    fieldset: meta

# Fund Meter
#  fund_meter_partial:
#    type: partial
#    fieldset: fund_meter

  # Hero Banner
  hero_banner_partial:
    type: partial
    fieldset: _hero_banner_jumbo

  # HOMEPAGE SLIDER SECTION
  home_slider_section:
    type: section
    display: "Homepage Slider"

  home_slider:
    display: "Homepage Slider"
    instructions: "Minumum image size is 635w x 282h"
    type: grid
    starting_rows: 3
    max_rows: 6
    fields:
      slider_image:
        display: "Slider Image"
        instructions: "Size: 635px wide by 282px tall"
        type: assets
        container: main
        folder: homeslider
        restrict: true
        required: true
        allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]
        max_files: 1
        resize:
          width: 635
          height: 282
          quality: 100
          upsize: true
      image_title:
        display: "Image Title"
        instructions: "(For screen readers only, will not appear on the front page)"
        type: text
      link:
        type: text
        display: "Link"
      target:
        type: select
        display: "Target"
        options:
          _self: "Same Window"
          _blank: "New Window"

  intro_content:
    display: "Intro Content"
    type: redactor
    container: main
    allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]

  highlighted_callout:
    type: text
    display: "Highlighted callout"

  videos:
    type: grid
    display: "Video Embeds"
    min_rows: 0
    max_rows: 2
    fields:
      title:
        type: text
        display: "Video Title"
      still:
        display: "Video Still Image"
        instructions: "Size: 243px wide by 172px tall"
        type: assets
        container: main
        folder: video_stills
        restrict: true
        required: true
        allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]
        max_files: 1
        resize:
          width: 243
          height: 172
          quality: 100
          upsize: true
      link:
        type: text
        instructions: "Insert the video link code (example: T4sT4KyLEwI)"
        display: "Video Link"
      active:
        type: checkboxes
        display: "Active"
        instructions: "Only active videos will display"
        default: 1

  cta_buttons:
    type: grid
    display: "Call-to-Action Buttons"
    min_rows: 0
    max_rows: 2
    fields:
      title:
        type: text
        display: "Display Title"
      link:
        type: text
        display: "Link"
      target:
        type: select
        display: "Target"
        options:
          _self: "Same Window"
          _blank: "New Window"
      active:
        type: checkboxes
        display: "Active"
        instructions: "Only active videos will display"
        default: 1

  help:
    display: "Help Boxes"
    type: grid
    starting_rows: 5
    max_rows: 5
    fields:
      help_image:
        display: "Help Image"
        type: assets
        container: main
        required: true
        allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]
        max_files: 1
        width: 20%
      help_image_description:
        display: "Image Description"
        instructions: "(For screen readers only, will not appear on the front page)"
        type: text
        width: 20%
      help_section_title:
        display: "Section Title"
        instructions: "(Title that will appear on front page)"
        type: text
        width: 20%
      help_section_description:
        display: "Description of help"
        type: textarea
        width: 20%
      help_link:
        display: "Link to service"
        instructions: "(Include http://)"
        type: text
        width: 20%

  accreditation:
    display: "Accreditation"
    instructions: "This is for the light purple area, on the left side"
    type: grid
    starting_rows: 2
    max_rows: 4
    fields:
      accreditation_image:
        display: "Accreditation Image"
        type: assets
        container: main
        required: true
        allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]
        max_files: 1
        width: 33%
      accreditation_image_description:
        display: "Accreditation Image Description"
        instructions: "(For screen readers only, will not appear on the front page)"
        type: text
        width: 33%
      accreditation_section_description:
        display: "Accreditation Description"
        type: textarea
        width: 33%

  additional_info:
    display: "Additonal info"
    instructions: "This is for the light purple area, on the right side"
    type: redactor
    container: main
    allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]

Masthead fieldset partial

title: "Hero Banner: Jumbo"
hide: true
fields:

  # Hero Section
  hero_banner_jumbo_section:
    type: section
    display: "Hero Banner"

  # Jumbo hero banner
  upload_grid:
    type: grid
    display: "Hero Banner Set"
    instructions: |
      Banner Large = Desktop Image. Optimal size: 2560px wide by 1667px tall
      Banner Small = Mobile/Tablet Image. Optimal size: 1016px wide by 909px tall
    starting_rows: 1
    min_rows: 1
    max_rows: 1
    fields:
      hero_large:
        display: "Banner: Large"
        instructions: "Desktop Image"
        type: assets
        container: main
        max_files: 1
        folder: banners/hero/jumbo
        restrict: true
        allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]
        resize:
          width: 2560
          height: 1277
          quality: 90
          upsize: true
        width: 35%
      hero_small:
        display: "Banner: Small"
        instructions: "Mobile/Tablet Image"
        type: assets
        container: main
        max_files: 1
        folder: banners/hero/jumbo
        restrict: true
        allowed: [png, PNG, gif, GIF, jpg, JPG, jpeg, JPEG, webp, WEBP, WebP, webP]
        resize:
          width: 1016
          height: 909
          quality: 90
          upsize: true
        width: 35%
      hero_caption:
        display: "Caption"
        instructions: "This caption appears when you hover over the image. It's also helpful for assistive technologies."
        type: text
        required: false
        width: 30%

Template Code

The template code is a partial passed into a section/yield tags in the homepage template, then into the default layout template:

layout template

  {{yield:masthead}}

Homepage template

{{# YIELD CONTENT FOR MASTHEAD #}}
{{section:masthead}}
  {{partial:masthead/_masthead--jumbo css_class_vars="overlay-color--three" page_location_vars="homepage" :hero_large_vars=""}}
{{/section:masthead}}

Masthead template partial w/banner image

<section class="full-width masthead hero max-height-100-percent">
  <div class="block block--content has-layered-media-block is-hidden--mobile {{ css_class_vars }}">
    <figure role="img" class="banner banner--full-height">
      {{ upload_grid limit="1" }}
        {{ if hero_large }}
           <picture>
             <source
               media="(min-width: 2024px)"
               srcset="{{ glide src='{{ hero_large }}' tag='false' fit='crop_focal' width='2560' height='376' quality='95' }}">
            <source
              media="(min-width: 1024px)"
              srcset="{{ glide src='{{ hero_large }}' tag='false' fit='crop_focal' width='2560' height='376' quality='95' }}">
             <source
               media="(min-width: 1925px)"
               srcset="{{ glide src='{{ hero_large }}' tag='false' fit='crop_focal' width='2560' height='779' quality='85' }}">
             <source
               media="(min-width: 1024px)"
               srcset="{{ glide src='{{ hero_large }}' tag='false' fit='crop_focal' width='2560' height='779' quality='85' }}">
             <source
               media="(min-width: 960px)"
               srcset="{{ glide src='{{ hero_large }}' tag='false' fit='crop_focal' width='2560' height='779' quality='48' }}">
             <source
               media="(min-width: 750px)"
               srcset="{{ glide src='{{ if hero_small }}{{ hero_small }}{{ else }}{{ hero_large }}{{ endif }}' tag='false' fit='crop_focal' width='1016' height='686' quality='88' }}">
             <source
               media="(min-width: 560px)"
               srcset="{{ glide src='{{ if hero_small }}{{ hero_small }}{{ else }}{{ hero_large }}{{ endif }}' tag='false' fit='crop_focal' width='1016' height='686' quality='72' }}">
             <source
               media="(min-width: 465px)"
               srcset="{{ glide src='{{ if hero_small }}{{ hero_small }}{{ else }}{{ hero_large }}{{ endif }}' tag='false' fit='crop_focal' width='1016' height='686' quality='60' }}">
             <source
               media="(min-width: 320px)"
               srcset="{{ glide src='{{ if hero_small }}{{ hero_small }}{{ else }}{{ hero_large }}{{ endif }}' tag='false' fit='crop_focal' width='1016' height='686' quality='45' }}">
             <source
               media="(min-width: 180px)"
               srcset="{{ glide src='{{ if hero_small }}{{ hero_small }}{{ else }}{{ hero_large }}{{ endif }}' tag='false' fit='crop_focal' width='1016' height='686' quality='45' }}">
             <img
               src="{{ glide src='{{ hero_large }}' tag='false' fit='crop_focal' width='2560' height='376' quality='85' }}"
               alt="{{ if hero_caption }}{{ hero_caption }}{{ else }}{{ if {globals:company_name} }}{{ globals:company_name }} - {{ endif }} {{ title }}{{ endif }}"
               title="{{ if hero_caption }}{{ hero_caption }}{{ else }}{{ if {globals:company_name} }}{{ globals:company_name }} - {{ endif }} {{ title }}{{ endif }}">
           </picture>
          {{ else }}
            <img role="img" src="{{ glide src='{{ site_url }}assets/placeholder-images/placeholder-home-hero-banner-2560x1213.jpg' tag='false' fit='crop_focal' width='2560' height='376' quality='60' }}"
            alt="{{ if hero_caption }}{{ hero_caption }}{{ else }}{{ if {globals:company_name} }}{{ globals:company_name }} - {{ endif }} {{ title }}{{ endif }}"
            title="{{ if hero_caption }}{{ hero_caption }}{{ else }}{{ if {globals:company_name} }}{{ globals:company_name }} - {{ endif }} {{ title }}{{ endif }}">
        {{ endif }}{{# /if hero_large #}}
      {{ /upload_grid}}
    </figure>
  </div><!-- /.block -->



  <div class="overlay-content">
    <div class="overlay-graphics logo">
      <a href="{{ homepage }}" title="Homepage">
        <figure>
          <img src="{{ theme:asset src="img/logo/adoption-options-logo.png" }}" alt="" title="">
        </figure>
      </a>
    </div><!-- /.logo -->

    {{ globals__masthead }}
      <div class="overlay-graphics ctas">
        {{ globals_masthead_item_one }}
          {{ if item_label or item_description or item_url }}
            <a class="cta"
              href="{{ item_url or '#/' }}"
              title="{{ item_description or 'Make a Donation' }}">
                <span class="label">
                  {{ item_description or 'Make a Donation' }}
                </span><!-- /.label -->
                <figure class="icon-wrapper">
                  <span class="icon"><img src="{{ theme:asset src="img/icons/heart-icon--purple.gif" }}" width="40" height="40" alt="" title=""></span>
                </figure><!-- /.icon-wrapper -->
            </a>
          {{ endif }}
        {{ /globals_masthead_item_one }}

        {{ globals_masthead_item_two }}
          {{ if item_label or item_description or item_url }}
          <a class="cta"
            href="{{ item_url or '#/' }}"
            title="{{ item_description or 'Social Enterprise' }}">
              <span class="label">
                {{ item_description or 'Social Enterprise' }}
              </span><!-- /.label -->
              <figure class="icon-wrapper">
                <span class="icon"><img src="{{ theme:asset src="img/icons/heart-icon--greyblue.gif" }}" width="40" height="40" alt="" title=""></span>
              </figure><!-- /.icon-wrapper -->
          </a>
          {{ endif }}
        </div><!-- /.overlay-graphics.ctas -->
      {{ /globals_masthead_item_two }}
    {{ /globals__masthead }}
  </div><!-- /.overlay-content -->

</section><!-- /.masthead.hero.full-width -->

That's it.