Smarty Forum Index Smarty
WARNING: All discussion is moving to https://reddit.com/r/smarty, please go there! This forum will be closing soon.

How to add CSS from included template to parent template?

 
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Smarty Forum Index -> Smarty 3
View previous topic :: View next topic  
Author Message
orao
Smarty Rookie


Joined: 23 Dec 2009
Posts: 20

PostPosted: Thu Oct 06, 2011 3:19 pm    Post subject: How to add CSS from included template to parent template? Reply with quote

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 Smile
Back to top
View user's profile Send private message
orao
Smarty Rookie


Joined: 23 Dec 2009
Posts: 20

PostPosted: Mon Oct 10, 2011 8:00 am    Post subject: Reply with quote

Please suggest something. I know it is a very basic question.
please Embarassed
Back to top
View user's profile Send private message
mohrt
Administrator


Joined: 16 Apr 2003
Posts: 7368
Location: Lincoln Nebraska, USA

PostPosted: Mon Oct 10, 2011 1:50 pm    Post subject: Reply with quote

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
View user's profile Send private message Visit poster's website
douglassdavis
Smarty Junkie


Joined: 21 Jan 2008
Posts: 541

PostPosted: Mon Oct 10, 2011 1:58 pm    Post subject: Reply with quote

orao wrote:
Please suggest something. I know it is a very basic question.
please Embarassed


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
View user's profile Send private message
douglassdavis
Smarty Junkie


Joined: 21 Jan 2008
Posts: 541

PostPosted: Mon Oct 10, 2011 2:00 pm    Post subject: Reply with quote

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
View user's profile Send private message
mohrt
Administrator


Joined: 16 Apr 2003
Posts: 7368
Location: Lincoln Nebraska, USA

PostPosted: Mon Oct 10, 2011 2:04 pm    Post subject: Reply with quote

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
View user's profile Send private message Visit poster's website
douglassdavis
Smarty Junkie


Joined: 21 Jan 2008
Posts: 541

PostPosted: Mon Oct 10, 2011 2:11 pm    Post subject: Reply with quote

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 Smile
Back to top
View user's profile Send private message
orao
Smarty Rookie


Joined: 23 Dec 2009
Posts: 20

PostPosted: Mon Oct 10, 2011 2:40 pm    Post subject: Reply with quote

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
View user's profile Send private message
U.Tews
Administrator


Joined: 22 Nov 2006
Posts: 5068
Location: Hamburg / Germany

PostPosted: Mon Oct 10, 2011 4:06 pm    Post subject: Reply with quote

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
View user's profile Send private message
orao
Smarty Rookie


Joined: 23 Dec 2009
Posts: 20

PostPosted: Mon Oct 10, 2011 4:48 pm    Post subject: Reply with quote

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
View user's profile Send private message
U.Tews
Administrator


Joined: 22 Nov 2006
Posts: 5068
Location: Hamburg / Germany

PostPosted: Mon Oct 10, 2011 5:29 pm    Post subject: Reply with quote

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
View user's profile Send private message
orao
Smarty Rookie


Joined: 23 Dec 2009
Posts: 20

PostPosted: Mon Oct 10, 2011 9:17 pm    Post subject: Reply with quote

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 Smile

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
View user's profile Send private message
Display posts from previous:   
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Smarty Forum Index -> Smarty 3 All times are GMT
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group
Protected by Anti-Spam ACP