How To Hide or Show Collection List Title From The Homepage Of Dawn Theme

Store Design
, ,
1

Hi how to have an option to remove and show the collection titles ? My theme is dawn

https://mamami4u.com/

feliciatan9832_0-1674110777471.png
feliciatan9832_0-1674110777471.png817×648 95.2 KB

2

@felicia9832

Hello,

.collection-card-wrapper .card__heading {
	display: none;
}

Add this CSS at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

Like This

oscprofessional_0-1674112277132.png
oscprofessional_0-1674112277132.png1359×856 95.2 KB

1 Like
3

Hi @felicia9832 ,

Glad to support you today.

To can remove the title collection, you can check out my suggestion below to make it:

  1. Go to Edit code on Online Store:

GemPages_0-1674112563702.png
GemPages_0-1674112563702.png400×162 25.3 KB

  1. add my code above the tag on Theme.liquid:

I hope you find the answer helpful.

Kind & Best regards,
GemPages Support Team.

1 Like
4

Hi @felicia9832
If you want to hide the collection title on collection list section
You can try follow this path:
Themes => edit code => asset => base.css
and add this code to bottom of the file base.css

.section-collection-list .card__content {
  display: none;
}
1 Like
5

Hi if I want to just remove the main page but not other pages, how should I do it?

6

Hi @felicia9832

May I suggest to update code these steps:

  1. Go to Store Online-> theme → edit code
  2. Sections/main-collection-banner.liquid
  3. updated code below
{% comment %}theme-check-disable ImgLazyLoading{% endcomment %}
{{ 'component-collection-hero.css' | asset_url | stylesheet_tag }}

{%- style -%}
  @media screen and (max-width: 749px) {
    .collection-hero--with-image .collection-hero__inner {
      padding-bottom: calc({{ settings.media_shadow_vertical_offset | at_least: 0 }}px + 2rem);
    }
  }
{%- endstyle -%}

  

    

      {%- if section.settings.show_collection_title  -%}
      # 
        {{ 'sections.collection_template.title' | t }}: 
        {{- collection.title | escape -}}
      
      {%- endif -%}
      {%- if section.settings.show_collection_description -%}
        {{ collection.description }}

      {%- endif -%}
    

    {%- if section.settings.show_collection_image and collection.image -%}
      
        
      

    {%- endif -%}
  

{% schema %}
{
  "name": "t:sections.main-collection-banner.name",
  "class": "section",
  "settings": [
    {
      "type": "paragraph",
      "content": "t:sections.main-collection-banner.settings.paragraph.content"
    },
    {
      "type": "checkbox",
      "id": "show_collection_title",
      "default": true,
      "label": "Show collection Title"
    },
    {
      "type": "checkbox",
      "id": "show_collection_description",
      "default": true,
      "label": "t:sections.main-collection-banner.settings.show_collection_description.label"
    },
    {
      "type": "checkbox",
      "id": "show_collection_image",
      "default": false,
      "label": "t:sections.main-collection-banner.settings.show_collection_image.label",
      "info": "t:sections.main-collection-banner.settings.show_collection_image.info"
    },
    {
      "type": "select",
      "id": "color_scheme",
      "options": [
        {
          "value": "accent-1",
          "label": "t:sections.all.colors.accent_1.label"
        },
        {
          "value": "accent-2",
          "label": "t:sections.all.colors.accent_2.label"
        },
        {
          "value": "background-1",
          "label": "t:sections.all.colors.background_1.label"
        },
        {
          "value": "background-2",
          "label": "t:sections.all.colors.background_2.label"
        },
        {
          "value": "inverse",
          "label": "t:sections.all.colors.inverse.label"
        }
      ],
      "default": "background-1",
      "label": "t:sections.all.colors.label"
    }
  ]
}
{% endschema %}
  1. After that go to Theme-> customize → collection. You will see has an new option for it.

EBOOST_0-1674117197596.png
EBOOST_0-1674117197596.png1829×633 45.5 KB

1 Like
7

@felicia9832

.section-template--15039871877235__cc8bc3d9-c949-4306-bfcb-2d55fe97ae01-padding .card__heading {
	display: none;
}

Add this CSS at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

This Css Its Effect only homepage not for other pages

1 Like
8

if you only want to remove on home page you can try
You can try follow this path:
Themes => edit code => layout => theme.liquid
and add this code to bottom of the file theme.liquid before tag

{% if request.page_type == 'index' %}

{% endif %}
1 Like
9

Hi thank you for the help, may I know how can I make the collection image clickable to the collections urls?

10

Hi thank you for the help, may I know how can I make the collection image clickable to the collections urls?

11

Hi thank you for the help, may I know how can I make the collection image clickable to the collections list?