Question

Image aspect ratio error when posting to Instagram from WordPress.

  • 11 December 2023
  • 11 replies
  • 140 views

Badge +1

Hi,

In the attached issue you can see that I am receiving an image aspect ration error when posting to Instagram for Business.  My flow is creating a post in instagram when a new post is published in Wordpress.  

I need Zapier to change the image aspect ratio as part of the flow. It is not manageable for me to make changes manually each time this happens.  

Is this possible in Zapier?  It would need to check the aspect ratio each time and change if required.

 


This post has been closed for comments. Please create a new post if you need help or have a question about this topic.

11 replies

Userlevel 7
Badge +14

Hi @steve_AWN 

Good question.

We would need to see detailed screenshots with how your Zap steps are configured to have enough context.

Badge +1

Hi @Troy Tessalone 

 

Thank you - here are some screen prints of the steps:

 

 

 

 

I also notice that the link posted to instagram is not clickable, so I will look at that as a separate issue.

 

Many Thanks,

Steve

Badge +1

Run ID 01078803-f4c4-a2d4-bef0-c1b46eb94dd1

is one of the few that failed this morning with this error.

Userlevel 7
Badge +14

@steve_AWN 

We would need to see screenshots of the DATA IN/OUT for each step in the example Zap Run.

Badge +1

 

HI - see attached. Let me know if there is more information required.  Thank you!

 

 

 

While Zapier lacks native image editing capabilities, achieving your desired workflow is possible through alternative steps. Consider exploring dedicated image manipulation tools available within Zapier's ecosystem, like Image Optimizer or ImageResize.io.

These tools can be integrated into your Zap to automatically analyze image aspect ratios on every WordPress post publication. If the ratio doesn't match Instagram's requirements, these tools can resize the image accordingly before it reaches your Instagram Business account, streamlining your automation and eliminating manual intervention.

Userlevel 7
Badge +6

Hi there @steve_AWN,

I did some digging into this, and it seems like Instagram is only able to accept images that already fit between the aspect ratio ranges of 4:5 and 1.91:1.

That said, you might need to add an another app to resize the image before sending to Instagram.

mallabee has an action that can resize images:
https://zapier.com/apps/mallabee/integrations

7856285e4ff9d4cc05cf4ed9a3034d61.png
(view larger)

Hopefully, this helps.

Badge +1

Thank you - I am unable to get involved in further applications which will ultimately require more subscription payments.  I’d prefer to run some code to check if the size is greater than 1500 x 1500 (according to instagram image post size).  Can this be done and if so what is the code required?

@steve_AWN I had a similar issue, I was able to solve this using the code by Zappier block.

First, the issue is that Instagram expects an image with an aspect ratio between 4:5 and 1.91:1.

So basically you need to look through all the images attached to the particular WordPress post and choose the best one that falls between this ratio.

 

You can combine the info from Instagram and WordPress API to write a JavaScript code that solves the issue

https://help.instagram.com/1631821640426723



First, you need to locate the media link from the post details. See image below.

 

 

Next, you need to use that to fetch the media object using WordPress API

https://developer.wordpress.org/rest-api/reference/media/#retrieve-a-media-item

 

Then with some logic in the code block, you can find all the pictures that will work with Instagram and choose the best.


 

 

 

The output will look like this:

 



You can now parse this image URL into your Instagram action

 

This is the code for ease:
 

const res = await fetch(inputData.mediaLink);
const body = await res.json();
const sizes = body["media_details"]["sizes"];
let aspect_ratios = {};
let best_size = '';

for (const [sizeName, sizeData] of Object.entries(sizes)) {
let ratio = sizeData.width / sizeData.height;
if(ratio >= 0.8 && ratio <= 1.91){
if(best_size == ''){
best_size = sizeName;
}else{
if(sizes[sizeName]['width'] > sizes[best_size]['width']){
best_size = sizeName;
}
}
}
}


return {ig_best_image: sizes[best_size]['source_url']};

 

Badge +1

Thank you, @redehubng - this is really interesting and useful.  However in my scenario, there is only one image, the featured image.   Hopefully there is some code that will resize it!  

Interestingly you use wp links featured media href as your reference item in the input.  I tried that and it failed to find the image, so I merged to generate some code in an additional zapier step which gets the actual URL then I pass that into Instagram (see below).  I’ve seen loads of posts using that input reference but I couldn’t seem to get it to work, hence this additional code.  The input is a bit of wordpress post that contains the url (maybe I could have just referenced that item instead of adding code, something I will investigate).

 

# Define a function to extract the first image URL from a string
def extract_image_url(image_urls):
# Split the string into a list of URLs
urls = image_urls.split(",")
# Return the first URL in the list
return urls[0]

# Get the image URL from the input data
image_urls = input_data["image_url"]
# Call the function to extract the first image URL
url = extract_image_url(image_urls)

# Print the URL
print(url)

# Create a dictionary with the URL as the output
output = {"url": url}

 

@steve_AWN 

The way WordPress media works is that for every featured image ( or any other image) there are always multiple versions generated for you by WordPress and your theme can add extras too.

https://enginescout.com.au/wordpress-image-sizes/

 



The media link I used allows you to get all of the image sizes available 

The media link can be found if you add a WordPress action and select find post (the post ID should come with your event).

 

My final flow for my use case is shared below.