Problem with {{content_for_index}} in index.liquid

Shopify Partner
3 0 0

Dear all,


I am very new to shopify theme development, now I am having a problem with my custom section that the Add Section interface in the customiser do not even appear.


I tried to follow the solution suggested here but it doesn't existed, must have been removed.


What I did so far:


1. In the  sections folder of my template, I have this file -> hero.liquid

<section class="container py-5">
    <div class="row">
        <div class="col-1g-6 col-md-8 mx-auto">
            {{ section.settings.description }}
        <a class="btn btn-secondary" href={{ section.settings.button_link }}>{{ section.settings.button_label }}</a>

{% schema %}
        "name": "Hero",
        "tag": "section",
        "class": "hero-section",
        "settings": [
            {"type": "text", "id": "title", "label": "Hero Section Title", "default": "Hero Heading text"},
            {"type": "richtext", "id": "description", "label": "Example Description", "default": "<p>Example Description</p>"},
            {"type": "text", "id": "button_label", "label": "Button label", "default": "Button"},
            {"type": "url", "id": "button_link", "label": "Heading Button Link"}
       "presets": [{
            "name": "Hero",
            "category": "Hero Section"

{% endschema %}

2. In the sections folder of my template, I have this header.liquid file

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <div class="container-fluid">
    <a class="navbar-brand" href="">Leena</a>
      aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>

    <div class="collapse navbar-collapse" id="navbarNav">
        <ul class="navbar-nav">
          {% for link in linklists.main-menu.links %}
            {% assign child_list_handle = link.title | handleize %}
              {% if linklists[child_list_handle].links != blank %}
                  <li class="nav-item">
                    <a class="nav-link" href="{{ link.url }}">{{ link.title }}</a>
                    [{% for childlink in linklists[child_list_handle].links %}
                        <li class="nav-item">
                            <a class="nav-link" href="{{ childlink.url }}">{{ childlink.title | escape }}</a>
                    {% endfor %}]
                {% else %}
                  <li class="nav-item">
                    <a class="nav-link" href="{{ link.url }}"> {{ link.title }} </a>
              {% endif %}
        {% endfor %}
        <li class="nav-item">
            <a class="nav-link" href="/cart">Cart</a>

3. In the layout folder, my theme.liquid file looks like this

<!doctype html>
  <title>{{ page_title }}</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="description" content="{{ page_description | escape }}">
  <link rel="canonical" href="{{ canonical_url }}">
  <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
  {{ content_for_header }} <!-- Header hook for plugins -->
  {{ 'bootstrap.min.css' | asset_url | stylesheet_tag }}
  {% section 'header' %}

  <main role="main">
    {{ content_for_layout }}

  {{ 'bootstrap.min.js' | asset_url | script_tag }}

4. then my index.liquid, which is located inside the templates folder, look like this, only one 1 line of code.

{{ content_for_index }}

5. My customiser shows nothing as shown the image below.




Thanks in advance for your help.











Replies 2 (2)

Shopify Partner
3 0 0

This has been solved.

Shopify Partner
1 0 0

How did you solved this issue.
What steps you took