[Resolved] Product Image Block with Gallery Images Showing Ordered Numbers

[Author]

Posts

[andrewF-6]

Tell us what you are trying to do?

1. I am trying to display my Product Block Gallery Images within my content template without ordered list numbering showing up on the Product Block Gallery images. For some reason they are displaying as Ordered Lists with a Number. I don't want the number to show up.
2. My map and Product Block Image within a Related Field do not show up when displaying the initial Ajax search result. They only display once I have displayed the search result and then I click on refresh. These items are supposed to display fully upon successful submission of the search criteria.

Is there any documentation that you are following?
No

Is there a similar example that we can see?
Yes - on the live site

What is the link to your site?
I have exposed the site ....
hidden link

You will have to enter the following values to see a result:
Enter in Surname: Forson
Card Number: 2222333344445555

Thank you

[Waqar]

Hi,

Thank you for contacting us and I'd be happy to assist.

I tried to view the website, but it seems to be behind a coming soon page.

Can you please share temporary admin login details, in reply to this message?

Note: Your next reply will be private and please make a complete backup copy, before sharing the access details.

regards,
Waqar

[andrewF-6]

I have to put the coming soon page back up but it does not stop you from logging in and then visiting the page in question.

Thanks

[Waqar]

Hi,

Thank you for sharing the admin access.

During troubleshooting, I noticed that some styles from the theme are responsible for the numbers before the gallery images.
( source: hidden link )

ol {
    list-style: decimal;
}

You can override these styles, by adding some custom CSS code in your view, for example:

.woocommerce .wooviews-product-image ol.flex-control-nav.flex-control-thumbs li, .woocommerce div.product .wooviews-product-image ol.flex-control-nav.flex-control-thumbs li {
	list-style: none !important;
}

Tip: To check which CSS code is applying to different page elements, you can use Google Chrome's inspect element tool, as explained in this guide:
hidden link

As for the intial AJAX loading issue, I couldn't see this and the output shows correctly everytime time, whether I use search form or visit it through the direct link (with search parameters in the URL ).

Can you please clear all involved caches, including your browser's cache and then test the page again? It would also be interesting to test this in a different browser to see if this is specific to a particular browser or extension.

regards,
Waqar

[andrewF-6]

My issue is resolved now. Thank you!