When the holding image wont load

Hello,

I was wondering if someone would be able to help me. (my site is not online)

Basic rundown:
There are two different sections of the website which hold the same information. They’re basically a card with an image and title. One of the sections displays a the card with a “default no image”(blank image with logo) when the user hasn’t uploaded an image. The other does not show the “default no image” if the user hasn’t uploaded an image.

The goal:
I’m basically trying to have the second card of the website display the “default no image” like the first card.

This is the first card that has a working “default no image”

<div class="hello-class">
                <a href="{{ link }}">
                    {% if item.imageId != 0 -%}
                        {# date from DB -#}
                        {% set image = item.mainImage ?:item.image %}
                        <img src="{{ asset(imagePath(image), 'domain_images') | imagine_filter('small') }}"
                             alt="{{ title }}" class="media-object">
                    {% elseif item.thumbnail is defined and item.thumbnail is not empty -%}
                        {# data from elasticsearch -#}
                        <img src="{{ asset(item.thumbnail, 'domain_images') | imagine_filter('small') }}" alt="{{ title }}"
                             class="media-object">
                    {% else -%}
                        {{ utility_getNoImage(title) }}
                    {% endif -%}
                </a>
            </div>

This is the second card that does not display the “default no image”

<div class="hello-class">
               {% if flags b-and 2 -%}
                     {% if itemLevelInfo.hasDetail -%}
                      <a href="{{ detailURL }}">{{ Utility.image( data.thumbnail, data.title ) }}</a>
                           {% else -%}
                            {{ Utility.image( data.thumbnail, data.title ) }}
                          {% endif -%}
                      {% endif -%}
            </div>

I am really new when it comes to PHP, but i tried adding in the {{ utility_getNoImage(title) }} to the second card to no avail. Or even using the code from the first card on the second card, but that also didn’t’ work. I understand this isn’t the full php code, but i would of thought re-using the shorthand snippets would work. (I’ve re-used some other snippets that seem to work)

Funny, but whilst typing this i realized i could hack a work around by adding a css class to the card which will hold a color/image as a background and not worry about it. However It’s worth asking for help, learning something and it would be better having it all connected and automated.

Appreciate the help.

Hi @camptalk and welcome to the SP Forums.

Usually if an image is nor displaying it is because the path is incorrect.

Try viewing the web-page source path (right mouse-click, View Page Source), find the image and copy and paste the image path to a new browser tag.

1 Like

It looks as though you’re using a template or some form of CMS - the code is not PHP code.

My guess is Liquid

Thanks for the replies everyone.

It’s not an image path problem as the image works fine in the first card. It’s more so that i want to duplicate it showing up in the second card. Which is missing the {{ utility_getNoImage(title) }} and i don’t know how to add it in below the “end if” of the second card??

This isn’t shopify. I’m using eDirectory. Which has it’s own CMS but i have the full source code license etc. I believe their stack is php, symfony, bootstrap, sql amongst a few more. My understanding is that the PHP is ran through something to slim it all down and make font-end work easier. (guess)

Is there a way by looking at the above code you can add the {{ utility_getNoImage(title) }} into the second card as another End if?

thanks again.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.