Scraping images after click

How to?
#1

So, I can't seem to scrape the images on the following url:
https://www.heo.co.uk/uk/en/product/P1SUPMGV-04

I need to get the highest quality version of the images (they usually "x_" before the rest of the filename)
To get these you need to click the image and then scrape the images from the carousel(by either clicking on the thumbnails or hovering over them).
I'd simply change them using the replace tool in excel if it was possible, but unfortunately some products dont have the x_ before their file name (due to only having lower resolution images).
So is there a way I can scrape the images after clicking on them?

#2

Hello @xpna

It is possible but you will have to use Web Scraper Cloud parser to transform the link from small size to max size.

For Example this: https://www.heomedia.com/img/nrm/m_p1supmgv-04.jpg
To this: https://www.heomedia.com/img/nrm/x_p1supmgv-04.jpg

You can notice that the only difference between these 2 images is that the small one has "m_p1supmgv-04.jpg" and the other "x_p1supmgv-04.jpg", all you have to to do is to replace the letter "m" with "x". And to extract each image you will have to take every division, i believe there are 4 of them and each of the division has 6-9 images. So for example: division 1, image 2 - div.slick-track > div:nth(0) > div:nth(1) img, division 4, image3 - div.slick-track > div:nth(3) > div:nth(2) img

Hope that makes sense. :smiley:

Text to replace
Text to replace2237×936 108 KB

Sitemap example:

{"_id":"heo-co","startUrl":["https://www.heo.co.uk/uk/en/product/P1SUPMGV-04"],"selectors":[{"id":"image-1","type":"SelectorImage","parentSelectors":["_root"],"selector":"div.slick-track > div:nth(0) > div:nth(0) img","multiple":false,"delay":0},{"id":"image-2","type":"SelectorImage","parentSelectors":["_root"],"selector":"div.slick-track > div:nth(0) > div:nth(1) img","multiple":false,"delay":0},{"id":"image-3","type":"SelectorImage","parentSelectors":["_root"],"selector":"div.slick-track > div:nth(0) > div:nth(2) img","multiple":false,"delay":0},{"id":"image-9","type":"SelectorImage","parentSelectors":["_root"],"selector":"div.slick-track > div:nth(1) > div:nth(2) img","multiple":false,"delay":0}]}

Helpful resources:
https://webscraper.io/documentation/css-selector