• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
5

Export many files at once in webp format Photoshop

New Here ,
Feb 24, 2023 Feb 24, 2023

Copy link to clipboard

Copied

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

Capture d’écran 2023-02-24 120429.jpg

TOPICS
Actions and scripting , macOS , Windows

Views

30.9K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 2 Correct answers

Community Expert , Feb 24, 2023 Feb 24, 2023

WebP was introduced in Ps2022 as a native Save As (a Copy) option, not under Export As/Quick Export. You will either need to set up a batch action to save directly to WebP or to convert from PNG to WebP or use a custom script to save or convert to WebP.

 

In previous versions, there were 3rd party plugins from Google or other developers.

 

batch-webp.png

 

 

Votes

Translate

Translate
Community Expert , Mar 13, 2023 Mar 13, 2023

Update: A GUI version of the script here...

__________

 

Here is a batch script to save as WebP.

 

Features:

* Optionally run an action (edit the code to enable)

* Optionally ask to overwrite existing files (edit the code to enable)

* Set an input and output folder

* Set supported input file types (edit the code)

* Automatically converts non-RGB mode to sRGB space, 8 bpc

* RGB files automatically converted to 8 bpc

* Option to convert RGB mode to sRGB space (edit the code to enable)

* WebP lossy

...

Votes

Translate

Translate
Adobe
replies 107 Replies 107
Community Beginner ,
Mar 11, 2024 Mar 11, 2024

Copy link to clipboard

Copied

@Stephen_A_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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 11, 2024 Mar 11, 2024

Copy link to clipboard

Copied

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);

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 11, 2024 Mar 11, 2024

Copy link to clipboard

Copied

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 11, 2024 Mar 11, 2024

Copy link to clipboard

Copied

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.

mxdsP_0-1710151233287.png

mxdsP_1-1710151487000.png

 

 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 11, 2024 Mar 11, 2024

Copy link to clipboard

Copied

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);

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 12, 2024 Jan 12, 2024

Copy link to clipboard

Copied

Ok thank you for your time ! 🙂 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 12, 2024 Jan 12, 2024

Copy link to clipboard

Copied

@Carlos Rendon 

 

Was the 1.2 version what you were looking for?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 13, 2024 Jan 13, 2024

Copy link to clipboard

Copied

Yes thank you so very much! 😄 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Jan 11, 2024 Jan 11, 2024

Copy link to clipboard

Copied

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_A_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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 11, 2024 Jan 11, 2024

Copy link to clipboard

Copied

quote

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_A_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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Jan 12, 2024 Jan 12, 2024

Copy link to clipboard

Copied

@Stephen_A_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 ReplaceSmartObjectUI design for the script ReplaceSmartObject

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 12, 2024 Jan 12, 2024

Copy link to clipboard

Copied

quote

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.

 

quote

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.

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Jan 12, 2024 Jan 12, 2024

Copy link to clipboard

Copied

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 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 14, 2024 May 14, 2024

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
May 14, 2024 May 14, 2024

Copy link to clipboard

Copied

quote

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


By @ThomasOlsen


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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Mar 12, 2024 Mar 12, 2024

Copy link to clipboard

Copied

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. 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 12, 2024 Mar 12, 2024

Copy link to clipboard

Copied

@Moonstone5CE7 

 

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 21, 2024 Apr 21, 2024

Copy link to clipboard

Copied

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? 

Screenshot 2024-04-21 at 7.29.14 AM.png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 21, 2024 Apr 21, 2024

Copy link to clipboard

Copied

@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 TextMS Visual Studio Code + Adobe ExtendScript Debugger

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Feb 08, 2024 Feb 08, 2024

Copy link to clipboard

Copied

Hi @Stephen_A_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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Feb 08, 2024 Feb 08, 2024

Copy link to clipboard

Copied

@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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 08, 2024 Feb 08, 2024

Copy link to clipboard

Copied

@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?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 08, 2024 Feb 08, 2024

Copy link to clipboard

Copied

Hi @Stephen_A_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
		}
		
	
	}());
	

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 09, 2024 Feb 09, 2024

Copy link to clipboard

Copied

@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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 19, 2024 Jun 19, 2024

Copy link to clipboard

Copied

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

@ m e l a n k a y a

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines