J1.5

Customising the JA Purity template/header/accessibility

< J1.5:Customising the JA Purity template‎ | header(Redirected from Customising the JA Purity template/header/accessibility)

The original JA Purity template was provided from JoomlArt.com as a zip but the latest files have been installed along with Joomla. The relevant files, index.php, ja_templatetools.php, template.css, ja.script.js and user-increase.png, user-decrease.png, user-reset.png, can be found in templates/ja_purity. If you've been following the tutorial, you can download a tutorial version of the template that installs to the templates/my_japurity folder. Inside the folder of the template, the files are located as follows:

    <location of template>/
        index.php
        ja_templatetools.php
        css/
            template.css
        images/
            user-increase.png
            user-decrease.png
            user-reset.png
        js/
            ja.script.js

HTML and PHP Files

ja_purity/index.php

101 <ul class="accessibility">
102 	<li><a href="#ja-content" title="<?php echo JText::_("Skip to content");?>"><?php echo JText::_("Skip to content");?></a></li>
103 	<li><a href="#ja-mainnav" title="<?php echo JText::_("Skip to main navigation");?>"><?php echo JText::_("Skip to main navigation");?></a></li>
104 	<li><a href="#ja-col1" title="<?php echo JText::_("Skip to 1st column");?>"><?php echo JText::_("Skip to 1st column");?></a></li>
105 	<li><a href="#ja-col2" title="<?php echo JText::_("Skip to 2nd column");?>"><?php echo JText::_("Skip to 2nd column");?></a></li>
106 </ul>

ja_purity/index.php

131 	<?php $tmpTools->genToolMenu(JA_TOOL_FONT, 'png'); ?>

ja_purity/ja_templatetools.php

69 	function genToolMenu($_array_tools=null, $imgext = 'gif'){
70 		if(!is_array($_array_tools)) $_array_tools = array($_array_tools);
71 		if(!$_array_tools) $_array_tools = array_keys($this->_params_cookie);
72 		if (in_array(JA_TOOL_FONT, $_array_tools)){//show font tools
73 		?>
74 		<ul class="ja-usertools-font">
75 	      <li><img style="cursor: pointer;" title="<?php echo JText::_('Increase font size');?>" src="<?php echo $this->templateurl();?>/images/user-increase.<?php echo $imgext;?>" alt="<?php echo JText::_('Increase font size');?>" id="ja-tool-increase" onclick="switchFontSize('<?php echo $this->template."_".JA_TOOL_FONT;?>','inc'); return false;" /></li>
76 		  <li><img style="cursor: pointer;" title="<?php echo JText::_('Default font size');?>" src="<?php echo $this->templateurl();?>/images/user-reset.<?php echo $imgext;?>" alt="<?php echo JText::_('Default font size');?>" id="ja-tool-reset" onclick="switchFontSize('<?php echo $this->template."_".JA_TOOL_FONT;?>',<?php echo $this->_tpl->params->get(JA_TOOL_FONT);?>); return false;" /></li>
77 		  <li><img style="cursor: pointer;" title="<?php echo JText::_('Decrease font size');?>" src="<?php echo $this->templateurl();?>/images/user-decrease.<?php echo $imgext;?>" alt="<?php echo JText::_('Decrease font size');?>" id="ja-tool-decrease" onclick="switchFontSize('<?php echo $this->template."_".JA_TOOL_FONT;?>','dec'); return false;" /></li>
78 		</ul>
79 		<script type="text/javascript">var CurrentFontSize=parseInt('<?php echo $this->getParam(JA_TOOL_FONT);?>');</script>
80 		<?php
81 		}
82 	}

CSS Files

ja_purity/css/template.css

1482 ul.accessibility {
1483 	position: absolute;
1484 	top: -100%;
1485 }
1486 
1487 /*usertool*/
1488 ul.ja-usertools-font {
1489 	font-size: 11px;
1490 	position: absolute;
1491 	top: 8px;
1492 	right: 70px;
1493 }
1494 
1495 ul.ja-usertools-font li {
1496 	padding: 0;
1497 	margin: 0;
1498 	display: inline;
1499 	background: none;
1500 }

Image Files

  • /images/user-increase.png
  • /images/user-decrease.png
  • /images/user-reset.png

Javascript Files

ja_purity/js/ja.script.js

 83 switchFontSize=function(ckname,val){
 84 	var bd = $E('BODY');
 85 	switch (val) {
 86 		case 'inc':
 87 			if (CurrentFontSize+1 < 7) {
 88 				bd.removeClass('fs'+CurrentFontSize);
 89 				CurrentFontSize++;
 90 				bd.addClass('fs'+CurrentFontSize);
 91 			}
 92 		break;
 93 		case 'dec':
 94 			if (CurrentFontSize-1 > 0) {
 95 				bd.removeClass('fs'+CurrentFontSize);
 96 				CurrentFontSize--;
 97 				bd.addClass('fs'+CurrentFontSize);
 98 			}
 99 		break;
100 		default:
101 			bd.removeClass('fs'+CurrentFontSize);
102 			CurrentFontSize = val;
103 			bd.addClass('fs'+CurrentFontSize);
104 	}
105 	Cookie.set(ckname, CurrentFontSize,{duration:365});
106 }
Advertisement