“We are a better company because of Robert…”

How to get Image Captions to work in Wordpress 2.6

By Robert Merrill • August 20, 2008 • Filed in: Links, etsy

Sweet. Wordpress’ new “image captions” feature is nice, allowing you to upload images and add captions to them right from withing the WYSIWYG editor.

But, you need to style them.

Thankfully, tenth blog already posted some cool CSS code to add to your theme’s stylesheet to make this happen:

Editing your blog theme:

  • Go to http://your_wordpress_blog.com/wp-admin/theme-editor.php
  • You’ll probably be editing the stylesheet file already. If you’re not, look for it in the right sidebar.
  • Scroll to the bottom of the file.
  • Cut-n-paste the below code into your stylesheet
  • Save!

The Code:

.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* optional rounded corners for browsers that support it */
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}

.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}

.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

 

Leave a Comment

« People with Third Graders are Old | Home | Mario Kart Fun »