How to remove image from collection - Craft theme

I am trying to keep the text on my collection, but when I add products to my collection, the product image appears on the cover (even though I did not add a cover picture) and the description falls off. This is on my homepage, where I have a collage (collection on left side, image on right). I would like to keep the text only, is it possible? Thank you!

First image is when my collection has no products, second image is when I add my products into the collection.

Hi @vhuang

The collection will take the featured image of the 1st product as cover image, that’s why when you add products to collection, the cover image will be shown there.

You can use custom CSS to hide it as you want, just copy my CSS below then add to the file sections/collage.liquid in your theme


Hello @vhuang ,

Could you please share your store url ( with pass if your store password is enabled ) then I can see and suggest something for you?

Best regards,
GemPages Support Team

@James_FoxEcom I applied your code and it worked! However, the description is missing. Is there a way to get that back? I have a short description under Christmas.

Please give me your store URL for I can check

peachypaperdesigns.myshopify.com

password: ppd

On the top menu click shop and it’ll take you to the collections list. Thanks!

Are you customizing for Collage section or Collection list section?

If you customize the Collection list page, do as instructions below:

  • Copy code below then replace all the content of file: snippets/card-collection.liquid
{% comment %}
    Renders a collection card

    Accepts:
    - card_collection: {Object} Collection Liquid object
    - media_aspect_ratio: {String} Size of the product image card. Values are "square" and "portrait". Default is "square" (optional)
    - columns: {Number} 
    - extend_height: {Boolean} Card height extends to available container space. Default: false (optional)
    - wrapper_class: {String} Wrapper class for card (optional)

    Usage:
    {% render 'card-collection' %}
{% endcomment %}

{%- liquid
  assign ratio = 1
  if card_collection.featured_image and media_aspect_ratio == 'portrait'
    assign ratio = 0.8
  elsif card_collection.featured_image and media_aspect_ratio == 'adapt'
    assign ratio = card_collection.featured_image.aspect_ratio
  endif
  if ratio == 0 or ratio == nil
    assign ratio = 1
  endif
  assign card_color_scheme = settings.card_color_scheme
  assign card_style = settings.card_style
  if wrapper_class == nil or wrapper_class == 'none'
    assign card_color_scheme = settings.collection_card_color_scheme
    assign card_style = settings.collection_card_style
  endif 
-%}

  

    

      {%- if card_collection.featured_image -%}
        

          

            
          

        

      {%- endif -%}
      
        

          ### 
            
          {%- if card_collection.description != blank -%}
            

              {{- card_collection.description | strip_html | truncatewords: 12 -}} {% render 'icon-arrow' %}
            

          {%- endif -%}
        
   
      

    

    {% if card_style == 'card' or card_collection.featured_image %} 
      
        

          ### 
            
          {% if card_collection.description != blank %}
            {%- if show_caption == true or card_collection.featured_image == nil -%}
            

              {{- card_collection.description | strip_html | truncatewords: 12 -}} {% render 'icon-arrow' %}
              

            {%- endif -%}
          {% endif %}
        

      

    {% endif %} 
  

  • Open file sections/main-list-collections.liquid

Find the line

{% render 'card-collection', card_collection: collection, media_aspect_ratio: section.settings.image_ratio, columns: 3 %}

Then replace by code below

{% render 'card-collection', card_collection: collection, media_aspect_ratio: section.settings.image_ratio, columns: 3, show_caption: true %}