Adding Image borders in WordPress can be tricky. If you are not the technical sort and your forays into the world of WordPress are limited to blogging, the words like custom CSS, HTML, style sheets, and customized themes can sound like a foreign language. Though there is no harm in learning a new language, and it is always so much fun, you do need to figure out priorities. Are you willing to spend more time in diving into the intricate world of coding and styling? Or you prefer a simple lifestyle where you only want to write while sipping coffee and having a cat for company.

I have read that the older versions of WordPress had the option to add borders and paddings to pictures, but during the version upgrades, all this changed. However, you are not condemned to the borderless-picture existence forever!

Adding borders to pictures shouldn’t be difficult for simple-life enthusiasts.

And it isn’t.

There are many good WordPress beginner articles for beginners that provide detailed tutorials on adding borders to photos. Some techniques are simple and some are not so easy. I tried a few methods and have come up with the following three easy ways to add margins the beginners can easily use:

Create Image Borders with Inline CSS

Inline CSS is written inside the HTML tag, and even if you don’t know anything about coding it is quite easy to insert just one tag.

In your WordPress editor, open the post or page where you want to add borders to the images and click Text to change the view from visual to textual. This will bring you to the HTML version of the article:

Now find the image tags. Simply press Ctrl+f and all image tags on the page will be highlighted.

To add borders, you will add the inline CSS tag inside the image tag. Remember each image will have its own complete tag enclosed in < />

As long as you add the inline CSS inside the tag it doesn’t really matter where you put it. However, I find it easier to add it at the end. Look at the example below:

1px is the width of the border

Solid is border type

#000000 is the color of the border

You can change these properties according to your requirements.

This method though fairly simple can take too much time. You will have to find each image tag and insert the code manually. There is a simple way to do it with a WordPress plugin.

Let’s a have look at the other two methods that involve plugins.

Adding Image borders with Advanced Image Styles

Advanced Image Styles is my recommended plugin, and it is the one I use. It is open-source software, was last updated 2 years ago, has 30,000+ active installations, and works well with my WordPress version 5.2.2. Plus, it is very easy to set up and use. If you simply need to add solid borders to your photos, this is the plugin to use.

Moreover, you can install this plugin from your WordPress site dashboard. Simply open the dashboard, and click Plugins>Add New

Type Advanced Image Styles in the Search bar and the plugin will load on the page.

Click the Install button and Activate the plugin.

Once you have installed the plugin, adding borders to images is a breeze.

Open the article in the visual editor where you want to add borders.

Select the Image, and click the edit icon:

The Image Details window will open up.

Click the Advanced Options menu to expand it.

Now, in the Image Border field add Width and select colour.

Update.

Congratulations! You have added the border to your image:

Wasn’t this easy?

Let’s look at one more way to add borders.

Adding Image Borders with WP Image Borders Plugin

WP image borders is an old plugin and was last updated about four years ago. The plugin page shows 7000+ active installations and a good rating. I tried it with WordPress version 5.2.2 and didn’t experience any hiccups.

WP Image Borders provides many options like the type of border you want to use (for example, dotted, dash, solid, etc.), and border-radius (you can use rounded corners). In addition, you have the choice to blur your images or add drop shadows, etc.

Let’s see how it works.

I tried adding this plugin from the WordPress dashboard but it is not available there. However, you can download it from wordpress.org and upload the zipped file from your website dashboard.

When the plugin is installed, activate it and click settings

Image borders as the Default setting for All Posts

If you want to make image borders your default setting for all blog post images, mark the checkbox ‘Add borders to all images in blog posts’

Next, in the Additional CSS Classes field, add the code .border-image.

The next section helps customize the border according to your requirements by selecting the border style, width, radius, color

Save the changes and you are good to go.

Please note that once these changes are saved, the default settings will be applied to all blog images on the published and future posts.

Adding borders on specific Images

If you want to retain the freedom to select which image needs a border and which can do without it, you need to keep the ‘Add borders to all images in blog posts’ checkbox unchecked.
To add borders to an image, in the visual editor select the image and click the edit icon. The image details screen will open up.

On the Image details screen, enter Image Class CSS code and Update. Your border settings will be applied to the selected image.

I hope the above three methods will help you confidently tell people that you are not WordPress Image Borders challenged!

Happy WordPressing.