A. What is SqueezeBox?
SqueezeBox is Joomla's implementation of Lightbox, a Javascriptapplication designed to display content using transparent boxes (fig. A) in anelegant and simple manner. SqueezeBox can display a wide variety of content,from images to webpages. However, SqueezeBox does have some limitations,such as the fact that multiple content dialogs cannot be displayed at the sametime and that tooltips break when SqueezeBox is being used. Also, SqueezeBoxcurrently cannot display an image gallery. Although setup may seem slightlycomplicated at first, this guide will provide you with everything you will need tosetup SqueezeBox. In order to get the desired results, you need to know basicHTML and use Joomla 1.5RC4 or later. The content in this guide is based off of the Joomla Default Sample Data.This guide is designed to be simple and easy to comprehend; as a result,you will find screenshots, lightbulbs, fingers, and exclamation marks throughoutthis guide to emphasize specific facts. A indicates a fact that you'd probablywant to be aware of, a points to the web address of the page (remember that these are default URL's, and that you need to substitute
yoursiteaddress.com
with the actual address), and an indicates something towatch out for. In addition, code will be displayed using a separate font,
CourierNew
.Figure A. An sample imagedisplayed using SqueezeBox.
B. Getting Up & Running
1. Setup
The easiest method to setup SqueezeBox is to have it load on everywebpage, in case you might need it. To do so, you'll need to modify Joomla'sdefault template. Instructions are provided below.1. Login to the Joomla! Administrator Back-end.2. Hover your mouse over “Extensions” (on the drop-down menu rightbelow the Joomla logo), and select “Template Manager” (fig. B).3. Find the template that has a by its name, and click on thetemplate (fig. C).The default username is
admin.
A
template
is a preset format used as a starting pointso that the format does not have to be recreated eachtime it is used.
thefreedictionary.com
Figure B. Select the Template Manager.Figure C. Select the default template.http://www.yoursiteaddress.com/administrator
4. In the top right-hand corner, click “Edit HTML.” (fig. D). A page with atext box in the middle should load.
5.
Find
<head><jdoc:include type="head" />
in the text box, and add thefollowing. When done, click Save (fig. E):
<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(){ var JTooltips = newTips($$('.hasTip'), { maxTitleChars: 50, fixed: 'false'}); });// --></script><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>
Figure E. Add the script right below
<head><jdoc:include type="head" />.
Fiure D. Select “Edit HTML.”
Search History:
Result 00 of 00
00 results for result for
p.
Joomla! v 1.5 Squeezebox in your Joomla! Website
by ddcc
Google Highly Open Participation Contest
Joomla!
Google Highly Open Participation Contest
Joomla!
92.4K
Reads
102
Readcasts
23.5K
Embed Views
Get Scribd Mobile
To get Scribd mobile enter your number and we'll send you a link to the Scribd app for iPhone & Android.We've sent a link to the Scribd app. If you didn't receive it, try again.
We'll never share your phone number.
Recommended
More From This User
Notes
Load more
