Custom Section Not Appearing In "Add Section" List In Admin Editor

Shopify Discussion
1

I have a custom sections/custom-icons.liquid file that isn’t appearing in the “add sections” option in the Shopify admin editor for the homepage. I’m looking for a solution to get it to appear as an option here so I can add it to the homepage as I need it.

Below is the entire code for the section/custom-icons.liquid including schema. What am I missing?


  

    {% for i in (1..4) %}
      {% assign image_num = "image_" | append: i %}
      {% assign image = section.settings[image_num] %}
      

        
        {% assign heading_id = "image_" | append: i | append: "_heading" %}
        ## {{ section.settings[heading_id] }}
        {% assign text_body_id = "image_" | append: i | append: "_text_body" %}
        {% assign text_body_italic_id = "image_" | append: i | append: "_text_body_italic" %}
        

{{ section.settings[text_body_id] | newline_to_br }}

        

    {% endfor %}
  

  {% if template == 'customer/account' %}
Delete this section
{% endif %}

{% schema %}
{
  "name": "Custom Icons",
  "class": "index-section",
  "settings": [
    {
      "type": "header",
      "content": "Slider Settings"
    },
    {
      "type": "checkbox",
      "id": "autoPlay",
      "label": "Auto Play",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "wrapAround",
      "label": "Wrap Around",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "pageDots",
      "label": "Show Page Dots",
      "default": false
    },
    {
      "type": "header",
      "content": "Image 1"
    },
    {
      "type": "image_picker",
      "id": "image_1",
      "label": "Image",
      "info": "Upload an image for Image 1"
    },
    {
      "type": "text",
      "id": "image_1_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 1"
    },
    {
      "type": "text",
      "id": "image_1_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 1"
    },
    {
      "type": "checkbox",
      "id": "image_1_text_body_italic",
      "label": "Italic Text",
      "default": false
    },
    {
      "type": "header",
      "content": "Image 2"
    },
    {
      "type": "image_picker",
      "id": "image_2",
      "label": "Image",
      "info": "Upload an image for Image 2"
    },
    {
      "type": "text",
      "id": "image_2_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 2"
    },
    {
      "type": "text",
      "id": "image_2_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 2"
    },
    {
      "type": "checkbox",
      "id": "image_2_text_body_italic",
      "label": "Italic Text",
      "default": false
    },
    {
      "type": "header",
      "content": "Image 3"
    },
    {
      "type": "image_picker",
      "id": "image_3",
      "label": "Image",
      "info": "Upload an image for Image 3"
    },
        {
      "type": "text",
      "id": "image_3_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 3"
    },
    {
      "type": "text",
      "id": "image_3_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 3"
    },
    {
      "type": "checkbox",
      "id": "image_3_text_body_italic",
      "label": "Italic Text",
      "default": false
    },
     {
      "type": "header",
      "content": "Image 4"
    },
    {
      "type": "image_picker",
      "id": "image_4",
      "label": "Image",
      "info": "Upload an image for Image 2"
    },
    {
      "type": "text",
      "id": "image_4_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 2"
    },
    {
      "type": "text",
      "id": "image_4_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 2"
    },
    {
      "type": "checkbox",
      "id": "image_4_text_body_italic",
      "label": "Italic Text",
      "default": false
    }
  ]
}
{% endschema %}
2

@watt010 add Preset in schema then you can add this section on any position

Its your complete code for this section.

I hope this solution will help you.


  

    {% for i in (1..4) %}
      {% assign image_num = "image_" | append: i %}
      {% assign image = section.settings[image_num] %}
      

        
        {% assign heading_id = "image_" | append: i | append: "_heading" %}
        ## {{ section.settings[heading_id] }}
        {% assign text_body_id = "image_" | append: i | append: "_text_body" %}
        {% assign text_body_italic_id = "image_" | append: i | append: "_text_body_italic" %}
        

{{ section.settings[text_body_id] | newline_to_br }}

        

    {% endfor %}
  

  {% if template == 'customer/account' %}
Delete this section
{% endif %}

{% schema %}
{
  "name": "Custom Icons",
  "class": "index-section",
  "settings": [
    {
      "type": "header",
      "content": "Slider Settings"
    },
    {
      "type": "checkbox",
      "id": "autoPlay",
      "label": "Auto Play",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "wrapAround",
      "label": "Wrap Around",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "pageDots",
      "label": "Show Page Dots",
      "default": false
    },
    {
      "type": "header",
      "content": "Image 1"
    },
    {
      "type": "image_picker",
      "id": "image_1",
      "label": "Image",
      "info": "Upload an image for Image 1"
    },
    {
      "type": "text",
      "id": "image_1_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 1"
    },
    {
      "type": "text",
      "id": "image_1_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 1"
    },
    {
      "type": "checkbox",
      "id": "image_1_text_body_italic",
      "label": "Italic Text",
      "default": false
    },
    {
      "type": "header",
      "content": "Image 2"
    },
    {
      "type": "image_picker",
      "id": "image_2",
      "label": "Image",
      "info": "Upload an image for Image 2"
    },
    {
      "type": "text",
      "id": "image_2_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 2"
    },
    {
      "type": "text",
      "id": "image_2_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 2"
    },
    {
      "type": "checkbox",
      "id": "image_2_text_body_italic",
      "label": "Italic Text",
      "default": false
    },
    {
      "type": "header",
      "content": "Image 3"
    },
    {
      "type": "image_picker",
      "id": "image_3",
      "label": "Image",
      "info": "Upload an image for Image 3"
    },
        {
      "type": "text",
      "id": "image_3_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 3"
    },
    {
      "type": "text",
      "id": "image_3_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 3"
    },
    {
      "type": "checkbox",
      "id": "image_3_text_body_italic",
      "label": "Italic Text",
      "default": false
    },
     {
      "type": "header",
      "content": "Image 4"
    },
    {
      "type": "image_picker",
      "id": "image_4",
      "label": "Image",
      "info": "Upload an image for Image 2"
    },
    {
      "type": "text",
      "id": "image_4_heading",
      "label": "Heading",
      "info": "Enter a heading for Image 2"
    },
    {
      "type": "text",
      "id": "image_4_text_body",
      "label": "Text Body",
      "info": "Enter a text body for Image 2"
    },
    {
      "type": "checkbox",
      "id": "image_4_text_body_italic",
      "label": "Italic Text",
      "default": false
    }
  ],
  
  "presets": [
    {
      "category": "icons",
      "name": "custom icons"
    }
  ]
}
{% endschema %}
1 Like
3

It worked. Thank you!

Adding the below code to the bottom of schema was just what I was looking for. Thank you!

],
"presets": [
{
"category": "icons",
"name": "custom icons"
}
]
}
1 Like
4

Hello,

In my case it is not working.. I’m adding the presets code to the schema… but it’s giving me an error - “Invalid Default: ‘presets’ is not a valid attribute”

Here is the original code:

{%- if section.settings.show_section -%}

{%- for block in section.blocks -%}
{%- if block.settings.custom_icon != blank -%} {{ block.settings.custom_icon.alt | escape }} {%- else -%} {%- render 'icon', icon: block.settings.icon, stroke_width: 1.5 -%} {%- endif -%}

{%- if block.settings.title != blank or block.settings.content != blank -%}

{%- if block.settings.title != blank -%}

{{ block.settings.title | escape }}

{%- endif -%}

{%- if block.settings.content != blank -%}

{{ block.settings.content }}
{%- endif -%}
{%- endif -%}
{%- endfor -%}
{%- endif -%}

{% schema %}
{
“name”: “Text with icons”,
“max_blocks”: 4,
“settings”: [
{
“type”: “checkbox”,
“id”: “show_section”,
“label”: “Show section”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “stack_mobile”,
“label”: “Stack on mobile”,
“default”: false
}
],
“blocks”: [
{
“type”: “item”,
“name”: “Item”,
“settings”: [
{
“type”: “select”,
“id”: “icon”,
“label”: “Icon”,
“options”: [
{
“value”: “bi-add-to-cart”,
“label”: “Add to cart”,
“group”: “Shop”
},
{
“value”: “bi-gift-wrap”,
“label”: “Gift wrap”,
“group”: “Shop”
},
{
“value”: “bi-gift-box”,
“label”: “Gift box”,
“group”: “Shop”
},
{
“value”: “bi-heart”,
“label”: “Heart”,
“group”: “Shop”
},
{
“value”: “bi-ecology”,
“label”: “Ecology”,
“group”: “Shop”
},
{
“value”: “bi-plant”,
“label”: “Plant”,
“group”: “Shop”
},
{
“value”: “bi-shop”,
“label”: “Shop”,
“group”: “Shop”
},
{
“value”: “bi-shop-pin”,
“label”: “Shop with pin”,
“group”: “Shop”
},
{
“value”: “bi-alert”,
“label”: “Alert”,
“group”: “Communication”
},
{
“value”: “bi-chat”,
“label”: “Chat”,
“group”: “Communication”
},
{
“value”: “bi-comment”,
“label”: “Comment”,
“group”: “Communication”
},
{
“value”: “bi-customer-support”,
“label”: “Customer support”,
“group”: “Communication”
},
{
“value”: “bi-email”,
“label”: “Email”,
“group”: “Communication”
},
{
“value”: “bi-network”,
“label”: “Network”,
“group”: “Communication”
},
{
“value”: “bi-newsletter”,
“label”: “Newsletter”,
“group”: “Communication”
},
{
“value”: “bi-love”,
“label”: “Love”,
“group”: “Communication”
},
{
“value”: “bi-phone”,
“label”: “Phone”,
“group”: “Communication”
},
{
“value”: “bi-share”,
“label”: “Share”,
“group”: “Communication”
},
{
“value”: “bi-delivery”,
“label”: “Delivery”,
“group”: “Delivery”
},
{
“value”: “bi-fast-delivery”,
“label”: “Fast delivery”,
“group”: “Delivery”
},
{
“value”: “bi-returns”,
“label”: “Returns”,
“group”: “Delivery”
},
{
“value”: “bi-time”,
“label”: “Time”,
“group”: “Delivery”
},
{
“value”: “bi-secure-payment”,
“label”: “Secure payment”,
“group”: “Security”
},
{
“value”: “bi-mobile-payment”,
“label”: “Mobile payment”,
“group”: “Security”
},
{
“value”: “bi-computer-payment”,
“label”: “Computer payment”,
“group”: “Security”
},
{
“value”: “bi-credit-card”,
“label”: “Credit card”,
“group”: “Security”
},
{
“value”: “bi-shield”,
“label”: “Shield”,
“group”: “Security”
}
],
“default”: “bi-customer-support”
},
{
“type”: “image_picker”,
“id”: “custom_icon”,
“label”: “Custom icon”,
“info”: “60 x 60px .png with transparency recommended”
},
{
“type”: “text”,
“id”: “title”,
“label”: “Heading”,
“default”: “Your title”
},
{
“type”: “richtext”,
“id”: “content”,
“label”: “Content”,
“default”: “

Short content about your store

”
}
]
}
],
“default”: {
“blocks”: [
{
“type”: “item”,
“settings”: {
“icon”: “bi-delivery”,
“title”: “Free delivery worldwide”
}
},
{
“type”: “item”,
“settings”: {
“icon”: “bi-returns”,
“title”: “Satisfied or refunded”
}
},
{
“type”: “item”,
“settings”: {
“icon”: “bi-customer-support”,
“title”: “Top-notch support”
}
},
{
“type”: “item”,
“settings”: {
“icon”: “bi-secure-payment”,
“title”: “Secure payments”
}
}
]
}
}
{% endschema %}