Exact use of CSS Class to designate images with borders

  • Love the plugin! From a previous post, I can see that you can use the “Add specific CSS classes here” to apply the border to only certain images. However, I haven’t figured out the procedure. Can you help? I’ll be very specific:

    1 – I add a class to the “Add specific CSS classes here” box. I used
    “.border” without quote marks. Is that correct syntax for this box in the plugin?
    2 – Then, in the Image Editor within a page, I click on Edit Image. The Image Details window appears. Near the bottom, there is a box called “Image CSS Class”. I put in the exact same “.border” without quote marks into that box. No effect.

    So, what do I put in the “Add specific CSS classes here” box in the plugin and what do I put in the Image CSS Class box in the Image Details of the page/post.?

    Thanks so much for your help!

    https://www.ads-software.com/plugins/wp-image-borders/

Viewing 5 replies - 1 through 5 (of 5 total)

  • Dave-thanks for posting this excellent question. I have the same exact question. Have you received a response yet?

    Thread Starter daveparkhurst

    (@daveparkhurst)

    No unfortunately I have not. I’m looking for either another plugin or going to talk to a developer about this. For now, I have had to abandon my desire to do this. Sad, because in other web authoring systems I’ve used, this is pretty easy.

    Dave! I found a solution.

    Click on “Appearance”, “Editor” and below the “Please, you may put the CSS code here” copy and paste this and then “update file”:

    img {
    margin: 5px;
    padding: 1px;
    border: solid black 1px
    }

    Just change the numbers to customize it. For example: If you want the border further from the picture increase the padding to “padding: 5px” instead.

    This worked for all of my pictures!

    P.S. You won’t see the border within your editing page but you’ll see it when you visit your page.

    Hope it works for you, take care!

    Hi Dave,
    I’m a new user of WordPress but i think the proper way to use your class “.border” is to add class=”border” on your picture link…

    Example :
    <img src=”img/imgLink/blablabla.jpg” class=”border”/>

    I’m not sure about that because i didn’t try the plugin… Hope i help you…

    Zaiph

    ps: Sorry for my english =)

    Both css classes should have the same name. The “.” (dot) is the issue here.

    You have to use a dot in ‘options’ and not use a dot in the ‘image editor’ class.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Exact use of CSS Class to designate images with borders’ is closed to new replies.