Image background

[HoddzDJ]

In the default theme for Wordpress, when you insert an image into a post there is a background/border for it all and also the caption. I'm trying to get this in the Suffusion theme but can't seem to find where I need to add the CSS!! It also shows up when you write up the blog entry in the admin panel!

It would be nice to get the size of the font down a touch, still in italics but add a grey background to it as it shows in the WYSIWYG editor! Any help would be greatly appreciated!

[drake]

If you add a caption to the image in the media library you will see the same border/background and caption too in Suffusion like in default theme... If the image don't have a caption defined I believe that you not see neither in default theme a border/background just because those are part of wp-caption class, or this class isn't added to images without caption. If you wish to add a border/background to images without caption you can add your own styles at Suffusion Options -> Backend -> Custom Includes -> Custom Styles. For start you can play with this code:

Code: Select all

#content img {
display: block;
margin-left: auto;
margin-right: auto;
padding:8px;
border:solid;
border-color: #dddddd #aaaaaa #aaaaaa #dddddd;
border-width: 1px 2px 2px 1px;
background-color:#fff;
}

For styling fonts is an entire section for that at Suffusion Option -> Typography.

[HoddzDJ]

http://hoddzdj.pukkaradio.net I have added a caption to pretty much all of my images and there is no background at all but I will take a look and see what happens, cheers drake!

[HoddzDJ]

I added that code and it doesn't display it like the default theme which is a real shame. There doesn't seem to be any background at all for all of my images even where there is a caption, you can see what is displayed by pointing your browser to http://hoddzdj.pukkaradio.net.

I'd like to add a background and also change the font size of the caption so that it adds clarity that it is not part of the main article for reading, more just a picture that is related to the article to add a bit of colour.

[sayontan]

HoddzDJ,
As Drake mentioned, his code is for situations where you have no captions. If you have captions, then as he said, the "wp-caption" settings kick in. You can use something like this:

Code: Select all

.entry wp-caption {
   border: 1px solid #ccc;
   background: #eee;
   font-size: 11px;
}

[HoddzDJ]

HoddzDJ,
As Drake mentioned, his code is for situations where you have no captions. If you have captions, then as he said, the "wp-caption" settings kick in. You can use something like this:

Code: Select all

.entry wp-caption {
   border: 1px solid #ccc;
   background: #eee;
   font-size: 11px;
}

I have added that code to the Suffusion Options in the Back-End Custom Includes and nothing changes at all. Not sure if that is the correct place to put it, or if it is a code I need to modify/add elsewhere?

[sayontan]

Sorry, it should be ".entry .wp-caption", not ".entry wp-caption".

[HoddzDJ]

Sorry, it should be ".entry .wp-caption", not ".entry wp-caption".

Awesome! That done the trick. Thanks sayontan, very appreciated!