David James Whitely » Templates http://davidwhitely.com Fri, 24 Feb 2012 19:31:33 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Add Mootool’s Squeezebox functionality to your Joomla template http://davidwhitely.com/2009/12/add-mootools-squeezebox-functionality-to-your-joomla-template/ http://davidwhitely.com/2009/12/add-mootools-squeezebox-functionality-to-your-joomla-template/#comments Wed, 09 Dec 2009 02:55:43 +0000 admin http://davidwhitely.com/?p=297 Joomla uses Mootools as a Javascript framework by default, and also has a light-box effect called Squeezebox built in by default. It’s quite easy to add Squeezebox functionality to your Joomla template.
In the index.php file of your template, find the head tag and insert this code:
<?php JHTML::_('behavior.mootools'); ?>

That will output this code:

<script type="text/javascript" src="<?php echo $this->baseurl ?>/media/system/js/modal.js"> </script>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/media/system/css/modal.css" type="text/css" />
<script type="text/javascript">
// <!--
window.addEvent('domready', function() {
SqueezeBox.initialize({});
$$('a.modal').each(function(el) {
el.addEvent('click', function(e) {
new Event(e).stop();
SqueezeBox.fromElement(el);
});
});
});
// -->
</script>
Then make some xhtml such as this:
<p><a class="modal" rel="{handler:'iframe',size:{x:840,y:550}}" href="http://google.com">TEST</a></p>

You should see a popup with the google homepage in it. Checkout the Squeezebox page for more info.

]]> http://davidwhitely.com/2009/12/add-mootools-squeezebox-functionality-to-your-joomla-template/feed/ 0 Web Tools http://davidwhitely.com/2009/12/web-tools/ http://davidwhitely.com/2009/12/web-tools/#comments Tue, 08 Dec 2009 00:41:09 +0000 admin http://davidwhitely.com/?p=293 This is going to be a list of web development tools that I use. Right now, it’s pretty small. Inspired by this page from elementiks.com.

Templates:
Bulletproof Templates – Joomla Blank Skeleton Templates
Sandbox by Plaintext – WordPress Blank Skeleton Template

jQuery:
Visual jQuery
jQuery API

]]> http://davidwhitely.com/2009/12/web-tools/feed/ 0