Content width value

[JamesAM]

There is a line in functions.php that is causing me a little grief:

* Sets up the content width value based on the theme's design and stylesheet. */ if ( ! isset( $content_width ) ) $content_width = 623;

The issue arises when I have set custom image sizes, eg. "Large Letterbox Size" 2048px x 800px.

When I go to insert the image into the post in the usual way, I get the option to insert my "Large Letterbox Size" and it does insert the image at the correct WP generated size.

But it 'resizes' the display of it by inserting sizes in the html, e.g.

<img src="http://***/Matrix-with-plant-slider-image-2048x800.jpg" alt="Matrix with plant slider image" width="623" height="243" class="alignright size-large-letterbox wp-image-923" />

If I comment out that content width line that solves my problem, so I guess my question is, what's the appropriate way to handle that line?

Should it be having the effect it is having, do I override it somehow in my child theme's functions.php, how do I work out what value my content width should be?

Thanks, as ever.

[tsquez]

Hi James,

I think you should read the following: http://codex.wordpress.org/Content_Width and this one should be very helpful as well: https://developer.wordpress.com/themes/content-width/

The appropriate way to handle that line is to override it in your child themes function.php. Remember, always use a child theme for any and all changes.

I believe it all depends on what the width of your child theme you set in the customizer or via css. I would suggest you use dev tools and check the width of the of the #content div. This will give you the width and allow you to add it via the child theme.

I also suggest that you check the width for any full width pages you may have.

Incidentally, the value for the new version of WP-Forge (coming soon to WordPress,org) is 683 :wink:

[tsquez]

Going to close this as I have not heard anything back on whether or not this helped you.

[JamesAM]

Hi Thomas,

Sorry for not getting back. Got a million things going on. The references you provided were very insightful. Thanks.

But I'm still not sure what to do in this circumstance because my content width is not set in pixels; it's a percentage.

My .content_wrap is max-width: 85%

The function won't take a percentage.

So given this, I particularly liked this post: https://wycks.wordpress.com/2013/02/14/why-the-content_width-wordpress-global-kinda-sucks/

So do I just have to think that if I build for a max monitor resolution of, say, 2048 px wide, then my content_width would be 85% of that - 1740px ?

Or can we be smarter?

[tsquez]

You can be as smart as you want to be or think you are amigo, its all really up to you. If you want to take out the content width global, take it out. I mean seriously the only reason it is there is because WP-Forge was built from Twenty Twelve and that is what was in the functions.php. Its also there because as stated in the post you linked to it is required by wp.org.

Honestly I have never used it or even cared about it so again ultimately it falls back to you and how you want to work around it. Personally if I was designing a site, I wouldn't use percentage anywhere because you cannot ensure the theme will look good across all sizes. You just can't. I mean sure you can look at those sites that offer to show you what your site will look like at different screen resolutions.

But unless you have every single sized platform physically in front of you, you can't do it, you can give it the 'ol college try but in the end you need to set a point and say I can't go any farther :wink: