Maximum displayed image width

Most themes have a specific width limit (measured in pixels) for images inserted in a post or a page. Obviously, that limit depends on the theme’s main column width (which varies greatly from theme to theme). If you exceed that width when you insert an image, the image may be cut off, or overlap the sidebar; in a few themes it may become distorted or even break the theme.
When you upload an image from your computer to your blog, and select the “Full size” option before inserting it, then the theme will automatically downsize the image. But again it’s better to upload images that don’t exceed the right width, because this will give you better quality on the post (images resized by WP lose some color and sharpness – see here).

There’s a wp FAQ titled “How big can my images be?” [*] that supposedly gives the proper maximum widths. But this outdated FAQ doesn’t include all themes, and the numbers it gives are often incorrect. In several cases the difference is small (but enough to produce a misaligned or slightly truncated image); that difference is probably due to overlooking an important detail: many themes automatically create a small margin or frame around images, so the largest image you can insert should actually be slightly narrower than the main column. In some other cases, the numbers are simply quite wrong (for reasons I can or I cannot understand). And in the case of flexible-width themes in general, the notion of a specific maximum width doesn’t really make sense.
[* Update: link removed – URL now redirects to other Support doc, FAQ apparently withdrawn.]

Then there’s also the number given in the uploader. The “Full size” option is supposed to limit an overlarge image to the maximum width the theme can accommodate. The width specified under that option is often different from the number given in the FAQ, but again often wrong (marginally or not).

double number = with/without the right sidebar; on main posts page, two main columns layout, 259/386

Supposedly Clean

370

370

370

Sweet Blossoms

304

305

305

Tarski

495

500

500

The Journalist v1.3

—

720

720

The Journalist v1.9

690

700

680

The Morning After

—

750

750

540 on index pages

Thirteen

470

477

477

Titan

—

497

497

Toni

500

500

500

Toolbox

—

640

See note 1 below table

Treba

420

420

406

Triton Lite

—

1024

620

960 if you’ve hidden the sidebar

Twenty-eight Thirteen

420

425

425

Twenty Eleven

—

584

585

Twenty Ten

—

640

640

Under the Influence

—

376

780

theme width is customizable, number refers to default version

Unsleepable

500

500

500

Vermilion Christmas

520

540

540

Vertigo

—

430

430

Vigilance

—

600

600

Vostok

—

520

520

White as Milk

395

400

390

WordPress Classic

800

1024

See note 1 below table

Wu Wei

—

460

460

zBench

—

630

633/472/950

triple number = sidebar(s) left or right / sidebars left and right / static pages with sidebar disabled

General notes

• The numbers refer to plain, no caption, images; for captioned images you must as a rule subtract 10, because in almost all themes captioned images automatically get a 5px-wide frame around them.

• Needless to say, the numbers refer to the free, unaltered by CSS, versions of wp.com themes.

• Where the real appropriate number differs from that specified by the uploader, you can
a) set that number as your “Large” option in Settings > Media and use that option; or
b) modify the image code (in the html editor) whenever you insert an overlarge image (correct the width number and delete the height command altogether); or
c) make sure you always upload images in the desired dimensions, so that they will be inserted without the uploader resizing them; if you don’t want your displayed images to link to larger size originals, this is the best solution, because it gives you better quality as well (as already mentioned at the beginning of the post).
d) If the discrepancy is only due to the margin introduced by the theme, you can cancel the margin: in the html editor, add style="margin:0;" to the image code (after the class element, with a space before and a space after); in the visual editor, click on image, click edit icon, click “Advanced Settings”, type 0 in the horizontal and vertical space fields. To me this option is an unnecessary complication – useful only if what you want is to have your images aligned flush left instead of slightly indented.

• The themes were are mostly examined using Safari; some themes may behave differently in other browsers. (Sorry, I’m not prepared to run such minute tests in all major browsers for almost 80 more than 160 themes!)

Notes on individual themes

1. Andreas 09, Fadtastic, Girl in Green, Rubric, Sandbox (all four), Shocking Blue Green, Silver is the New Black, Toolbox, WordPress Classic: flexible-width themes; in theory the images you insert can be as wide as you like; in practice you must consider that many readers don’t have wide high-resolution screens, so the “Full size” option of the uploader is a sensible limit.

2. Andreas 04 and Rounded are also flexible-width themes, but that includes their sidebars; so for most screens a safe limit is well below the one specified by the uploader.

3. Hemingway, Simpla: the main column changes width when zooming in or out (and, on top of that, Simpla differs from browser to browser), so no real limit can be given.

4. Duotone, Monotone: the size options of the inserting tool don’t work in these themes. The images you upload can be any width, but above 840px for landscape-shaped images and 560px for portrait-shaped or square images you no longer get the colored background of the theme along the sides of the image. If the image is less than but very close to that, then of course you’ll get two very narrow strips along the sides, so a sensible limit is 800px/520px. Also note that image alignment must be set to None.

5. Freshy: maximum width is as suggested in the table above, provided you avoid inserting an image at the very beginning of a post, because the post date is inside the main post area (hence the double suggestion in the FAQ; but the size of the date box increases when zooming in, so the FAQ number for that is not correct).

Not so much. Mostly I’ve been fighting with those tables. WP puts end paragraph symbols after my html comments; that messes up the validation and I believe it messes with the way Safari displays them. Though I just updated to S4 and it’s better. The editor for the sidebar doesn’t do that: code validates and table looks fine.

I just wanted to get that stuff off my main blog, where it was becoming unmanageable. So mostly, I’m avoiding the topic by putzing around with technicalities.

Re: the move
It’s not as if I want thousands of readers; it’s hidden from search engines. It’s been linked in my sidebar for weeks (a month?) but no one visited until I asked about the table in the forum! I already knew that would be the case since I don’t get many hits to the pages linked in the sidebar (sometimes readers click on blogroll links, though). Anyway, if the blog wasn’t minimally public I’d eliminate it and forget about the whole problem. Understand that it would be easy to forget.

Hi Panos,
This is totally off topic but I found a response by you in the WP forum that almost answered a question I have about aligning two images side by side in a post. You gave the following answer code to the questioner:

IMAGE1_CODE_HEREIMAGE2_CODE_HERE
CAPTION_HERE

Is there any way you can change the code so that I could put text under each individual image instead of the two images combined?

I had no other way to reach you than post here. Thanks in advance for your help.
Peter

• The code cannot show up, because comments are almost like posts: if you paste code, you get the result the code is meant to produce, not the code itself.

• If you want two captioned images side by side, you need no code: you just write the text in their caption box and set their alignment to left. You’ll only need some code if you want the pair of images to be centered, so let me know exactly how you want them to be. Best give me a link to your post too, or at least tell me which theme you’re using, as there are a couple of quirky themes in which some standard codes won’t work.

If you want more space between the two images, you must first downsize them cause there’s no room for that now. And if you want paragraphs of text below each image, things get complicated, because you must design the table code in a way that will constrain the text to the width of each image. Since I cannot use your theme, I cannot work out a precise solution for you along the lines of the previous one, so I suggest you try two-column content instead – see here:

Hi! Thank you for creating this resource! The info in the FAQs are completely outdated, so it’s great to see someone taking charge and making a page on their own. I still have a few questions, if you don’t mind.

If there is a difference between the value in the “Uploader says” and the “Must be” column, does that mean that the particular theme adds some sort of padding/border/margin to the image? For example, in Contempt, the “Uploader says” reads 450, but the “Must be” reads “438.” Does that mean that the theme adds a padding/border/margin totaling 12 pixels to the left and right of the image by default?

I notice that iNove allows images up to 600 px. This limit looks to be a result of the side bar. Without the sidebar, there’s a lot more space! I’m wondering how wide an image can be if the sidebar is disabled.

Finally, may I make a formatting suggestion for your chart? For the places that say “See notes,” I recommend adding a superscript(s) that links to the corresponding note(s) below the chart, kind of like what some Wikipedia articles use when citing sources (look here for a random example if you don’t know what I mean). That way, a lot less up-and-down scrolling will be needed. :)

Re your first question: Yes (I mention that in the post); in cases where the difference is small, as in your 450/438) example, it’s usually due to the fact that the theme automatically produces margins and/or frames around images, and the uploader doesn’t take that into account.

Re you second one: I’m not sure what you have in mind when you say “disabling” the sidebar. In a free wp.com you cannot do that – you can only make the sidebar completely empty, but the main/posts column will still have the same width; you can only change that with the paid CSS upgrade. Without that, you can take advantage of an empty sidebar as extra room for wide images if the theme has no border between main column and sidebar. But you also have the flexible-width themes, which can accommodate very wide images, plus of course the option of inserting downsized images that link to the larger originals.

Re your suggestion (I know what you mean: it’s called anchor links): Hadn’t thought of it – good idea – thanks – will do it!

Panos-iNove lets you hide the sidebar on Pages, so while the content container stays the same width with or without the sidebar, on Pages, the contents cover the entire width. (Updated: EXCEPT THE PHOTOS, which behave as though the sidebar is still there!)

But there’s also something else funny (read: bug) going on with iNove. After uploading a full-size horizontal image (2288×1712) to a test post, the choices, besides thumb and medium, were for Large at 1024×766 and Full at 901×674. Unfortunately, WordPress.com doesn’t actually resize the horizontal image proportionally (its distorted) nor if I link the image to an attachment page, was there a further link to open the image at the full, uploaded size.

@Jennifer: Ah, that’s what Allen had in mind! Thanks, didn’t remember iNove has that option.

Re the bug (did you or will you report it?): The images remain at 600 no matter what – you cannot override that the way you can in other themes (write desired width, delete height). What’s more funny is that the sidebar space is available: if you set the image to align center or right, it will happily move into the ex-sidebar area.

• Andreas 09, Fadtastic, Girl in Green, Rubric, Sandbox 0.6.1, Sandbox 1.1, Sandbox 1.6.1, Shocking Blue Green, Silver is the New Black, WordPress Classic: flexible-width themes; in theory the images you insert can be as wide as you like; in practice you must consider that many readers don’t have wide high-resolution screens, so the “Full size” option of the uploader is a sensible limit.

There was a question in the forum just now (“auto adjust image to window” usung Andreas 09), and this may be a different issue, but with a flexible width theme, do you think using % is more useful than the # of px?

Amazing! I hadn’t ever thought of that, and now that you asked I doubted it would work, but I tried it and it does – even in IE! You delete the height declaration from the image code, write width=”100%”, and the image will happily adjust to window resizing. Of course you have to upload a very large image, to avoid pixellation.

@Jennifer: Ah, that’s what Allen had in mind! Thanks, didn’t remember iNove has that option.

Re the bug (did you or will you report it?): The images remain at 600 no matter what – you cannot override that the way you can in other themes (write desired width, delete height). What’s more funny is that the sidebar space is available: if you set the image to align center or right, it will happily move into the ex-sidebar area.”

Does this mean that the CSS upgrade is worthless for wider photos in iNove?

Or, better, add this command (so that it will apply only if you deactivate the sidebar):

.one-column .post .content img {
max-width:906px;
}

Since the CSS of the theme includes a bunch of settings for “one-column” (= hidden sidebar), then the omission of the above is definitely an oversight. When Support opens again, I’ll let them know – they’ll probably correct it.

@David: For the record, I did send the suggestion soon after posting the above comment; strangely, no fix and no reply yet. (Very strangely, because I’ve done this several times, and in all other cases I got a reply after one day.)

Maybe they’re swamped with tickets from the holiday break. Or, they might be waiting for approval from a committee. I’m in agreement with you. It appears to be an oversight. Why would they increase the content width, but not the image width?

That’s not the case, I’m afraid, because I sent them two tickets that evening. The second one was about an oversight in the new Duotone theme: they promptly fixed that one, and sent me a thank-you note the next day.

I am going really mad with faded images in my blog. I have been reading all forums, tried every tip found, and prayed all gods. Truth is that the way pictures show up in wordpress seems to me a total RANDOM issue, not necessarily dependent on images size and resize.
I have this old post where images are: (starting from the top) this first 428, 432, 429, 427, 432, 431…. Now, why I was so messy with my pictures at that time I don’t know, but the point here is that these “messy” pictures ALL look exactly the same as my originals.
Pictures from all posts of last months are faded.
In the very last weeks I have not been able to publish any post because of this problem, food looks really horrible when is washed-out.
You say that for DIGG3 480pxls is the right wisth, so I sized at 480 in photoshop, and also erased the size line… no changes, all faded.
Not secondarily, I cannot be 100% sure here, but I am almost sure that the images in these posts:http://breadandcherries.wordpress.com/2009/12/02/escarole-with-a-gourmet-surprise/http://breadandcherries.wordpress.com/2009/12/04/spinach-and-eggs-a-super-supply-of-iron-and-vitamins/http://breadandcherries.wordpress.com/2009/12/16/a-cooking-marathon-for-folks-and-friends/
WERE ALL PERFECT when I published them (sized in photoshop at 380 width). In the last week I go back and they all look faded!! When I published those posts I was already very aware of the faded images problem, so I was REALLLLYYY very careful to the process and the result…
This is very frustrating. Please, I see that you are fantastic and do a great job helping all of us struggling with wordpress, what am I doing wrong? There is anything that I could try? Settings for saving images in photoshop?

Sorry for writing such a long post… well put it this way length is directly proportional to my frustration :-|

In short: images resized by WP are rather heavily compressed, so they lose some detail; a) you get better quality if you upload and insert copies downsized to fit the theme you’re using; b) even better quality if you then delete the w & h commands from the code; c) the new complication is that WP has started adding a w indication to the code even when you expressly delete it (I’ve contacted staff on this, received a preliminary unsatisfactory reply, sent them all the details along with a link to a test post demonstrating the issue, waiting for further reply).

Now, you seem to be aware of a and b but not c. But you also seem somewhat confused as to what you should be doing and what you’ve actually been doing:

“I have this old post where images are: (starting from the top) this first 428, 432, 429, 427, 432, 431…. […] ALL look exactly the same as my originals.”

No they don’t: they’re duller. The widths you mention are what’s displayed in the post, not what you have uploaded; here are the first three of them:

First one is 504px wide, second one 1166, third one 709.

“You say that for DIGG3 480pxls is the right wisth, so I sized at 480 in photoshop”.

No I don’t, and no you didn’t!
– My table says 458, not 480 (480 is the number given in the wretched support doc).
– Your “uova-anatra.jpg” and your “scarola.jpg” are both 500px wide (so they couldn’t have been “perfect when you published them”), and they have been inserted at 468px.

As far as uploading and inserting is concerned, perhaps you’ve been misled by what the uploader calls the “Full size” option. This is limited to the (supposedly – often wrong) maximum for the theme; it coincides with the real size of the uploaded original when the latter is narrower than the allowed maximum; if it’s wider, then “full-size” is still downsized…

As for Photoshop, I can’t tell what might have made you think you have downsized the images when you haven’t.

Panos I am so sorry I just saw your reply.
I have been buried for the last two weeks. Thank you so much for your thorough explanation. I am a terrible user I know… I will go through your answer very carefully over this weekend and try to make a better use of the tools I am using…
Thank you so much again.

You’re welcome and no problem. And don’t think you’re a terrible user: handling images well is complicated – took me quite long to get used to and figure out some of this stuff… First thing you must clear up is how to really downsize copies of your images in Photoshop before uploading them. There are also easy-to-use online tools for resizing etc., such as this one:

you seem like you know more about this subject than anyone else and i was hoping you could help with my small problem since I stopped posting due to this issue!

chaos theory is currently chopping off my images. (you can see it on my 2nd post JUNEBUG). though in your chart above it says 510 for chaos theory, when i preview my blog with the themes SIMPLA or DEPO SQUARE, the whole width of the image is displayed! (even though according to your chart they both have lower capacity than chaos)

do i just have to change my image sizes from now on or change themes?

also on my last post the white image caption border looks like it malfunctioned :S

Re captioned images, see remark in red under “General notes” in this post.

Re “Junebug”, the images you have uploaded are 1024px wide, and you have inserted them at 612px (how and why, I don’t know), so of course they won’t fit.

So: for the theme you’re using, you need to downsize copies of your images to 500px wide in an image editing application, and upload those copies, selecting the “Full Size” option before inserting. (That way you also save storage space, and get better quality too – see here:https://wpbtips.wordpress.com/2010/01/16/image-quality/ )

Or it can be 500px for captioned images and 510px for non-captioned ones. In that case you must go to Settings>Media, set 500 as the default width for your “Large” option (typing 0 in the height box), and select that option when inserting captioned images.

hi panos thankyou for the help
ive fixed the captioning thing but im still struggling with the image sizing.

is there a way to post my large images without downsizing them first? (it sounds like too much hassle/time)

i changed my settings in media for 510 as default for large and one if the images in junebug now fits (its small which is lame but im guessing thats the only way) but now when you click on it, the big original size does not open in its own URL

“is there a way to post my large images without downsizing them first”

Yes of course. The images you upload (from computer to blog) can be as large as you like; what you insert in the post can be a thumbnail or otherwise downsized version of the uploaded file (created automatically by WP, according to the size option you select). It’s just that if you let WP do the downsizing a) you waste storage space b) image quality in the post suffers.

But all that applies as long as what you’re interested in is the quality of the image displayed in the post. If you prefer clickable images that link to the full-size original, then of course the quality of the downsized version displayed in the post doesn’t matter. (In that case I would add a note in the vein of “click to see full-sized image”.)

On another issue: Captioned images have a preset standard look (light-grey frame around the image) – regardless of the theme you’re using. In my opinion, this looks awful in Chaos Theory (or any black theme). If I were you, I would insert plain, not captioned, images, and I would add the caption as plain text below the images. Or I would design my own style for captioned images (via html coding). If you’re interested in that, let me know what color you’d like the frame to be, and I can work out the code for you.

I’m consfused here. On my 333everyday.wordpress.com (kubrick theme, css upgrade made possible) I insert images in full size, and change the size afterwards to 640 by 480. In the main page, everything looks fine, but if you open a single post, the image runs wide on the left side. Any advice how I can prevent this? It looks really bad.
Oh, and I set maximum width on the edit css page to 640.

@S.O.M.: As you can see in my table, maximum for Kubrick (as long as you haven’t changed it’s overall dimensions via CSS) is 450px. What you’ve tried to do is take advantage of the sidebar area as well. Unfortunately for you, Kubrick doesn’t display the sidebar on single posts, and it’s set so that the main post column on single posts gets centered instead of left aligned – hence the problem you’re having. There’s no solution to that, unless you can alter the CSS to make the main post column left aligned on single posts (I can’t help with that, as I’m not experienced in CSS editing).

My suggestion is switch to another theme. Your best option would probably be iNove: it’s got a no sidebar option (under Appearance > iNove Theme Options); in that case your images can be up to 896px wide if plain, 886 if captioned.

By the way 1: You needn’t “insert images in full size, and change the size afterwards”; you can go to Settings > Media, set the desired width in the width box for “Large”, and insert your images using that option.

By the way 2: Your images link to the real-size original when clicked. If that’s intentional, fine. If not, then you’re just wasting storage space by uploading 2048px wide images, plus the quality of the images displayed in the post suffers.

@Panos: thanks a lot for this. I’ve been trying to poke my way around the CSS a bit, but I’ve learned that poking around in CSS more often than not gets you in trouble in stead of getting you somewhere.
I will switch to iNove. It looks like the reasonable thing to do.

As for btw 2: you’re right. At first, it wasn’t intentional, but by the time I’d learned what I was doing wrong, I had uploaded so many pictures in original size that I figured what the heck. Since I just discovered you can update your media to refer to another image, I might look into that and reupload smaller versions.

Panos, thanks for this table of maximum image widths in WordPress themes. I like 3-column themes with two right sidebars, and had used a customization of the Radical Congruency 2005 theme for some years, before now using a customization of the Vita theme by Nurudin Jauhari. I’ve settled on a width of 475px , which doesn’t completely fill out the body in the 3-column theme, but tends to support portability if I change themes in the future.

My family seems to prefer a two-column look (and I encourage right sidebar), so while I’ve set medium image size maximum to 475px by 640px, I’m looking for a setting for the large size. I recognize some of the popular theme (e.g. Connections at 502px wide) and see relatively few themes over 600px. The WordPress default theme of Twenty Ten at width 640px is probably a message that going wider than that is going to require special attention to image management.

I noticed that when you click on the thumbnail image on my blog the large image is being cut off. I’ve recently made some changes to my css regarding my side bar (that you actually helped me with, thank you!) but I can’t figure out how to fix it. See here:

@denisesdish: Actually your comment is in the wrong place, because what you’ve done doesn’t have to do with image width: you’ve changed the width of the whole content of the so-called attachment pages (in case that’s not clear, see here: https://wpbtips.wordpress.com/2009/04/26/images-the-three-link-options/ ). But I can’t find the selector for that (as I’ve told you before, I’m no CSS expert). So you’ll have to ask at the CSS section of the forum: hallluke or devblog or thesacredpath will be able to tell you.

Happy to have come across this information. You are obviously “the man” when it comes to image sizing.
I have a couple of questions if you don’t mind…
I am testing out Fusion theme here:http://nagababas.wordpress.com/

All seems to be going well but I have not figured out how to size vertical images to match the horizontal ones. If I make them 958 wide (to match the column width and horizontal photos) they will be way too tall. Right now they are a bit narrower than the column.

Any suggestions?

Also, as you will notice, I imported my content from my “real” blog and evidentally the photos are not automatically resized. Do you recommend deleting all my photos and inserting new (larger) ones or is there another option? Thanks in advance!

That’s an aesthetic consideration, not a technical one, so obviously I don’t have an objective answer. In my opinion, full-width portrait-shaped images would look gross, and somewhat narrower looks wrong (when juxtaposed with full-width landscape-shaped images). I would probably try half the column width minus something, inserted in rows of two.

Re Q2:

The dimensions of the images you insert are part of the HTML of the post, and the HTML of a post doesn’t change when you switch themes, so images aren’t automatically resized when you switch (exception: some themes have an extra command in their CSS that overrides the specified dimensions if they exceed the column width). Inserting auto-resizable images is easy, but it creates more problems than it solves.

Whether you need to delete and re-upload your images or not depends on the width of the originals you have uploaded: when it’s larger than the new column width, you can switch the editor to HTML and change the dimensions (to avoid calculating new ratios, you increase the width only and delete the height commands altogether); when the width of the original is smaller, you can’t do that, as it would result in poor quality, so you have to re-upload wider versions.

So far I replied keeping in mind your apparent preference for full-width images on your front page. Problem is, I don’t agree with this! Subjective opinion: at that column width, to me it feels as if you’re trying to shove your photos in my face. Less subjective: too much scrolling, no sense of structure, loading issues for visitors with a slow connection.

Personally, I would use a sidebar instead of a bottombar, and I would make each post display either a) a complete set of clickable thumbnails (regular or gallery), or b) one thumbnail on the front page, with a read-more tag and an explicit note inviting visitors to click for more large-size photos.

What you saw as my (test) front page will soon be the blog page. The Home page will be static as will the galleries so I will play around with the layout of those pages as I start working on them.

As far as using large images, everyone will differ as to their preference but the trend right now in photography websites and blogs is definitely for big and bigger images! I don’t know if you are familiar with The Boston Globe’s blog…it’s a good example of what I am going for:http://www.boston.com/bigpicture/

Click on one of the posts for “more pictures” and you will see it’s pretty much the same layout as I have.

You have a good point about loading issues. I am guessing that what I am trying to do will still be faster to load than all the “big picture” flash sites everyone is doing with companies such as Neon Sky.

Ah yes, static front page is a different story altogether. What I didn’t like in your test blog is the long series of posts with a series of large images in each.

Boston Globe: very good. There’s only one image per post on the front page, so you can move to the next post without much scrolling, and the layout (divider lines, indented text, image border etc.) is more appealing than the plain white of Fusion.

Yes, very nice! If they select it I am sure there would be some who would enjoy it. Then there will be others who won’t…I got this message (below) on a post about widgets…we weren’t even discussing Themes!

@Cathy,
I have seen the theme you suggested that’s a knock-off of the copyrighted Boston Globe’s Big Picture theme, and I honestly don’t consider it to be special in any way. Its a stripped naked theme that’s operating like a billboard. MEH … big deal. :D

Thanks for the link…very good info. I will check out the other options.

I started with Fusion because Mathias (?) suggested it when I commented on one of the new themes but I am interested in getting familiar with others. Believe it or not I may now be pretty ignorant but hope one day to help others with at least the basics on WordPress.

Yeah, I posted the quote only as an illustration that for every one who likes something there is someone who doesn’t!

Thanks panos, for this awesome list, and thanks too, to cathyscholl, for asking pretty much all the questions that have been buzzing in my head! Im a photoblogger too, relatively new, been on wp.com for about 6 months and considering the leap into custom css… i posted on the forum a little while ago and have just seen your answer there, thanks!

i’m beginning to realise that… was hoping that someone could send me in the right direction, or copy from another stylesheet, but so far havent found what i’m after. I’m going to keep at it though, play around with my test blog until i feel a bit more comfortable…

Thanks for pointing this out. The width in that case is 940 – I’ll add this piece of info to the post too.
(As for how I get my measurements: I use a test post with an image inserted twice, once with its width expressed in pixels and once with width:100%, and adjust the first till it becomes exactly equal to the second. Or sometimes I take a screenshot and measure the image in Photoshop.)

Panos, learn to use Firebug. View any web page, open Firebug, click its element inspector, click any image (or div, or other block element) in the web page and look in the Style > Computed or Style > Layout tabs for its actual size.

@ Skierpage: Thanks! You’re right, and I do use both Firebug and Web Developer, but in this particular case I prefer to work in the post editor because I need to check other things as well. For instance, I need to see what width the uploader suggests (often wrong, as my post shows), or whether the 100% image fits correctly (sometimes that’s wrong too).

Yes it does have a showcase template – see here:https://wpbtips.wordpress.com/2011/05/04/workings-of-duster/
Yes, if you put an image in the content of that page it can be larger than regular (up to 826px), but I think there’s no point putting large images there: the content of that page serves a purpose similar to the alert/notice box of some other themes.

In the forum thread you linked to, you’re talking about the sidebar template, not the showcase template.
I don’t know what you did in your test blog, but the showcase template is supposed to produce the complex page described in my post on 2011 – no matter if its the main page or a page in the menu. The solution for wider content on a no-sidebar page in 2011 is to enclose the whole content in a div with negative left and right margins.

Yes, I know, but I was trying to figure out if there is a way to make the google calendar full page in twenty eleven (their theme). I started using images because I know they are adjustable. Foolishly, I did not think of the negative margins… But it seems the shortcode for inserting the calendar can be modified to be longer or shorter, but not wider than what that theme allows for its content column.

In commet with full-width page template, the calendar can take up the full width.

I removed the code – doesn’t render correctly if you just paste it in a comment.

Created my own google calendar, got the embed code, experimented with it: can’t make the calendar wider than the default for the theme. I can do it for an image (by enclosing it in a div with the desired width and negative left/right margins), because the HTML editor contains the actual code for the image, but the same thing won’t work for the calendar: the HTML editor contains the shortcode only, and the shortcode is designed to translate into an iframe constrained to the ‘right’ width for the theme (no matter what the width in the shortcode says or what you enclose the shortcode in).

To kill a dead horse, I did email you a code to my own (made-up) calendar. I did use the html converter in your sidebar to post the code here from the source code of the OP—note: wp automatically changes the iframes to their own shortcode.

Yes: images within a div can be wider (Originally I hadn’t thought about negative margins).

Sorry to annoy you, but with the Comet theme, I could alter the wp shortcode for a calendar to make it wider, full page width. So there is some difference among the themes—but it’s of no interest for me at this point. And as I said, i apologize for rubbing you the wrong way!

Part of the email mess was that I f-ked up on the “request feedback” feature for my private test blog. I have used that in the past, but must have remembered to change the privacy feature before sending, or maybe I used it with a co-adminsitrator? Truly, I did not mean to impose.
≥^!^≤

The converter converts the code correctly, but then the comment system gets in the way: if it sees http, it turns whatever it can into a live link again (but the end result is wrong, since the converter has already changed other things). To avoid that if I need to display some code that includes a URL, I have to manually replace the colon after http with the corresponding HTML entity. Textsnip seems to be the only foolproof way to display code, and I’ll be eternally grateful to sanjida for introducing us to it.

As far as the calendar shortcode is concerned, there’s no difference between Comet and 2011 (I just checked it): whatever the width in the shortcode, the iframe you can see in the sourcecode won’t exceed the default max width of the page. The difference is that in most themes no-sidebar template means full-width, while in the moronic 2011 no-sidebar template means same width as sidebar template, just centered.

Hi,
You have helped me out before so I hope you can do so again. WordPress keeps resizing my images/and not allowing me to resize them how I want them. Is there a permanent fix to this? I am tired of asking them to fix it.
Thanks!

Hi. I have a question that’s a little off topic but I don’t know the proper place to ask so I’d give it a shot here. My question is image-related. Is it possible to post a colored image and when I hover over the image it becomes balck and white? I know my luck is stiff here coz that kind of effect will probably require some codes that wordpress doesn’t approve of. But I’d like to know your opinion.

@LAVITAPETITE:
a) Point to specific posts with the issue in question.
b) You mean you can’t resize them the way you want them when you first insert them, or that images already inserted in older posts changed size after the latest WP updates?

@AJ LUNA:
Your suspicion is almost correct. There are two ways you can do that: the one requires javascript (which we’re not allowed to use in wp.com blogs), the other requires the paid Custom Design upgrade.

Author

Recent Posts

Subject Index

Subject Index

Search for:

Announcement 22/03/2012:
After WP's latest move, this blog will no longer offer active support and assistance. The blog will remain online but commenting on older posts has been disabled.
✶ All theme-related posts are updated up to and including theme 189 in this list, but will not continue to be updated.

Stats

3,258,409 views

Views per month:

Note: if you see ads on this site, they are placed by WordPress, not me.

Mostly on themes, formatting, coding, tweaks and workarounds.
Based on or springing from my contributing in the wp.com forum.