WordPress comes with tools powerful enough to manage and edit images. Unfortunately, beginners are not always aware of the different features of WordPress.
In this tutorial we will cover the recurring questions and problems that beginners encounter and how to fix them.
But before, if you have never installed WordPress discover How to Install a WordPress Blog in 7 Steps et How to search, install and activate a WordPress theme on your blog
Then back to why we are here.
1. How to send images on WordPress?
The sending of image on WordPress is managed by the media library of WordPress.
You can insert an image into your content by clicking the "Add Media" button while writing an article or page.
You can also upload the images from the dashboard 'Media' menu and use them later in an article or page.
See also How to restrict access to WordPress media to certain users
You will need to access "Media> Add", to upload your images. Just click on the "choose files" button and then select the images you want to download from your computer.
2. How to change the alignment of articles on WordPress
You may have noticed that some popular blogs use images with text around them. This is done using the alignment feature.
You can choose the image alignment when uploading an image and before inserting it into your post.
Alternatively, you can also use the alignment buttons directly on the visual editor of WordPress.
Click the image to select it, then click the alignment buttons to adjust the alignment.
This operation is also possible from the new WordPress editor Gutenberg.
Discover How to use the Gutenberg editor of WordPress 5.0
3. How to add a caption under an image?
WordPress allows you to easily add caption on images. After uploading an image, directly on the add media window, you can edit several elements like: title, description, "alt" attribute and caption.
To add a caption on Gutenberg images, you can do so just below the image in question. There you will find a text box that you can use.
See also How to add a caption on an image from Gutenberg
4. How to display photos in columns and rows?
Often users ask us how to carefully display photos in columns and rows.
Let's say you want to share photos from a birthday party, or vacation photos. You can add them one by one in a post, but it will look like a long list of images.
See also our list of 5 WordPress plugins to create photo galleries
The best way is to group your photos is to create image galleries.
Just upload your images when editing a post or page.
In the media library, select the images you want to display and click on the link "Create a gallery" in the left column.
Then you have to click on the "Add New Gallery" button on the lower right corner of the window.
WordPress will show the gallery settings.
You can choose to link the gallery to an image, the number of columns, the size of the images in the gallery, etc.
Once you're done, click the "Insert Gallery" button to finish.
To create a gallery on Gutenberg, click on the + icon and then click on "Gallery".
This will add a block of content, then you can select the images to add to your article.
5. How to correct the error of the images to the missing one
Most WordPress themes allow you to prominently display a featured image for your articles. Here's how to set a featured image in WordPress to avoid missing thumbnails.
If you don't see a "featured image" section in your article edit box, then click "Screen options" on the top right corner of the screen and check the box. “Featured Image”.
Now you can click the "Set Featured Image" link to upload the featured image for your article.
After uploading the image, you need to click on the "Set Featured Image" button.
You will be able to see the selected image in the same section. You don't have to take any special action if you are using Gutenberg, because the featured image is always visible, on the "Document" tab in the toolbar on the right.
6. How to correct the problem of the images to the one that appear twice
Inserting an image in front of an article is often a mistake made by many beginners.
Once you've set a featured image, you shouldn't put it in posts.
Otherwise, you will have your images in one that will appear twice. One in the section of the image to one and the other in the content of the article.
Go further by discovering WordPress: Image with the one or not, what are the consequences
7. How to resize an image on WordPress
When you download images from your phone or camera, they are usually too big.
WordPress automatically creates small, medium, and large image sizes for your original image. But sometimes you might need to crop the image with different dimensions.
So much to see... 6 WordPress plugins to edit images on your blog
WordPress is not Photoshop, but it does offer basic image editing features such as: resizing, cropping, and the ability to rotate images.
Go to "Media> Add" and upload your image. After uploading the image, you will see an “Edit” link next to the uploaded image.
Go further by discovering How to compress and resize images on WordPress
Clicking on it will open a new image editing screen. This will also open the image editor on WordPress.
On the image editing screen, you will see buttons to perform some basic image editing tasks like cropping, rotating, resizing, etc.
Here ! The list of features is certainly not exhaustive, but there are several things you can do with images on WordPress.
Discover also some premium WordPress plugins
You can use other WordPress plugins to give a modern appearance and to optimize the handling of your blog or website.
We offer you here some premium WordPress plugins that will help you do that.
1. White Label Branding for WordPress Multisite
Do you use a multisite WordPress network? Are you a WordPress developer or a web designer who uses WordPress to create websites for his clients?
Have you ever wished it was easier to customize the menu and logo on each sub-website in your WordPress multisite network? Would you like to give each sub-website the ability to create their own branding? Look no further, this plugin is for you!
White Label Branding for WordPress Multisite allows you to control the branding of the main website and all sub-websites in a WordPress multisite network.
This plugin gives you the ability to create a global template that all network subsites will use. Or you can allow each sub-website in the network to create their own branding and customize their menus for the role of editor. You will also have full control over all user roles and capabilities.
Download | Demo | Web hosting
2. Ultimate WooCommerce Expandable Categories
Ce WordPress Plugin allows you to easily modify the long lists of boring WooCommerce categories, and replace them with different levels of sub-items in an accordion menu.
Its main features are: the possibility of activating it finally that it works automatically (no parameters required!), The support of multiple levels of categories (categories, sub-categories, etc.), the highlighting of the active category, the opening of all parent categories if the current category is inside, compatibility with any WooCommerce theme, responsive at will, free updates and very active customer support.
Download | Demo | Web hosting
3. WooCommerce Estimated Shipping Date Per Product
WooCommerce Estimated Shipping Per Product is a WordPress Plugin which allows you to display the estimated delivery date of the product on your website. You will be able to view the estimated delivery date on the product page, cart page and order page.
Its main features are: the possibility of defining the fixed delivery date of the product, the activation or deactivation of the delivery date on the cart page, the payment page and the order page, options to define the message delivery date, and more.
Download | Demo | Web hosting
Recommended Resources
Check out other recommended resources that will help you resolve other common WordPress errors.
Conclusion
Here is ! That's it for this tutorial, I hope it has given you an understanding of how to resolve image issues encountered on WordPress. Do not hesitate to share it with your friends on your Social Media preferred.
However, you will also be able to consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation.
But in the meantime, tell us about your Comments and suggestions in the dedicated section.
...
Hello,
Your article is very interesting. However, I ran into a problem that you don't mention.
I upgraded to WordPress 8.5 ... I can't display the images in the sidebar inside the sponsored ads area
The images display a small square.
Thank you in advance for your assistance
Hello,
How do you prevent the images from being directly accessible via monsite.fr/lenomelimage.jpg
Hello,
We use Jetpack for this.
Hello,
Is there any other solution than jetpack?
Thank you very much
Hello,
YES there is WPRocket
Hello,
Excuse me, I have not seen an option in wp-rocket which allows to solve the problem of the images that I mentioned above: /
Hello,
for several weeks my photos and videos have been blocked for over-sending on the site or for security reasons. It has never happened before.
Thank you for unblocking the situation that hampers the smooth running of this school blog.
Hello,
What is your web host?
Hello, I have read everything and I have not found solutions to my problem for two days of research.
IMG_xxxxxx.jpg
This file is empty. Please send something more substantial. This error can also be caused by disabling file upload in your server's php.ini file, or by a lower post_max_size value than upload_max_filesize in that same php.ini.
I resized all my photos to reduce the weight of each one and still no way to download jpeg and pdf.
HELP Help help !!!
Thank you in advance.
As a developer this is the first time I have encountered this type of error. can you give me more information:
- this problem has existed since when?
- did you do something that may be causing this error?
-
Thank you for this very clear tutorial. However, I have a problem with the captions of my photos. Everything is fine as long as there is no “é” in the legend… which on the site turns into an A followed by a c in the circle.
Can you explain this phenomenon to me and how to solve the problem?
I had started to delete my captions but I find it a shame ...
Hello Camin,
While waiting to find a solution for you, we recommend that you add your captions without the accents.
Thanks for taking time to respond to me.
Your proposal is a solution… which only half satisfies me!
Kind regards.
Hello,
your problem is related to the general encoding of your blog. in principle, your content must be encoded in UTF-8 this encoding allows you to display special characters in French. now guessing where the problem comes from is not so obvious.
your site can actually be encoded, but the browser does not support it.
your site may be well encoded, but saving data to the database is not. for the occasion you will have to check the encoding of the tables of your blog,
is the error general? if not then the problem may come from the theme which does not correctly declare the encoding, or which uses a php function which escaped the encoding.
good luck.
reminder: if the task seems complicated, we can help you. request an audit, it's free.