CGSmartImage - Header Height
CGSmartImage - Header Height
Code from template: background: url("{CGSmartImage src="{content_image block='Page header image' dir='images/header' urlonly='1'}" filter_croptofit='1920,900' notag=1}") no-repeat top;
I have tried to alter both the aspect ration (changed only 900 height) and also the overall size of image (changed both 1920 and 900).
I use the same templates and CSS on a number of sites, the one I am trying to change first is http://www.simonmetzwoodworking.com
I attached screenshot of the CMSMS template and the extension settings page
Thanks!
Simon
Re: CGSmartImage - Header Height
The image is being used as a background that covers whatever height the header is so changing the actual image size won't affect the appearance.
Inspecting the site in dev tools it looks to me as if the size of the header is mostly controlled by the amount of padding it has at the top and bottom.
Have a look in the "Template1200-style" stylesheet and see if you can find references like:
.content_back {padding:150px 0;}
There'll be a few of them contained in different media queries because the height will change over different screensizes.
If you increase the amount of padding then the height of the header will also increase. You might need to play around with it a bit to get it looking right (you can edit the stylesheet directly in your browser Developer Tools to get an idea without breaking anything).
Hope that helps and Happy New Year.....
Inspecting the site in dev tools it looks to me as if the size of the header is mostly controlled by the amount of padding it has at the top and bottom.
Have a look in the "Template1200-style" stylesheet and see if you can find references like:
.content_back {padding:150px 0;}
There'll be a few of them contained in different media queries because the height will change over different screensizes.
If you increase the amount of padding then the height of the header will also increase. You might need to play around with it a bit to get it looking right (you can edit the stylesheet directly in your browser Developer Tools to get an idea without breaking anything).
Hope that helps and Happy New Year.....
Re: CGSmartImage - Header Height
Thanks, worked perfectly!