• Skip to main content

Beyond Blog Design

Do More Than Just Blog

  • HOME
  • BLOG
  • DESIGN
    • Free WordPress Consultation
    • TECH HELP
      • Plugin Check Up
      • WordPress Coaching
  • Social Media
  • About Us
  • Ask Us
  • Portfolio

How to Center a Widget

April 2, 2015 By Jen Kehl

how to center a widget

You know what I’m talking about, you have all of these great badges from all of the places you’ve contributed, you stick them in your sidebar and they are all jiggety.

You want to show off your accolades, but you want to look professional, right?

Well give me a few minutes and I’ll show you just what you need to do to get all your ducks in a row. Or a column – you know what I mean.

Chances are, when one of your very pleased editors hands you a badge and says, “Here! Proudly display this on your blog!” she’s going to email you a bunch of code, and you’re going to have to decide what to do with it.

Let’s start from the beginning.

You got your post featured on Scary Mommy! Yea! Now you want the world to know all about it. But what do you do with this little chunk?of code?

<img style=”border: none;” src=”http://www.scarymommy.com/wp-content/uploads/2013/02/scary-mommy-button.jpg” alt=”Scary Mommy” />

The first thing you do is put it in a “text widget” in your sidebar or footer.

Text widget? But it’s an image! Yup, it’s an image after the text you put in the box goes and tell’s the image you want it. What you actually have, is a link to an image. And a link, is text.

Tada! You’re done!

Not quite!

Hmmm….

My happy “look where I got published badge” is kind of wonky! All of my other badges are in the middle of the widget, but this one is all the way to the right!

Let’s fix it!

Here?is a simple bit of HTML that will fix your badge?right up. You’re going to?create a div. (don’t worry if you don’t know what that means! Someday if you want to, take a class at Skillcrush and learn all about it!)

The important thing to know is if you start a “div” you have to end a “div.” It looks like this:

<div align=”center”>Here’s my really cool badge</div>

So take your code from up there ^ and wrap it in a div!

 

how to center a widget

 

Now you know how to center a widget!

Don’t be afraid of that code either! Maybe you have something else that needs centering? Give it a try! If it doesn’t work, all you have to do is delete it!

And please! Never hesitate to ask me a question, I do this because I love it, and I love helping my fellow bloggers!

Now go forth and center!

 

Share this:

  • Click to share on Twitter (Opens in new window)
  • Click to share on Facebook (Opens in new window)

Related

Filed Under: Tips and Hacks, WordPress Tagged With: Blogging, Tips, widgets, WordPress

 

Loading Comments...