Assign a different header image per page

[burga3]

Hi Guys, I'm new here. I'm trying to build a website that uses different header image per page. I dont know how to do that and I dont want to create a template for every page. Can you guys help. I think perhaps using custom content blocks, but again am in the dark.

Please help

[Dr.CSS]

Do you want to change every pages header image or just some of them or different ones per section..?

[velden]

Have a look at the {content_image} tag which exists by default.

You have to point it to a directory and the editor will see an dropdown list where it can choose an image (unfortunately just bij filename, no preview).

[Rolf]

Look into this example template
http://docs.cmsmadesimple.org/layout/ex ... e-template

[Recon]

{if $page_alias eq "ur-pagealias-name"}
Img tags
{else}
Img tag
{/if}


Or upload images with pagealias name and call them like
<img src"{uploads_url}/{$page_alias}.jpg"/>

[burga3]

Well, it is going to be separate image for separate page,

Like this:
About us - image "aboutus.jpg"
Services - image "services.jpg" etc...

I want them to share same template tho.
Is that possible?

[Dr.CSS]

Many ways to do it depending on how much control you want to give the editors...

In template...

<div id='header'>
<img src='uploads/images/headers/{$page_alias}.jpg alt='{$page_alias}' />
</div>

using CSS...
<div id='header' class='{$page_alias}'>
</div>

.about-us {background: url(uploads/images/headers/someimage.jpg) no-repeat left top;}
.services {background: url(uploads/images/headers/some0therimage.jpg) no-repeat left top;}

Per page WYSIWYG image picker with default image...

{content block='headimage' label='Header Image only NO text' assign='headimg'}
<div id='header'>
{if !empty($headimg)}
{$headimg}
{else}
<img src='uploads/images/headers/defaultImage.jpg alt='defaultText' />
{/if}
</div>

[burga3]

Thank you so much.

[Rolf]

I described 4 possible methods at my blog: https://www.cmscanbesimple.org/blog/ass ... e-per-page

Hope this helps, Rolf