Eddie Jones
asked 8 years ago

How can I make the images display the correct size when a post appears on the home page? Currently any image included with a post expands to fill the full post width when it’s rendered on the home page. On the post page the images are the correct size. 

For example, something as small as a Twitter logo fills the width of the post on the home page. But on the post page it’s only 10 pixels wide. For now, I’m having to remove all images in a post so the posts do not blow up the home page. 

3 Answers
DominicStaff
answered 8 years ago

Which theme are you using? you can send me your site for further checking. We will check and help you resolve it.

Eddie Jones
replied 8 years ago

DW Focus 1.3.0

http://lighthousepublishingofthecarolinas.com/

[email protected] Administrator — you did some work on the site a few months ago.

Eddie Jones
replied 8 years ago

If you hurry, you will see the problem. We posted a new post today that shows what happens when we include images in a post.

http://lighthousepublishingofthecarolinas.com/

DominicStaff
answered 8 years ago

I have checked your site and see that it\’s issue about configure of the widget, you can select 3 column in the widget. If you select 1 column the post will show full size. 

Eddie Jones
replied 8 years ago

That’s all fine and well except we do not wish to show three columns. We only want to show one post on the page, not three compacted posts. We used the 3 column feature in the past. Readers cannot read the post when it’s in a “silo” look.

Where in the code do I need to fix this? There muse be code somewhere that is overriding the image properties of a page post.

DominicStaff
answered 8 years ago

Yes,  I know what you want, if you want to change the image size, you can use the following code to change the image size. 
.dw_focus_widget_news_grid .row .col-sm-12 .post img {
width: ….px;
height: …px;
}
Note: It’s the  correct size of the widget when a post appears on the homepage. Just added the code to the style.css file.
Hope this helps!

Eddie Jones
replied 8 years ago

Sorry, that didn’t work. I added it to the custom style sheet. Custom CSS

Didn’t work.

Then I added it to dw-focus-1.3.0/style.css

That didn’t work, either.

Dominic Staff
replied 8 years ago

I have checked your site and see that you missed the number of the image size that you want to show in the post on the homepage. Please add the number in the width & height.
Example:

.dw_focus_widget_news_grid .row .col-sm-12 .post img {
width: 300px;
height: 300px;
}

Eddie Jones
replied 8 years ago

Thanks. You almost had it correct. This is the code that needs to be dropped in.

.dw_focus_widget_news_grid .row .col-sm-12 .post img {
width: auto;
height: auto;
}

Your code set all images to 300 by 300 and not all images in a post are that size. the ” auto ” part fixed it.

Thanks

Powered by DW Question & Answer Pro