Hello everyone!
I try to do the custom API call to upload a media to WordPress, but I got errors
Can some help me do that please!
OR
Build this Piece for WordPress please!
piece name: Upload Media
Action: Upload a new media file from google drive or directly from DALLE-3, which can be used as featured media.
I can buy you a coffee!
You have my vote here too!
BTW this feature has always been a struggle, for platforms. Pabbly for example doesn’t have it, and it took Zapier quiet a while to have it working. I would be a great addition though to have
@IOBLR Can you build this action?
@izr_amine Sure, let me have a go at it.
@izr_amine FYI - If you want to attach an image when creating WordPress Post via AP, it’s easy
Hi @IOBLR,
Thanks for the suggestion on the Base64, I’ve tried to use this on the following image url:
https://www.flextender.nl/wp-admin/admin-ajax.php?action=kbs_flx_serveimage&file=ODB58D1FF03AEB2E215282DE49737E7BEUnfortunately it didn’t work for me. I’ve used the default “Create Post” functionality with the the image URL in Base64 as suggested above. The result is that a post is created which is expected but there is no featured image ID populated when creating adding the image like this. Neither without using Base64.
The strange point for me is when using this Image URL it all works fine…
https://hilversum.nl/themes/custom/hilversum/logo.svg
I hope you can help us out on this one! 
KR Bram
I built the flow, You can use it from here https://cloud.activepieces.com/templates/f6oWv22RjxxlrGDTMsqNn
Tested it multiple times successfully, If you encounter any issues/errors do post here.
This is the generic flow., Please change them according to your needs.
File field to include your own document data/url. Leave everything else as it is.Piece #4 - Custom code block - This is where magic happens
Edit the code block piece code and replace the values of username, password and wordpress URL fields - Look at the line numbers 2,3 and 4 for reference.
For now, I have used the value from description field for alt_text, caption and description, you can replace these as needed.
Hope it helps.
@Bram Can you share your flow?
After generating the image, You need to add another piece in the flow to convert the image to Base64 and place the Image url in the image field.
When creating new post in WordPress piece, Change the value of Featured Media URL with the base64 value you generated from “Image Helper” piece.
This should work, if not please export and share your flow.
Please see DM in your inbox
Hello @IOBLR!
I tested this workflow and it works amazing!
Can we change the file name?
For example this “wp-content/uploads/2024/02/file_1708079485405.png”
can we change it to “wp-content/uploads/2024/02/file_supercat.png”
I hope this is possible!
Great to know it’s working for you.
Yes you can easily change the filename
In flow Step #4 4. Upload to WordPress, We’re passing values like title, fileType, description, etc… Add a new field fileName and pass in your file name as value, example
"fileName": "myfilename.png"
In the code block code, Open the code editor and search for
const fileName = `file_${Date.now()}.${inputs.fileExtension}`;
It’s on line number 37, replace that line with
const fileName = inputs.fileName
This will allow you to pass in the file name dynamically.
@IOBLR
Amazing! you are a genius.
Every task work as I want.
But can you help me on this workflow issue
Hi @IOBLR. First, thank you for this addition. Works great without any issues. I need to use the image helper to resize the image so it is less than 3 Mb, then use the file helper to convert. Extra step, but again, great addition and thankful for sharing this. I am running into an issue, and I suspect it’s me not knowing coding. I implemented the change, so I could have a file name, name versus the file_date…. Everything works as expected, but I get the code string as the file name and not the name I entered in the query string on line 37. Is there another change or reference I need to make, so the file name gets populated correctly.
I noticed if I do not reference the extension, it still uploads a file, but it is a non reference file, but the name is there. Basically a file with no associated extension.
Thank you again for creating this…
Replace line 38 with
const fileName = `${inputs.fileName}.${inputs.fileExtension}`;
If you want to place a dynamic variable inside a string, you have to ${} (dollar sign and curly braces), Only then its value will be dynamically replaced.
Example: If we’re using the code you currently have and if you are passing fileName as ‘cat’
Then the actual value of variable fileName inside the code block will be inputs.fileName.png
Only the fileExtension got replaced as that is inside ${}
With the code I have provided, it will be cat.png because inputs.fileName is inside ${}
You can also take this a step further and do the following
const fileName = `activepieces_${inputs.fileName}.${inputs.fileExtension}`;
In this case the fileName inside code block will be activepieces_cat.png because activepieces_ is not inside ${} and is used as is.
You also mentioned you have to resize the image due to its size, You can update your WordPress file upload config and change MAX_FILE_SIZE to 20 MB or 100 MB to overcome this.
However I don’t think you should serve images of size greater than 500KB - 1MB, It would be better if you make use of CDNs.
@IOBLR Thank you again for the guidance on this. I figured it was something simple. Just did not realize I needed to enclose. Learnng (baby steps). Also, the file size restriction, yes, I agree and will more than likely leave as is. However, the file size issue (at least for me), is when I use the image helper or the file helper piece, and the generate image, or doc is greater than 2 Mb. it throws the “network disconnection” error and you have to refresh the page when converting. Not sure if it is the best method as a work around for this, but when I resize the generated image from Dalle, to 850x850 the actual file size is reduced from 3 Mb to under 2Mb and the piece flows with no errors. However, if i try to run either piece Image or File Helper pieces, without resizing first, I get that error and have to refresh the page, which no result will be provided. Is there a better work around for this?
Yep, that was the fix…
Thank you again for the code and help…
I’ve made it simpler. I use the existing function to “create a new WordPress post,” through which I can upload the image with the existing piece, and then I delete the post again via the API.
@Gio thank you sharing, I honestly did not think of doing that, however, the question I have… why upload the image if not going to use it in the post you created? Yes, you now have the image on the server, but the automation is to associate the image to the post for future use. At least for me… I guess there are different use cases… 
. Will remember this one…
@IOBLR i just noticed that I get 2 of the same generated image uploaded. 1 is named as expected, the 2nd image is named with the same name but now with a -1 in the name, but it is not referenced, just uploaded. It works fine when testing, only 1 image uploaded, but when flow runs normally, 2 are uploaded. With or without using loop for the post generation. I have a loop the runs for 2 heading titles in a request that is after image generation and upload. Just curious, does the loop function include all steps above or just the value of the piece in the settings? Can the script be limited to only upload 1 image?
Thank you
@Homelab1090 It should upload it only once, Can you share your flow? Either export it or share the public link or the screenshot of entire flow.
I think somehow the code is being called twice.
Hi @IOBLR I am thinking the samething in that for some reason my loop is also running the upload twice. Just not sure where it is being called? I exported, but not sure how to upload the file? It gives me an error. Attaching the screen shots of the flow. I removed the loop just now and tested again, and it uploaded 2 images…. Step 6 is where it uploads to WP. This is the new flow.
Thank agin for looking at this… it works great, except for the double uploading. .
Editing. Here is the flow with the loop in the flow
