On Sale Now for a limited time! Gluten Free Grain Free Breads, Batters & Doughs If you are gluten free or grain free, this book is for you! Breads, Batters & Doughs teaches you how to cook using alternative flours and offers a collection of incredible recipes! Use coupon code healthy2014 at checkout...

3 Easy Steps To Add A White Border to Images In WordPress | WholeLifestyleNutrition.com

How To Make Your Pictures Pop On Your Blog 


Hey bloggers!  Just a quick video to show you how to add a white border to images in WordPress.

Why would you want to do this?  Several reasons:

  • If you do not have a white background on your website, this will clean up your images harsh borders.
  • Adding a white border to your images really makes them “pop”!
  • It looks better!

So with that being said, here is a quick how to video that show you how to add a white border to images in WordPress.

3 Easy Steps To Add A White Border To Images In WordPress


1. Backing Up Your Site


Here are the written instructions to completing this task.  We have to add some css to your theme (which is super easy).  You will only need to do this step once and then you will only have to add the css to the images.

When you are doing anything with your theme, always make a back up of your site before you do anything to your theme!

I like to use ManageWP to manage and backup websites.  It is super easy to use and is user friendly!

2. Adding CSS to Your Images


As I mentioned in the video you will need to add this in your CSS class to create a white border around your images.  Just paste this into your html right behind your image (see video).


3. Adding CSS to Your Theme


Now that you have added the css class, you will need to add the styles to your theme. This can be accomplished 3 ways depending on your theme & workflow:

  1. Add the css below to your child theme or your parent theme.
  2. Add the css below to the custom css area of your theme
  3. Install the free plugin: Jetpack. Under the Jetpack menu in your WordPress dashboard click on Jetpack and active the Custom CSS module.  Then go to Appearance –> Edit Css and paste the code below there.


Questions?  Mike From Tuna Traffic Is Here To Help!


We know you might have questions.  If you do, please comment below and Mike from Tuna Traffic would be happy to help!



PAID ENDORSEMENT DISCLOSURE: In order for me to support my blogging activities, I may receive monetary compensation or other types of remuneration for my endorsement, recommendation, testimonial and/or link to any products or services from this blog. Your support keeps this blog running and is greatly appreciated. AMAZON DISCLOSURE: The owner of this website is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon properties including, but not limited to, amazon.com, endless.com, myhabit.com, smallparts.com, or amazonwireless.com. DISCLAIMER: The content on the blog Whole Lifestyle Nutrition is for educational and informational purposes only, and is not intended as medical advice. I am not a medical professional and the information contained on this blog should not be used to diagnose, treat or prevent any disease or health illness. Please consult with a qualified health care professional before acting on any information presented here.

Join the Conversation

2 thoughts on “3 Easy Steps To Add A White Border To Images In WordPress”

  1. Marina One says:

    I believe what you published made a great deal of sense.
    But, think about this, suppose you composed a catchier post
    title? I am not suggesting your information is
    not solid, but what if you added something that makes people desire more?
    I mean 3 Easy Steps To Add A White Border To Images In WordPress – Whole
    Lifestyle Nutrition is a little plain. You ought to look at Yahoo’s front
    page and note how they write post titles to grab people to click.
    You might try adding a video or a related pic or two to grab
    people interested about what you’ve got to say.
    Just my opinion, it might bring your website a little

Add Comment Register

Write a Reply or Comment

Your email address will not be published. Required fields are marked *