First, you need a Jumi component or Sourcerer plugin for this to work. Since our main focus here is custom development outside of standard modules or articles within Joomla, we need one of these.
Here you can find Jumi… my favorite extension for Joomla other than Breezing Forms.
http://extensions.joomla.org/extensions/edition/custom-code-in-content/1023?qh=YToxOntpOjA7czo0OiJqdW1pIjt9
~My little ad for Jumi~
*Jumi is a component that allows you to create custom php and js pages and load them into your Joomla site. So if you need to add AJAX or interactivity to your website, Jumi is the perfect component. Jumi is compatible with J1.0, J1.5 and J1.6. Jumi allows you to add custom content to modules, articles, and more.
New to Jumi? You can find these helpful tutorials at http://edo.webmaster.am/jumi/tutorial.
~Now back to the main topic~
If you’ve custom coded your page and need to add a bit of JavaScript or CSS to it, you’ll usually want to put those links in the template’s index.php page. , but now these scripts and css are applied site-wide and can mess up your template’s scripts and css on all pages. Is there a way I can add these scripts and css pages without manually adding them to the index.php page and not affect the site wide scripts and css.
Plug this at the top of your customized php page and you will get the desired result only on the page where you add this code.
<?php
$document =& JFactory::getDocument();
$document->addStyleSheet('files/css/default.css');
$document->addScript('files/scripts/test.js');
?>
This will add the script and css files to the tag for that particular page. You can then freely change that page without worrying about ruining your entire site.
If you run into any issues, please refer to these two Joomla articles that provide further assistance.
http://docs.joomla.org/Adding_JavaScript
http://docs.joomla.org/Adding_JavaScript_and_CSS_to_the_page
