I want to add a CSS file inside tag from template (.phtml) file in magento. Is it possible ?
There is a reason to do so: the CSS file name is dynamic, so I don't know until the template executes. Is it possible to do so?
-
you want to add styles in header file of Magento?Sankar Subburaj– Sankar Subburaj2012-01-05 09:16:28 +00:00Commented Jan 5, 2012 at 9:16
-
I want to add CSS file inside <head> tag from my template (.phtml) file. There is a reason to do so, the CSS file name is dynamic. so I don't know until the template execute. Is it possible to do so ?Sohail– Sohail2012-01-05 11:49:29 +00:00Commented Jan 5, 2012 at 11:49
-
Sure Sohail, see my answer below. It will helps you...Sankar Subburaj– Sankar Subburaj2012-01-05 12:30:16 +00:00Commented Jan 5, 2012 at 12:30
-
Thanx Sankar, what I am focusing on is add it to Head tag of the page. My style name is dynamic, so I want to add it from my template .phtml when its decided what css file is going to be added.Sohail– Sohail2012-01-05 13:37:54 +00:00Commented Jan 5, 2012 at 13:37
-
1It sounds like you are trying to add business logic to the template file. That's not where it belongs. Use @Nick's answer and add your. CSS file in the controller (but do your logic in a Model where it belongs).Joe Constant– Joe Constant2012-01-05 16:30:09 +00:00Commented Jan 5, 2012 at 16:30
|
Show 1 more comment
3 Answers
To add a CSS file from a controller after you've loaded the layout, but before you've rendered the layout, you'd do something along the lines of:
public function indexAction() {
$this->loadLayout();
$head = Mage::app()->getLayout()->getBlock('head');
$head->addItem('skin_css', 'css/additional.css');
$this->renderLayout();
}
The problem with doing something this this in the template file is that it's highly likely that the head template has already been rendered, and so the additional directives you give the block instance are useless because they are too late.
Just use a layout file and do the following:
<?xml version="1.0">
<layout>
<default>
<reference name="head">
<action method="addItem"><type>skin_css</type><file>css/additional.css</file></action>
</reference>
</default>
</layout>
4 Comments
Bogdan
Found this answer usefull, just wanted to share that the layout file you might want to edit is
page.xml
Nick
@Bodgan: You shouldn't edit the core layout files. The standard way of doing this is to create a
local.xml in your theme directory and making the changes there.
localhost
@Nick what if i got a different/new phtml and i want to load the css just under that page, e.g my-2-column.phtml
Nick
@Nofel You'll need to find a layout handle that you can attach to.
yes it is possible and nothing different just like this:
<head>
<link rel="stylesheet" href="<?php echo $this->getSkinUrl(); ?>css/yourCssfile.css" type="text/css" />
</head>
it will pick ur theme folder from skin/themefolder/css/yourCss
5 Comments
zigojacko
This isn't the correct method to load custom stylesheets hence -1. These should be loaded via the XML layout file for the theme/extension.
atif
@GeoffJackson i didn't say that it is the right way to do that, instead mentioned that it is possible. You could have extended my answer saying that it is dirty and quick way to do that instead of -1
zigojacko
I down voted purely because it shouldn't be done like this, not in Magento. All template files part of a theme/extension should carry their own XML layout which calls the necessary CSS/JS relating to that extension. I would only extend your answer if I agreed that the method could be used in some cases.
Andreas
-1, Any answer with a solution, that does not work with the system, shouldn't be posted.
Shapeshifter
This is just not the magento way
hi work fine this type called css in my first project http://satyak.co/ go on head.phtml after all css and js and call getSkinUrl('css/bootstrap.css');?>" rel="stylesheet">
