Portfolio Header image not full width - Support | Kriesi.at

Tagged: enfold, header, image, inconsistent, Portfolio, width

Viewing 10 posts - 1 through 10 (of 10 total)

Author

Posts
May 31, 2018 at 3:29 pm #964809

aheinermann
Participant

Hi,

we have a rather strange observation. In our portfolio pages all images have their width as configured. However the Header image that is defined as the portfolio items image is inserted with a rather lower width of 845px. For an example of the issue, please check
https://3hasen.de/portfolio-item/dinner-in-einem-flugzeug-hangar/

What do we need to do, to make the header images also the same width as the rest of the portofolio page?

For the record – the header images in question are all available in a higher resolution (up to 2000px width) on the server. It is simply that enfold choses to insert a lower resolution for some odd reason.

This topic was modified 6 years, 6 months ago by aheinermann.

May 31, 2018 at 9:16 pm #964948

Jordan Shannon

Inactive Moderator

Hey aheinermann,

Add this to quick css:

.page-thumb img.wp-post-image{
width:100%!important;
}

Best regards,
Jordan Shannon

June 9, 2018 at 10:50 am #970373

aheinermann

Participant

Hey Jordan,

I tried this but the result is not satisfactory. Now I have an image that has a pixel width of 845px bloated up to 1210px, which effectively makes the image blurry.

I would like to see a proper solution, that ensures that the actual image that is embedded is not too narrow. As said, for all other images on the portfolio pages this works. The header image should be responsive like all other images, using srcset and sizes.

Michael

June 11, 2018 at 7:40 pm #971355

Jordan Shannon

Inactive Moderator

Hi,

Have you attempted to use an image editor to increase the size of the actual image. This give it more pixel density to adjust to the various image sizes utilized in WP.

Best regards,
Jordan Shannon

June 11, 2018 at 8:30 pm #971378

aheinermann

Participant

Hi Jordan,

no need to try. :)
As I initially stated, the image is available in multiple resolutions up to 2000px width on the server. But I have no direct influence on how the header image is linked in by the theme.

As stated in my previous answer, if you look at the html of the page that I linked in my initial post you can also see that the image tag that is created for the header image simply lacking the attributes for responsiveness (i.e. srcset and the sizes). All other images on the page however employ the responsive features and are OK. For some odd reason (maybe a bug in the theme?) only the header image however gets embedded with a fixed width and without the attributes for it to become responsive.

Michael

June 13, 2018 at 5:46 am #972046

Ismael

Moderator

Hi,

Thanks for the update.

The default thumbnail is set to “entry_with_sidebar”. If you want to change it, edit the single-portfolio.php file. Look for this code around line 29.

$avia_config['size'] = avia_layout_class( 'main' , false) == 'entry_without_sidebar' ? '' : 'entry_with_sidebar';

Set it to “extra_large” or “full”.

Best regards,
Ismael

July 8, 2018 at 7:52 pm #982795

aheinermann

Participant

Hey Ismael,

thanks – setting that value to full gives me the expected behavior.
Is there any way for me to set this in a child-theme or another way that won’t require to redo this edit after each theme update?

bye,
Michael

July 8, 2018 at 8:46 pm #982830