• Welcome!
  • Contact
    • Facebook
    • Instagram
    • Pinterest
    • Twitter
    • YouTube

Whole Lifestyle Nutrition

Organic Recipes & Holistic Recipes

  • About
  • My Books
    • Natural Solutions for Cleaning and Wellness
    • Gluten Free & Grain Free Breads, Batters, & Doughs
  • Recipes
    • Recipes
    • Meal Plans
  • Lifestyle
    • Limitless Freedom Method
    • Health & Lifestyle
      • Challenges
        • 28-Day Healing Challenge
        • 30-Day Dumbbell Challenge
    • Natural Solutions
      • Health Remedies
      • Home Remedies
      • Natural Solutions Resource Page
  • Women’s Startup Academy

Food Photography & Blogging Tips Health & Lifestyle

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

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).

class="img-white-frame"

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.
.img-white-frame {
	padding: 10px;
	background: #FFF;
	box-shadow: 0px 0px 2px 2px #C8C8C8;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}class="img-white-frame"

 

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!

 


 


Halle Cottis/Whole Lifestyle Nutrition is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for us to earn fees by linking to Amazon.com and affiliated sites.

« I’m Guest Blogging At Ditch The Wheat ~ Holiday Fudge Recipe
Top 9 Signs You are Addicted To Food »

small head shotWelcome! I'm Halle Cottis.

I'm on a mission to liberate women who are not living true to themselves to walk into life being EXACTLY who they were meant to be. I believe that women should put themselves first. When you choose yourself today, amazing things can happen.  I'm glad you're here! ❤Learn More →

Women’s Startup Academy

Subscribe Today

Subscribe To The Limitless Freedom Method Newsletter

* indicates required

Grab Natural Solutions for Cleaning & Wellness!

natural-solutions-book-copy-2

Trending Posts

Naturally Set Boundaries By Being Yourself | WholeLifestyleNutrition.com

Principle #9 – How To Naturally Create Boundaries By Unapologetically Being Yourself

How To Create Harmony and Communicate Your Vision With Others

Principle #8 – How To Create Harmony And Communicate Your Vision With Others

To Create A Life Around What You Want

Principle #7 – How To Create A Life Around What You Want

Principle #6 – How To Ask For What You Want

How To Pinpoint What You Want | WholeLifestyleNutrition.com

Principle #5 – How To Pinpoint What You Want

  • Terms of Service
  • Privacy Policy
  • Disclaimer

Copyright © 2025 · Whole Lifestyle Nutrition

Copyright © 2025 · Whole Lifestyle Nutrition on Genesis Framework · WordPress · Log in