View previous topic :: View next topic |
Author |
Message |
orao Smarty Rookie
Joined: 23 Dec 2009 Posts: 20
|
Posted: Thu Oct 06, 2011 3:19 pm Post subject: How to add CSS from included template to parent template? |
|
|
Hello,
simple example:
I have main template "index.tpl" in which I included more templates.
index.tpl looks like this:
Code: |
<html>
<head>
<!--here be css-->
</head>
<body>
{include file="main.tpl"}
{include file="right_slideshow.tpl"}
{include file="right_tabs.tpl"}
</body>
</html>
|
etc....
In "right_slideshow.tpl" and "right_tabs.tpl" I am using some javascript and css code that I would like to include in page <head> section.
I've been playing around with {block name="css"}... and template inheritance. It is very easy to change parent {block} areas and is really a great feature.
But sadly it does not work from included templates and it does not resolve my problem.
How can that be done? thanks |
|
Back to top |
|
orao Smarty Rookie
Joined: 23 Dec 2009 Posts: 20
|
Posted: Mon Oct 10, 2011 8:00 am Post subject: |
|
|
Please suggest something. I know it is a very basic question.
please |
|
Back to top |
|
mohrt Administrator
Joined: 16 Apr 2003 Posts: 7368 Location: Lincoln Nebraska, USA
|
Posted: Mon Oct 10, 2011 1:50 pm Post subject: |
|
|
template inheritance is the way to go, why not use it? it is not easy to manage content in the header template from the including template. |
|
Back to top |
|
douglassdavis Smarty Junkie
Joined: 21 Jan 2008 Posts: 541
|
Posted: Mon Oct 10, 2011 1:58 pm Post subject: |
|
|
orao wrote: | Please suggest something. I know it is a very basic question.
please |
It may not be that simple. The problem is that by the time you get to the right_slideshow.tpl template, <head> has already been output.
The way I do it is that the CMS I use composes the theme and page body separately using two separate smarty objects.
So, for example, first, one smarty object would get the page body from a template that included:
Code: |
{include file="main.tpl"}
{include file="right_slideshow.tpl"}
{include file="right_tabs.tpl"}
|
Within the page body template, two plugins, requireJS and requireCSS, can be used to add things to the <head>. One example of their use:
{requireCSS file='blah/blah/file.css'}
They store the items to be put in <HEAD> in a global variable, making sure to not add the same file twice.
Then the second smarty object would get the results of:
Code: |
<html>
<head>
...
</head>
<body>
{$page_content}
</body>
</html>
|
Where $page_content is the output from the first smarty object, and in <head> a foreach loop outputs all of the CSS and JS collected by requireCSS and requireJS plugins.
I'm not sure how inheritance is implemented though. If the child template is run before the parent template, the plugin idea could work still without the two smarty objects.
If any one has any more simple solutions, I welcome them, but, this one works very well for me. |
|
Back to top |
|
douglassdavis Smarty Junkie
Joined: 21 Jan 2008 Posts: 541
|
Posted: Mon Oct 10, 2011 2:00 pm Post subject: |
|
|
mohrt wrote: | template inheritance is the way to go, why not use it? it is not easy to manage content in the header template from the including template. |
The problem is, what's supposed to be in the header often depends on the body. So, it would make sense if the body template could add whatever is needed to display its content into the header. |
|
Back to top |
|
mohrt Administrator
Joined: 16 Apr 2003 Posts: 7368 Location: Lincoln Nebraska, USA
|
Posted: Mon Oct 10, 2011 2:04 pm Post subject: |
|
|
douglassdavis wrote: | mohrt wrote: | template inheritance is the way to go, why not use it? it is not easy to manage content in the header template from the including template. |
The problem is, what's supposed to be in the header often depends on the body. So, it would make sense if the body template could add whatever is needed to display its content into the header. |
... and that is exactly what template inheritance solves. |
|
Back to top |
|
douglassdavis Smarty Junkie
Joined: 21 Jan 2008 Posts: 541
|
Posted: Mon Oct 10, 2011 2:11 pm Post subject: |
|
|
mohrt wrote: | douglassdavis wrote: | mohrt wrote: | template inheritance is the way to go, why not use it? it is not easy to manage content in the header template from the including template. |
The problem is, what's supposed to be in the header often depends on the body. So, it would make sense if the body template could add whatever is needed to display its content into the header. |
... and that is exactly what template inheritance solves. |
Ok cool... I haven't made that jump to smarty 3 yet.
So... orao, please ignore my first post |
|
Back to top |
|
orao Smarty Rookie
Joined: 23 Dec 2009 Posts: 20
|
Posted: Mon Oct 10, 2011 2:40 pm Post subject: |
|
|
In my case I have more than 1 template included. And each one of them has the code that I would like to put to <head>.
All the included templates are on the same level, they're all 1st level children.
For example:
"right_slideshow.tpl" has JS code that should go to <head>
and
"right_tabs.tpl" has JS code that should go to <head>
The way I understand inheritance:
only one child template can extend parent template and that parent may extend its grandparent etc... That way the top parent always inherits its childrens {blocks}
So I guess it is not possible to have two or more templates extending one parent at once.
In my example "right_slideshow.tpl" an "right_tabs.tpl" should both extend "index.tpl"
It would be really nice to have CSS and JS code in the same file with HTML.
Please suggest me the best practice how to achieve this with smarty.
Thank you a lot
For better understanding:
In my case it is very difficult to identify which template is the last child to start the $tpl->fetch from
I build the whole html page that way (pretty complex):
- I have main template
- template has many areas defined(header, left side, center, right side,....)
- each area can have many actions and each action has template
For example in the right column at the bottom I want to display tabs with the most read and most commented news.
There I include that cursed template with JS and CSS code.
Can this be done with smarty or should I handle it elsewhere. (probably that would separate HTML from CSS and JS) |
|
Back to top |
|
U.Tews Administrator
Joined: 22 Nov 2006 Posts: 5068 Location: Hamburg / Germany
|
Posted: Mon Oct 10, 2011 4:06 pm Post subject: |
|
|
For one possible solution using template inheritance craete templates like this:
layout.tpl
Code: | <html>
<head>
{block name='head'}{/block}
</head>
<body>
{block name='body_main'}{block}
{block name='body_right_slideshow'}{block}
{block name='body_right_tabs'}{block}
</body>
</html> |
main.tpl
Code: | {block name='head' append}
<-- your css -->
{/block}
{block name='body_main'}
your content here
{/block}
|
right_slideshow.tpl
Code: | {block name='head' append}
<-- your css -->
{/block}
{block name='body_right_slideshow'}
your content here
{/block}
|
right_tabs.tpl
Code: | {block name='head' append}
<-- your css -->
{/block}
{block name='body_right_tabs'}
your content here
{/block}
|
Code: | $smarty->display('extends:layout.tpl|main.tpl|right_slideshow.tpl|right_tabs.tpl'); |
|
|
Back to top |
|
orao Smarty Rookie
Joined: 23 Dec 2009 Posts: 20
|
Posted: Mon Oct 10, 2011 4:48 pm Post subject: |
|
|
Thanks, that looks interesting. I will change my code and give it a try.
The only problem I see here is this child template can be in different blocks in different pages and even many times on the same page in different blocks.
Is it possible to define block with a variable? |
|
Back to top |
|
U.Tews Administrator
Joined: 22 Nov 2006 Posts: 5068 Location: Hamburg / Germany
|
Posted: Mon Oct 10, 2011 5:29 pm Post subject: |
|
|
Te,plate inheritance is a compile time process. For that reasion variable block name will not work.
Can you give an example as I'm not sure what you wnated to do?
You can use the same child block several times on a page like this.
layout.tpl
Code: | <html>
<head>
{block name='head'}{/block}
</head>
<body>
{block name='foo'}{block}
</body>
<footer>
{block name='foo'}{block}
</footer>
</html> |
|
|
Back to top |
|
orao Smarty Rookie
Joined: 23 Dec 2009 Posts: 20
|
Posted: Mon Oct 10, 2011 9:17 pm Post subject: |
|
|
Quote: | $smarty->display('extends:layout.tpl|main.tpl|right_slideshow.tpl|right_tabs.tpl'); |
This is actually the answer to my question I opened this topic for - thanks
I find it very hard to describe the real problem.
Code: | <html>
<head>
{block name='head'}{/block}
</head>
<body>
{block name='body_main'}{block}
{block name='right'}
{block name='body_right_slideshow'}{block}
{block name='body_right_tabs'}{block}
{/block}
</body>
</html> |
The real problem is that I'm getting those nested blocks "body_right_slideshow" & "body_right_tabs" dynamically from the database and I do not know how they will be called. And each of them can have its own <head> code.
Do you think it would be a good idea to compile those nested blocks separated and assign them as a variable? |
|
Back to top |
|
|