You need to be logged in to post in the forum - Log In

An active JCE Pro Subscription is required to post in the forum - Buy a Subscription

Support is currently Offline

Official support hours
Monday to Friday
09:00 - 17:00 Europe/London (BST)

Please create a new Ticket and we will get back to you as soon as we can.

#115382 Download images

Posted in ‘Editor’
This is a public ticket

Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.

Latest post by tomstark1963 on Wednesday, 29 November 2023 21:06 GMT

tomstark1963
Is there anyway to add a 'download' to the link for an image? Like below:
<a href="https://www.joomlacontenteditor.net/path/to/image" download="" />

We have a website that will have thousands of images that we need to create downloadable links for. Entering them manually will be incredibly time-consuming.

Thank you!!

Tom

Ryan
With thousands of images to process, this might be best done dynamically using javascript when the page loads, processing each image on the page as required. I got ChatGPT to generate this script, which looks suitable:

document.addEventListener('DOMContentLoaded', (event) => {
    // Select all images with .jpeg or .jpg extension
    const images = document.querySelectorAll('img[src$=".jpeg"], img[src$=".jpg"]');

    images.forEach(img => {
        // Get the image source and the filename
        const imgSrc = img.src;
        const imgName = imgSrc.split('/').pop();

        // Create an anchor element
        const anchor = document.createElement('a');
        anchor.href = imgSrc;
        anchor.download = imgName;

        // Wrap the image inside the anchor
        img.parentNode.insertBefore(anchor, img);
        anchor.appendChild(img);
    });
});
You can refine selector in the querySelectorAll method to better target the images, for example if the images are in a specific folder, then you can change the selector to:

document.querySelectorAll('img[src*="/images/"][src$=".jpeg"], img[src*="/images/"][src$=".jpg"]');

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

tomstark1963
Thank you for your response, and I added the code. I am not great at JavaScript, but it doesn't seem to work.
I should add that I added the JavaScript in the global JavaScript section of my template.

Tom

Ryan
Please post a link to an article on your site that contains an image that you want to link.

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

tomstark1963
I think this might be getting too in-depth for what we are actually looking for. What we would really like is to add a 'download' option to the Target dropdown list of items. Is that possible?

Ryan
What we would really like is to add a 'download' option to the Target dropdown list of items. Is that possible?


I will look into this for the next update, but until then you can add a download attribute to any link in the Advanced tab of the Link dialog:

https://cdn.joomlacontenteditor.net/tmp/115382-download-images.gif

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

tomstark1963
Thank you so much for the solution!! I am hoping the suggestion I made will be possible for the next release. It would make it easier for sure.

Ryan
You can actually do this with just the File Manager:

https://cdn.joomlacontenteditor.net/tmp/115382-download-images-2.gif

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

tomstark1963
Yes, we saw that, however, we are not creating links for the images. We are adding links to the actual image so they see what they are downloading. That is why the target option would work best.

Ryan
You can still use the File Manager to add a link to an exsiting image.

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

tomstark1963
Awesome!! That works great!!

Thanks so much!
Tom