If you've ever used images from Amazon's SiteStripe, you'll know that in many cases the resulting images are too small – even if you use the Large version!
This short guide will show you how to adjust the size of the images so that you can get your review article looking great.
There are a few plugins that assist with adding images from Amazon as well; we tend to use SiteStripe, since it's direct from Amazon and compliance issues or other issues around plugins being updated are less likely to occur.
If you want to resize images and you're using SiteStripe, the short version is:
SiteStripe allows you to choose 3 different sizes:
- Small: 110 Pixels
- Medium: 160 Pixels
- Large: 250 Pixels
All you need to do is find the piece of code that includes the size (ie. 110, 160, or 250) and change that to your desired size.
NOTE: As with any image, enlarging the size too much can result in a pixelated image
How to Resize a SiteStripe Image – Step by Step
First thing you need to do is log into your Amazon Associates account; then head over to Amazon and search for the product you want to feature:
Select the product you want to promote
Once you're on the product page, you will see SiteStripe offer 3 options for getting a link: Text, Image, and Text + Image. Select “Image”, and you will see options for selecting the Store ID and Tracking ID you want to tag the image with, as well as the size of the image:
But, this is the Largest option Amazon has – not very big.
In Gutenberg, you'd simply select the block by clicking on the image in the draft you're working on and then you can resize it easily just like any other image you insert:
This is just one of the things Gutenberg does better than the Classic Editor.
But, if you are still using the Classic Editor in WordPress, there's an option for you as well.
Once you have copied the link from SiteStripe:
Head over to the “Text” tab in the Classic Editor, and paste the code:
If I preview the post, the image looks like this:
To enlarge it, look for the part of the code that has:
- SL110 – if you selected Small image size
- SL160 – if you selected Medium image size
- SL250 – if you selected Large image size
In this case, since I selected Large for the image size, I'm looking for the SL250 – usually easiest to do a quick ctrl+f:
Simply changing the 250 portion to whatever your desired size is will change the image size:
In the example above, I've changed it to 400, as highlighted in orange. That results in an image that is now 400 pixels wide:
Here's a before and after:
That's all there is to it – hope that's helpful!
Let us know if you want to see more tutorials along this line, and if so what you want us to show.