Wednesday, July 25, 2012

add a own style sheet to a template



Problem:

We need to add a own style sheet to our template to avoid make changes on exiting template style sheet, the change is to avoid lose that change when we update or change the template.

Solution:
Create your own stylesheet.css file and upload to your styles folder, a good place is a new folder outside joomla default structure.

Search for template folder httpdocs/templates/<yourdefaulttemplate>/index.php; you can edit that file using extplorer joomla extensión or directly from joomla template editor.

after <head tag> insert that piece of code:

// Add a reference to a CSS file
JHTML::stylesheet($filename, $path);

$filename: will be the name of your own style sheet like "mystyle.css"
$path: that is the complete path to the filename selected before, like: "..\..\customcode\mystyle.css"

Another solution for a lit of templates in joomla than use gantry framework to use the addstyle method.

<? php $gantry->addStyles(array(' mystyle .css')); ?>

Thats is a sample where you can see how to add the new sheet on a gantry:

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $gantry->language; ?>" lang="<?php echo $gantry->language;?>" >
<head>
<?php
$gantry->displayHead();
$gantry->addStyles(array('template.css','joomla.css'));
$gantry->addStyles(array(' mystyle .css'));
...

Source links:

No comments:

Post a Comment