- This topic has 14 replies, 3 voices, and was last updated 7 years, 12 months ago by
Dee Broughton.
-
AuthorPosts
-
June 18, 2014 at 9:20 pm #1413
focuspress06
Every time I add a featured image to a post, a full screen-sized image is added at the top of the content. In other themes I can choose the size when uploading but I don’t see that option. Also, I’ve tried to add code like the lines below to manage the sizes in my functions.php file, but it doesn’t change anything. I haven’t had this issue in testing with other themes, so I’m not sure what else to try here. Maybe I’m entering the code wrong. (I’m VERY new at all of this, any basic explanation helps.) Here’s a sample- http://focuspressblog.com/2014/06/18/test-5/
set_post_thumbnail_size( 280, 140, true );
add_image_size( ‘post-thumb’, 500, 300, true );
}June 19, 2014 at 11:02 am #1426Tom
Lead DeveloperLead DeveloperHi there,
The easiest way to achieve this is by resizing the image yourself using the image editor: http://en.support.wordpress.com/images/image-editing/
You can also purchase our $3 Page Header addon which allows you to specify the height of the image super easily as well.
Hope this helps,
TomDocumentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 19, 2014 at 11:35 am #1429focuspress06
It’s not a matter of the image size. No matter how big or small the upload or attachment is, the post grabs it and makes it fill the screen. Here’s another one – http://focuspressblog.com/2014/06/19/image-size/ – as you can see, it’s a small image stretched to full width.
Also, it’s not part of the header, it’s the featured image function. Is there something I can add to the theme’s function code to limit the height and width? If so, what code would I add and where would it go? I don’t know if the problem is theme-related, I just haven’t had to deal with it on other themes.June 19, 2014 at 11:43 am #1430Tom
Lead DeveloperLead DeveloperAh – well the featured image is wanting the image to be 100% width for cosmetic purposes.
To avoid this, you can add this CSS:
.page-header-image img {width: auto;}
Tom
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 19, 2014 at 2:25 pm #1431focuspress06
It’s not an issue with the header image. As you can see here – http://focuspressblog.com/2014/06/19/test/ – the header image fits just fine. It’s the post-specific Featured Image (or Post Thumbnail) that doesn’t fit. What code do I enter to determine size for that and where do I put it?
(I tried to get help over at the WordPress support forums and their ever-so-helpful moderator shut down the topic and sent me back to you. Sorry about that.)
June 19, 2014 at 2:30 pm #1432Tom
Lead DeveloperLead DeveloperHi there,
Are you talking about this image? http://focuspressblog.com/wp-content/uploads/2014/06/Books-e1403201558386.jpg
If so, the code above I provided will stop the auto-sizing from happening and allow the image to remain at it’s original size.
Tom
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 19, 2014 at 2:35 pm #1433focuspress06
That image and every image I upload (other than the header), basically. Pardon my ignorance – where do I add that code? Thanks.
June 19, 2014 at 2:40 pm #1434Tom
Lead DeveloperLead DeveloperYou can use a plugin like this to add custom CSS: http://wordpress.org/plugins/simple-css/
Tom
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 19, 2014 at 2:44 pm #1435focuspress06
Excellent! Thanks, and sorry for the hassle.
June 19, 2014 at 2:59 pm #1442Tom
Lead DeveloperLead DeveloperNo worries ๐
Tom
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentAugust 15, 2014 at 8:55 am #13384Dee Broughton
This is related to the featured image size, as well. I’m having trouble with images that don’t resize to fit the first-post masonry-post, I think. When the excerpt is short and the image is longer AND the masonry puts the post first so that it’s in the wider shorter format, the image overhangs the box. IOW, it doesn’t resize the image to fit the box. I need it to resize, I think, because the post could be first at anytime, for example, in a search…
August 15, 2014 at 9:43 am #13401Tom
Lead DeveloperLead DeveloperHi Dee,
This CSS should fix that for you:
.inside-article:before, .inside-article:after { content: ""; display: table; } .inside-article:after { clear: both; } .inside-article { zoom: 1; /* For IE 6/7 (trigger hasLayout) */ }
Let me know ๐
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentAugust 15, 2014 at 9:51 am #13402Dee Broughton
Well, ok, then! I never would have figured that out on my own. Ever. Thank you! Do you want to tell me why it does it in the first place?
August 15, 2014 at 9:55 am #13403Tom
Lead DeveloperLead DeveloperFloating elements don’t respect their containers, so when you have a floating element that is taller than the other content in the container, it will overflow outside of the container.
To fix it, you need to apply something called a “clearfix”, which basically forces the container to notice the floating element.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentAugust 15, 2014 at 10:45 am #13430Dee Broughton
Great to know. Thanks!
-
AuthorPosts
- You must be logged in to reply to this topic.