Edit a page using the back-end editor of the Visual Composer
On our sample page, we’ve got two different sized images. We’ve got the large one on the right and a
thumbnail on the left. Let’s try to change the size of the image on the right side in a way that it would fill
the whole width of the column. Let’s go to our back-end editor. To do that, click on Edit on the top menu
bar of your WordPress.
Hover your mouse over the right image and click the pencil icon
To edit the image, hover your mouse over the image that we want to edit and a green bar will appear.
Click on the pencil icon.
Single Image Settings will pop-up – change image size from thumbnail to large
As you can see, the size of the image on the right image is ‘thumbnail’. So what we’re going to do is to
change the image size from thumbnail to large. Make it all in lowercase then press Save Changes. So
let’s preview our changes by pressing Preview Changes.
Image now set to large
Now, you’ll see that the image on the right got bigger.
Change row layout from three columns to two
Let’s have the layout of our row into two columns. To do that, click the option ½ + ½. So now we’ve got
two column pictures. Let’s preview our changes again.
Row layout now changed from 3 columns to 2
As you can see, the pictures are still filling the entire column width. The trick with this is that the large
image size is approximately 1024 pixels wide while the columns’ width is 585 pixels only. Now that the
picture’s width is greater than the column’s width, it will automatically shrink to exactly fit into the
columns entire width.
If we were going to change that picture’s size to medium, which is 300 pixels wide in default WordPress
settings, will definitely leave empty spaces inside the column.
Change image size from large to medium
Let’s try to change the image size from large to medium. The same process as before. Hover your mouse
over the image that you want to edit. Click on the pencil icon inside the green bar. Then, change the
image size from large to medium. Afterwards, click Save Changes and close the Single Image Settings. To
preview our changes, click on Preview Changes.
Image changed from large to medium
As you can see, the image is leaving big space in between. Setting the image to medium will usually work
to columns set to 1/3 or ¼.
Setting the image size approximately
If you’re going to set the size of the image, then you need to know the exact dimension that you want to
set. For example, let’s set the size to 500x200 pixels. 500 is the width of the image and 200 is the height.
So, this will give me a 500x200 pixels image.
Image now changed from large to 500x200 pixels
Now, as you can see, the image is now set to 500x200 pixels. We’ve also got a bit more room on the
sides because the column’s width is wide than the image’s size.
These are the dimensions of WordPress’s default image sizes:




thumbnail – 150 x 150 pixels
medium – 300 x 300 pixels
large – 1024 x 1024 pixels
full size – image’s full size