jacksonj04

1 comment by jacksonj04 on Jun 29th, 2008 digg this super bookmark

I've had a couple of people ask how you do the cool images which stretch across the whole width of the content, as seen on news posts such as this one by the Infinity team (Used very well in that case). The answer is simple, providing that you understand at least the basic principles of HTML.

First of all, you need an image. It needs to be 620px wide, and we recommend no more than about 250px high or they become irritating, although any height will work. Sometimes smaller images have more effect or are more subtle, so bear that in mind.

Once that's done, you need hosting for the image. This can either be your own servers or you can head off and add it to your mod's image gallery. Either way you must know the URL for the full image, thumbnails will just look silly. If you're hosting your image on Mod DB you can get this URL by looking at an image in your gallery, then clicking "(view original)" by the title.

Finally, you need to enter HTML mode when you're editing your article and add a little bit of code to the bottom, replacing the src="" attribute with the URL, altering the alt="" attribute to be more descriptive, and tweaking height="" to actually be the correct height in pixels.

That's it. Note that your image won't appear perfectly in the editor -  don't panic about the gap around the left and bottom of your image, it won't appear on the final page.

So that's how you add the funky full-width images to your news posts. Told you it was easy.