Section content not displaying in the editor

Highlighted
New Member
2 0 0

Hello,

I've created a page template page.about-us-custom.liquid.  Inside that I call 3 sections:

{% section 'custom-about-us' %}
{% section 'custom-statements' %}
{% section 'custom-creds' %}

custom-about-us.liquid is the 'main' section and has the HTML and it's own schema whos content is displaying fine in the editor.
custom-statements.liquid just has a schema and the id's are referenced in 'main' custom-about-us.liquid.
custom-creds.liquid just has a schema and the id's are also referenced in 'main' custom-about-us.liquid.

In the editor the page displays as expected and there are three 'Sections' available to add content; 'About us', 'Statements' and 'Creds'.... so far so good.

 

 

Anything I add into 'About us' is getting displayed on the page as expected.  But any content I add to the other two sections is completely ignored?  Although the editor does 'scroll' to where the content should appear.

Any ideas?

(template) page.about-us-custom.liquid

 

{% section 'custom-about-us' %}
{% section 'custom-statements' %}
{% section 'custom-creds' %}

 

 

(section) custom-about-us.liquid

 

<div id="content">
  <div class="shopify-section">
    <div class="container aboutus">
      <header>
        <h1>{{ section.settings.heading }}</h1>
      </header>
      <div class="video">
        <div class="responsive-video">
          <iframe width="560" height="315" src="https://www.youtube.com/embed/xxxxxxx" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
        </div>
      </div>
      <div class="textcontent">
        {{ section.settings.textcontent }}
      </div>
      <div class="mission">
        <img src="{{ section.settings.missionimage | img_url: "520x" }}" />
        <ul>
          {% for block in section.blocks %}
          <li>
            <h3>{{ block.settings.statement }}</h3>
            <p>{{ block.settings.statementtext }}</p>
          </li>
          {% endfor %}
        </ul>
      </div>
    </div>

    <div class="creds">
{{ block.settings.cred }} {{ block.settings.text2 }}
    </div>
    <div class="pageBanner">
      <div class="bannerText">
        <h2>{{ section.settings.bannerline1 }}</h2>
        <p>{{ section.settings.bannerline2 }}</p>
      </div>
      <img src="{{ section.settings.bannerimage | img_url: "520x" }}" />
    </div>
  </div>
</div>

{% schema %}
  {
    "name": "Page Content",
    "settings":
    [
      {
        "type": "text",
        "label": "Page heading",
        "id": "heading"
      },
      {
        "type": "richtext",
        "label": "Text Content",
        "id": "textcontent"
      },
      {
        "type": "image_picker",
        "label": "Banner image",
        "id": "bannerimage"
      },
      {
        "type": "text",
        "label": "Banner Text line one",
        "id": "bannerline1"
      },
      {
        "type": "text",
        "label": "Banner Text line two",
        "id": "bannerline2"
      }
    ]
  }
{% endschema %}

 

 

(section) custom-statements.liquid

 

{% schema %}
  {
    "name": "Statements",
    "class": "missions",
    "settings":
    [
      {
        "type": "image_picker",
        "label": "Mission Statement Image",
        "id": "missionimage"
      }
    ],
    "blocks":
    [
      {
        "type": "addstatement",
        "name": "Statement",
        "settings":
        [
          {
            "id": "statement",
            "type": "text",
            "label": "Statement",
            "default": "Statements"
          },
          {
            "id": "statementtext",
            "type": "text",
            "label": "Statement Text"
          }
        ]
      }
    ]
  }
{% endschema %}

 

 

(section) custom-creds.liquid

 

{% schema %}
  {
    "name": "Accreditations",
    "class": "creds",
    "blocks": [
      {
        "type": "image",
        "name": "Accreditation",
        "settings": [
          {
            "type": "image_picker",
            "id": "image",
            "label": "Image"
          },
          {
            "type": "text",
            "id": "cred",
            "label": "Cred"
          },
          {
            "type": "text",
            "id": "text2",
            "label": "Info"
          }
        ]
      }
    ]
  }
{% endschema %}

 

 

Thank you!

0 Likes
Highlighted

Are you using the "custom-statements" section anywhere else besides this specific page?

I have came across issues where I had to create an exact copy of the section because of this very same problem. 

For the sake of testing, try creating a section with the contents of "custom-statements" but name it something like "statements-about-page" and let me know how it goes.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Needing urgent help? I am currently available for hire, same day response guaranteed: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
New Member
2 0 0

Hi diego_ezfy, I tried your suggestion but it's still not working.  I'm pretty new to this so still struggling to get my brain around it.  Should I be using 'page handle'?  If so, how?

UPDATE:  I have just setup a 'sandpit' using the Debut theme and the same problem persists.  So now i'm thinking this isn't even possible or i'm fundamentally missing something?

0 Likes
Highlighted
Excursionist
32 4 9

Hey @Mechanised

It looks to me like your other sections just consist of {% schema %}. This tells the Theme Editor what you can configure, but doesn't output it. The output is in the HTML that the first section has. Try putting {{ section.settings.[setting] }} statements at the top of those sections and see what comes out.

0 Likes