[TYPO3] Sub-Templates?

Ryan Off ryan at ryanoff.com
Thu Oct 26 02:21:39 CEST 2006


I am trying to get a different header image to appear on each of my  
pages. Previously, I apparently had this working, but I can not now.  
I have a working root template with my homepage working perfectly.  
Now, I created an extension template with one line in it:
--
page.includeCSS.file1 = fileadmin/templates/banners/banner-2.css
--

I then created a CSS file has the following code in it to change the  
banner:
---
.banner {
         background-image: url(http://ryanoff.com/fileadmin/templates/ 
urbanleaf/images/banner_02.jpg);
}
----

It looks like this should work, but the problem I am having is that  
it appears the browsers loads the banner-2.css first, then the  
original CSS, thus the original image is load on TOP of the new one.

Is there a way to change the behaviour of the template files to load  
the extension template on top of the original template (thus  
overlaying my new banner on the original one)?

Logically speaking, my understanding of extension templates is that  
they get loaded second and thus take precendence over the original  
template. This way I would expect to keep the original template, then  
have my extension template loaded on top of the original one..

Any thoughts??

Ryan Off




On 23 Jul 2006, at 12:59, Amir M. wrote:

> Ryan Off wrote:
>> Erik,
>>
>> I like your method and gave it a shot on my site. Super simple.   
>> Worked
>> great. Here is what I did.
>>
>> On my original HTML File, shown below, I set the banner using the
>> background-image property in my CSS file for the "header" class.   
>> Thus,
>> as you showed, to change it, I created a new very simple CSS  file
>> setting the new background-image to my new banner.. Below are  the  
>> files
>> I used/created.
>>
>> Here is an example of my original HTML File used on all my pages :
>> template.html
>>
>> <html>
>>   <head>
>>   </head>
>>   <body>
>>    <!--###DOCUMENT### begin -->
>>    <div class="header">
>>      <div class="mmenu">###MMENU###</div>
>>    </div>
>>    <div class="middle">
>>      <div class="submenu">###SUBMENU</div>
>>      <div class="content">###CONTENT</div>
>>    </div>
>>    <div class="footer>###FOOTER###</div>
>>    <!--###DOCUMENT### end -->
>>   </body>
>> </html>
>>
>>
>> -------------
>> new CSS File with Changed Banner Image : banner-2.css
>>
>> .header { background-image:url(banner-2.jpg); }
>>
>> -----
>> Typoscript in SETUP field of new Extension Template of the page I   
>> want
>> a new header on
>>
>> page.includeCSS.file1 = fileadmin/templates/banners/banner-2.css
>>
>> ----
>>
>> I created an image called banner-2jpg and put it in the same folder
>> banner-2.css file..
>>
>> Super simple. One line in an extension template, one line in a  
>> new  CSS
>> file, putting things in the right place and...
>>
>> Voilà... it worked perfect!!!
>>
>> Thanks again Erik..
>>
>> Amir.. Does this method make sense and work for you?
>>
>> Ryan
>>
>
>
> Hmm, yes that does look very simple, now that you explain it a bit
> differently.  I will try it - it seems like the ideal solution if you
> want to make multiple changes quickly between each site, and make them
> look more different.  For now though all I want is a different banner.
>
> Good job with getting it to work too, and thanks everyone again.
> _______________________________________________
> TYPO3-english mailing list
> TYPO3-english at lists.netfielders.de
> http://lists.netfielders.de/cgi-bin/mailman/listinfo/typo3-english
>




More information about the TYPO3-english mailing list