How to put Borders around images with HTML

Before the Gutenberg Editor came, you could go to the old console or dashboard by typing in /wp-admin at the end of the URL for your WordPress.com blog and use the editor from there, to add a border around an image. Here are some images which may help you, which I’ve taken or copied directly from the following post on this blog.

https://wordpressguidelines.wordpress.com/2018/03/11/prevent-comments-made-on-images/

Figure 1
Figure 2

You can see from the first image, that without borders around it, it looks kinda lost. Some bloggers may have beaut image editing software that they can use to put borders around images before inserting or adding them to WordPress, but not everybody does!

So I have worked out how to tweak or amend the “code” or HTML behind an image, to add a Border – which if the WP ADMIN console disappears, you will have to use unless WordPress has the “adding border function” available via the blue Dashboard, or directly from a Post or Page itself using the editing tools there.

BEFORE resorting as a last measure, to the instructions mentioned below, please see if you can go to the WP ADMIN gray console / dashboard, then go to Posts in the banner or strip on the left, and from there, add a border to an image in your Post (same editing functions apply for a Page). Go to the linked Post in green above and scroll down until you find the part which starts with orange text – as shown in Figure 2 above.

I have put a border around the 2nd image in this post, but not around the first, manually, to show you the difference in appearances. Here is a link to information on this blog about putting borders around images, if you can’t access the WP-Admin console OR if WordPress removes it. In other words, if you have to resort to using HTML to add borders around images, the Page below will help you. It is Page 2 of the main page about the Gutenberg Editor.

https://wordpressguidelines.wordpress.com/the-new-editor-gutenberg-editor/2/