Hide the empty slide/ placeholder on slideshow DAWN

[Bird_on_a_Wire]

Hello!

Not all of my collections have enough images to fill a 5 slide slideshow so they have empty placeholder slides that rotate through after their pictures are up which isn’t ideal.

Is there a way of hiding these empty slides/placeholders if they do not have an image linked to them?

See screenshot below of the empty place holder I want to hide

SITE: https://e1c8d3.myshopify.com/collections/sibusiso-duma-1978

PASSWORD: thaits

Thanks in advance for any help!

[Honeypot]

I am not sure if i fully understood your question.

Why don’t you simply remove that slide from the slideshow?

[GemPages]

Hello @Bird_on_a_Wire ,

It’s the GemPages Support Team and we are glad to assist you today!

You could please try disabling the Image slide that you don’t use right here:

Let us know how it works for you.

Best regards,
GemPages Support Team

[PageFly-Victor]

Hi @Bird_on_a_Wire

You can try this code by following these steps:

Go to Online store => themes => customize => and hide it on theme edit

Hope this answer helps.

Best regards,

Victor | PageFly

[Bird_on_a_Wire]

Hi @PageFly-Victor @GemPages @Honeypot , unfortunately, that doesn’t work for me as then it hides the slide on all the pages even if the slide is filled in.

For reference, I am using category metafields to autofill the slide content on a template that is assigned to multiple categories

ie: here is a category that has all 5 images https://e1c8d3.myshopify.com/collections/craig-cameron-mackintosh-1987

and here is a category that only has 2 images https://e1c8d3.myshopify.com/collections/sibusiso-duma-1978 and they are both using the same template.

If I manually hide the last 3 slides then all my slideshows will only have 2 images… see my problem?

PASSWORD: thaits

[PageFly-Victor]

I understand your problem then if from my theme side hiding “image slide” will only hide an image on the slide I think you need to contact Shopify for them to check this more deeply.

[Honeypot]

Hey @Bird_on_a_Wire , Now i perfectly understand your issue.

First backup your actual theme.

Follow these steps:

1. Go to theme → edit code

2. Sections/slideshow.liquid

3. Find the button inside the for at line 41 and wrap it with this if statement:

{%- for block in section.blocks -%}
  {% if block.settings.image %}
    
  {% endif %}
{%- endfor -%}

4. Do the same at line 80 inside the for statement:

{%- for block in section.blocks -%}
  {% if block.settings.image %}
    
    
      

        {%- if block.settings.image -%}
          {%- assign height = block.settings.image.width | divided_by: block.settings.image.aspect_ratio | round -%}
          {{ block.settings.image | image_url: width: 3840 | image_tag:
            loading: 'lazy',
            height: height,
            sizes: "100vw",
            widths: '375, 550, 750, 1100, 1500, 1780, 2000, 3000, 3840'
          }}
        {%- else -%}
          {{ 'lifestyle-2' | placeholder_svg_tag: 'placeholder-svg' }}
        {%- endif -%}
      

      
        

          {%- if block.settings.heading != blank -%}
            ## {{ block.settings.heading | escape }}
          {%- endif -%}
          {%- if block.settings.subheading != blank -%}
            
              {{ block.settings.subheading | escape }}
            

          {%- endif -%}
          {%- if block.settings.button_label != blank -%}
            
              

          {%- endif -%}
        

      

    

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

5. This step is for unchecked auto rotate option. Wrap the button at line 142:

{%- for block in section.blocks -%}
  {% if block.settings.image %}
    
  {% endif %}
{%- endfor -%}

I hope this solution helps.