When I use "Single post template 34" template the images don't cover the page

Posted in: Newspaper
Post count: 141

Hello,

I use Newspaper version 9.6 on my blog.

Wordpress Media Settings are:
Tumbnail size: 0 x 0
Medium size: 345 x 999
Large size: 696 x 999

I save all my images to 1280 pixels in full size.

I’m adding an image for my article that I’ve edited with the classic editor and I’m keeping it for full size impressions. I’m setting up a Single Post Template 34 template for this article. Although I set the full size (1280px), it appears to be 696 pixels on my page and it doesn’t fit exactly on the page. However, the images on the Single Post Template 34 demo page seem to be exactly what I want. The woman with the umbrella on the demo page looks fit. I want it to look like this.

I couldn’t find out where I was doing wrong or missing.
Can you help me?

Thanks in advance for your help.

  • This topic was modified 7 years by Demir.
Post count: 141

You can check from this sample page link.

Post count: 141

I’ve implemented the following code, but I still have the same problem:

Theme Panel > Custom Code > Custom CSS


@media
(min-width: 767px) {
.single .vc_column_container {
padding-left: 24px;
padding-right:24px;
}}

Post count: 35449

Hi,

Unfortunately I can not access your link -> https://www.screencast.com/t/Dqba2lO8D , please provide an working one.

Thank you!

Post count: 141

Hi Calin,

I have no problem with the link.
I think you’ve encountered a temporary problem.
Can you try again.

Post count: 35449

Hi,

Please try this custom css
-> https://www.screencast.com/t/0nvf3gKtdU
.post .td-post-content img {
width: 100%;
}

Thank you!

Post count: 141

Hi Calin,

When I applied the code you suggested, all the images in the text covered the screen in the same way as the text. But that wasn’t what I wanted. Because there are pictures in my writings that I do not want to cover the screen.

I solved this problem with the following method.

First, I added the following code to the “Theme panel > Custom Code > Custom CSS”:

.art-fit-to-area {
width: 100%! important;
}

Then, for pictures that I want to appear in full screen
I updated “Image CSS Class” by typing “art-fit-to-area”.

You can see the final version here.

Thank you for your help!

Viewing 7 posts - 1 through 7 (of 7 total)
The forum ‘Newspaper’ is closed to new topics and replies.