Export many files at once in webp format Photoshop

[Ludo_Figueiredo]

Hello, 

I have a question about webp format in photoshop. I want to export many files at once in webp format in Photoshop but I don't find the webp format in photoshop options. Is it normal? 

Best regards

[mxdsP]

@Stephen Marsh - Never mind, I'm just slow in the head. 

But the output files I get are not constrained to either max-height/max-width of the guide, it only obides to the first value on the height.

[Stephen Marsh]

I did state that I wasn't going to resize to the inner guides as it is too difficult for me to automate. The script should resize the content on a transparent background to either 1400 px width or 1800 px height.

The script is only for transparent backgrounds, not flattened.

Let me double check...

EDIT: It's working as I intended, if not as you expected. :]

You can adjust the fit image step:

// Fit image
fitImage(1400, 1800);

[Stephen Marsh]

Best not to add actions to the default action set.

Create a new action set (folder). Then add a new action in this set.

With an image open, record the execution of the script. Then you can reference it in the batch command.

[mxdsP]

Okay, thank you for your time and help, I really appreciate it.

I will tinker a bit, and adjust as you mentioned. 

Can this function be replaced

function fitImage(fWidth, fHeight) {
  /* NEARESTNEIGHBOR | BILINEAR | BICUBIC | BICUBICSMOOTHER | BICUBICSHARPER | BICUBICAUTOMATIC */
  if (activeDocument.height.value > activeDocument.width.value) {
    activeDocument.resizeImage(null, UnitValue(fHeight, "px"), null, ResampleMethod.BICUBIC);
  } else {
    activeDocument.resizeImage(UnitValue(fWidth, "px"), null, null, ResampleMethod.BICUBIC);
  }
}

 with this automation? Because the automation constrains the image to either width or hight withouth breaking the boundaries.

[Stephen Marsh]

They both do the same thing... Perhaps you don't like the step where it trims to transparency before the fit. You can try removing the following:

// Trim to transparency
app.activeDocument.trim(TrimType.TRANSPARENT);

[Carlos Rendon]

Ok thank you for your time ! 🙂 

[Stephen Marsh]

@Carlos Rendon 

Was the 1.2 version what you were looking for?

[Carlos Rendon]

Yes thank you so very much! 😄 

[schroef]

That's possible but would need quite some overhaul. At least, if you want to see the files you select. Otherwise it's not that hard to implement. @Stephen Marsh  could add a drop-down menu with option for files or folder, either one would use its own method. It's the same method layerstack script uses which comes with photoshop

[Stephen Marsh]

That's possible but would need quite some overhaul. At least, if you want to see the files you select. Otherwise it's not that hard to implement. @Stephen Marsh  could add a drop-down menu with option for files or folder, either one would use its own method. It's the same method layerstack script uses which comes with photoshop

By @schroef

I'm not interested in adding a GUI  :]

The multiselect = true that I added in the 1.2 version should be sufficient if one doesn't want to exclude certain selected file types automatically.

[schroef]

@Stephen Marsh 

i understand, i know what the hustle. For some scripts it can explode and take days to get it working properly. Im busy on such a case. PS ive added your code into that script, of course added you as author. 

Its a script to batch replace a smartObject which also has layereffects and hasperspective transform on it.
Being abble to export in more file-formats and being able to store every thing with ObjectToDescriptor is a big hustle.
But im almost there and learned some stuff along the way

For instance, getting the listbox to worktook long. But than getting it to work but also store these setting took a couple days actually. The issue was ObjectToDescriptor doesnt work on arrays so i converted it to a string. Than when i reload the script. The String is converted back to an Array. But then i had issues with the filepath's not being an Object but a String.. Took me while to figure that one out.

But also getting the UI to work. For instance i had to make your code work with the UI, so a user can actually change those settings if needed. That now works.

I think im gonna update all Adobe scripts which can export in different file formats and add webp every where. Like layercomps to files, export layers to files
UI design for the script ReplaceSmartObject

[Stephen Marsh]

i understand, i know what the hustle. For some scripts it can explode and take days to get it working properly.

Yes, there is the scriptUI layout, then linking up the code and making it all work with the interface etc. Not something I generally do, unless the script really needs it.

I think im gonna update all Adobe scripts which can export in different file formats and add webp every where. Like layercomps to files, export layers to files

By @schroef

WOW, that would be some work! The default Adobe scripts are complex.

It's long overdue for Adobe to update all of their default scripts, to include PNG and WEBP for Image Processor, adding WEBP into other scripts etc. in their current ExtendScript format... Then releasing all new UXP versions in the future as well. I'm not sure if UXP scripts can have a UI, or if that is the reason for UXP panels. I'm holding off on UXP until it's matured.

[schroef]

yeah i believe UXP can do panels or dialog as well. Im also holding off, though photoshop seems to be converting to them rather to fast. I feel its hardly polished though. I also find the language more complex. It pretty hardcore coding.

Well the image processor scripts are not that many. Though they use a different method in the dialog part. the way props are defined with Joonas ScriptUI website is much more intuitive and way faster to edit 

[ThomasOlsen]

This script works great- thank you so much!!!

[Stephen Marsh]

This script works great- thank you so much!!!

By @ThomasOlsen

You're welcome, thank you for taking the time to provide positive feedback!

[Moonstone5CE7]

The script is no longer functioning for me: When I put in the folder to the files I want to convert, it simply opens one of the files and does not save anything. 

[Stephen Marsh]

@Moonstone5CE7 

Which script, there are multiple versions in this thread. What is the version number and date in the header comments?

[Dazzling_passion6C1C]

Based on the feedback, seems like this thing works well, so first, thanks for creating it. I've installed the script but getting a Syntax Error on Line 1....cleary a user error, so, what am I doing wrong? 

[Stephen Marsh]

@Dazzling_passion6C1C 

You have made the common mistake of having the Format menu of Apple TextEdit set to Rich Text (RTF) mode - not Plaint Text mode. The clue would have been when changing the save file extension to .JSX it would have been .RFT and not .TXT

I recommend using BBEdit for working with code on a Mac, or Atom, Sublime Text, MS Visual Studio Code + Adobe ExtendScript Debugger

[DNVCJ88]

Hi @Stephen Marsh I have followed your steps to save the script. However it does not work on the folder I wanted to use it for. This folder has about 100 images in jpg format and when I run the script nothing happens. I have tried to run the script on a different folder and it worked. I can't work out what is stopping it working on this particular folder. Any help would be appreciated.

[schroef]

@DNVCJ88 

Do you get an error when you use that folder with jog files or something?

Ps are they jpg or jpeg, I'm not 100% sure this script will read the last. Should be updated if not

[Stephen Marsh]

@DNVCJ88 

There are multiple versions of the batch script, however, they should all process an input folder the same for .jpg|.jpeg extension files. The 1.2 version allows manually selected files, not an input folder, but it's also resizing.

There is also the version that doesn't perform batching, which can be recorded into an action for use with the native Automate > Batch command.

Can you show a screenshot of the contents of the problem folder? Is the path to the folder or permissions different?

[Rob35330516ixs7]

Hi @Stephen Marsh 

I hope I'm posting this in the correct place.

I've created a script which uses a combination of 2 of your scripts to process WEBP files. It uses the script you created with the help of Paul MR for recursive folder handling and an original script you wrote to convert multiple WEBP files.

However, I am having an issue which at first I thought was to do with PNG files but it actually seems to be smaller files where the script will stop processing. Would you be able to take a look and let me know what you think could be the issue?

/*
Batch Save As WebP 1000px Wide.jsx
https://community.adobe.com/t5/photoshop-ecosystem-discussions/looking-for-action-or-script-to-resize-and-save-webp-files/td-p/14282886
v1.1 - 8th December 2023, Stephen Marsh
Special thanks to Paul MR for the recursive folder processing code:
photoshopgurus.com/forum/threads/batch-and-subfolders.22134/
*/

#target photoshop

    (function () {

        if (app.documents.length === 0) {

            // Ensure that version 2022 or later is being used
            var versionNumber = app.version.split(".");
            var versionCheck = parseInt(versionNumber);

            // Fail
            if (versionCheck < 23) {
                alert("You must use Photoshop 2022 or later to save using native WebP format...");
                return;

                // Pass
            } else {

                if (confirm('All sub-folders under the selected input folder will be processed. Continue?', false)) {

                    var imageFolder = Folder.selectDialog('Select the top-level folder:');
					var outputFolder = Folder.selectDialog("Please select the output folder:");

                    var origDialogs = app.displayDialogs;
                    app.displayDialogs = DialogModes.NO;

                    // Script Execution Timer - Function    
                    var timeDiff = {
                        setStartTime: function () {
                            d = new Date();
                            time = d.getTime();
                        },
                        getDiff: function () {
                            d = new Date();
                            t = d.getTime() - time;
                            time = d.getTime();
                            return t;
                        }
                    };

                    // Script Execution Timer - Start    
                    timeDiff.setStartTime();

                    // Set the file processing counter
                    var fileCounter = 0;

                    if (imageFolder != null) processFolder(imageFolder);

                    function processFolder(folder) {
                        var fileList = folder.getFiles()
                        for (var i = 0; i < fileList.length; i++) {
                            var file = fileList[i];
                            if (file instanceof File && file.name.match(/\.(tif|tiff|jpg|jpeg|psd|psb)/i)) {
                                open(file);
								if (activeDocument.mode !== DocumentMode.RGB) {
									
									// Convert to sRGB & 8 bpc
									activeDocument.convertProfile("sRGB IEC61966-2.1", Intent.RELATIVECOLORIMETRIC, true, false);
									activeDocument.bitsPerChannel = BitsPerChannelType.EIGHT;
									
									// Run the optional action
									//app.doAction(actionName, actionSet);
									
									// Save as a copy and close
									saveWebP("compressionLossy", 75, true, true, true, true);
									activeDocument.close(SaveOptions.DONOTSAVECHANGES);
									
									// Increment the file saving counter
									fileCounter++;

								// If the doc is in RGB mode
								} else {
									// Convert to sRGB & 8 bpc
									//activeDocument.convertProfile("sRGB IEC61966-2.1", Intent.RELATIVECOLORIMETRIC, true, false);
									activeDocument.bitsPerChannel = BitsPerChannelType.EIGHT;
									
									// Run the optional action
									//app.doAction(actionName, actionSet);
									
									// Save as a copy and close
									saveWebP("compressionLossy", 75, true, true, true, true);
									activeDocument.close(SaveOptions.DONOTSAVECHANGES);
									
									// Increment the file saving counter
									fileCounter++;
								}
		
                                // // Start Main Code Block
                                // activeDocument.resizeImage(UnitValue(1000, "px"), null, null, ResampleMethod.BICUBIC); // width, height, resolution, method
                                // activeDocument.close(SaveOptions.SAVECHANGES);
                                // fileCounter++;
                                // End Main Code Block
                            } else
                            if (file instanceof Folder) {
								outputFolder = file;
                                processFolder(file);
                            }
                        }
                    }

                    // End of script
                    app.displayDialogs = origDialogs;
                    alert('Batch resize and WebP overwrite completed!' + '\r' + fileCounter + ' WebP files processed' + '\r' + '(' + timeDiff.getDiff() / 1000 + ' seconds)');
                }
            }

        } else {
            alert('Please close all open documents before running this script!');
        }
    
		function saveWebP(compType, compValue, xmpData, exifData, psData, asCopy) {
			/*
			v1.1 - 12th March 2023, Stephen Marsh
			https://community.adobe.com/t5/photoshop-ecosystem-discussions/saving-webp-image-by-script/td-p/13642577
			*/
			// Doc and path save variables
			var WebPDocName = activeDocument.name.replace(/\.[^\.]+$/, ''); // Remove file extension
			var WebPSavePath = outputFolder + "/" + WebPDocName + ".webp" // Change path as needed
			var WebPFile = new File(WebPSavePath); // Create the file object

			// // 
			// // // check for existing file object
			// // if (webpfile.exists) {
				// // // true = 'no' as default active button
				// // if (!confirm("file exists, overwrite: yes or no?", true))
					// // // throw alert("script cancelled!");
					// // throw null;
			// // }
			// //

			function s2t(s) {
				return app.stringIDToTypeID(s);
			}
			var descriptor = new ActionDescriptor();
			var descriptor2 = new ActionDescriptor();

			// Compression parameters = "compressionLossless" | "compressionLossy"
			descriptor2.putEnumerated(s2t("compression"), s2t("WebPCompression"), s2t(compType)); // string variable
			var WebPCompIsLossless = false; // set the default flag for compression
			if (WebPCompIsLossless == false) {
				// 0 (lowest lossy quality) - 100 (highest lossy quality)
				descriptor2.putInteger(s2t("quality"), compValue); //  number variable
			}

			// Metadata options
			descriptor2.putBoolean(s2t("includeXMPData"), xmpData); // Boolean param moved to function call
			descriptor2.putBoolean(s2t("includeEXIFData"), exifData); // Boolean param moved to function call
			descriptor2.putBoolean(s2t("includePsExtras"), psData); // Boolean param moved to function call

			// WebP format and save path
			descriptor.putObject(s2t("as"), s2t("WebPFormat"), descriptor2);
			descriptor.putPath(s2t("in"), WebPFile); // Save path variable

			// Save As = false | Save As a Copy = true
			descriptor.putBoolean(s2t("copy"), asCopy); // Boolean param moved to function call

			// The extension
			descriptor.putBoolean(s2t("lowerCase"), true);

			// Execute the save
			executeAction(s2t("save"), descriptor, DialogModes.NO); // Change NO to ALL for dialog
		}
		
	
	}());
	

[Stephen Marsh]

@Rob35330516ixs7 – I didn't receive a notification email, so I just stumbled over this post.

I have offered the solution in your other topic:

https://community.adobe.com/t5/photoshop-ecosystem-discussions/multiple-webp-conversion-script-with-...

I will update the code in this topic adding the mode change to RGB.

[melajuana]

If I do this as a batch action theres no way to set the images for example to be about 50kb upon output is there? The images in my folder that are to be convered range from 90kb to 20mb