Joomla! with Flash

Table of Contents

Joomla! with Flash

Credits

About the Author

Acknowledgement

About the Reviewers

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Errata

Piracy

Questions

1. Get Started with Flash in Joomla!

Why use Flash in Joomla!?

Creating Flash objects

Some tools for working with Flash

SWiSH Max

Ajax Animator

Wink

Flash charting tools

Animated Charts

amCharts

Open Flash Chart

FusionCharts

ActionScript libraries

Riva FLV Encoder

sIFR

PowerPoint to Flash converter

Setting up the development environment

Web server

Database server

PHP

Example website

Summary

2. Enhance Your Joomla! Content with Flash

Have a look at the site!

Adding slideshows

Using RokSlideShow

Showing captions and descriptions for images

Adding the slideshow to Joomla! articles

Showing Flash in modules

The Flash Module

Joomla! Random Flash Module

Adding Flash movies using Simple Video Flash Player

Showing Flash movie in a module

Showing a Flash movie in content

Summary

3. Creating Attractive Menus with Flash

The existing Joomla! menu system

Making menus attractive using Flash

Flash Floating Menu

Using the component

Using the module

Super Web Flash module for Joomla! 1.5

Some other extensions for creating Flash menus

Summary

4. Creating Flash Photo Galleries

Building Flash photo galleries

Expose Flash Gallery

Configuring Expose gallery

Creating collections and albums

Adding photos and videos to albums

Showing the album

Showing the Expose Scroller module

Using the Expose plugin

Ozio Gallery

Showing photos from Flickr

Showing photos from a folder

Configuration for skins

Tilt 3D skin

Flickr Slideshow skin

Flickr Photos skin

Image Rotator skin

LustMosaico skin

Flickr Slideoo

Accordion skin

FlashCategory skin

FlashGallery skin

Carousel skin

Imagin skin

New Gallery

Simple Flash Image Gallery (SFIG)

Dynamic Flash Gallery

Summary

5. Flashier than Ever: Maps, Charts, Custom Fonts, Multimedia, and More

Showing maps using YOS amMap

Installing and configuring YOS amMap

Adding map files

Creating a map

Map data file

Map settings file

Publishing a map through the module

Showing the map in content using a plugin

Showing charts using YOS amChart

Configuring YOS amChart

Creating a chart

amChart settings file

amChart data file

Publishing the chart through the module

Embedding the chart in content using a plugin

Showing the content in any font using sIFR

Using Flash uploader

Creating a streaming media site

Installing and configuring JVideo!

Adding videos to your site

Showing videos in the frontend

Adding videos to content

Adding Flash MP3 players

Simple MP3 Bar

UnMP3 for Joomla! 1.5

Flash MP3 Player

Visual mind mapping with Joom!FreeMind

Summary

6. Flash Decorations: Flashy Templates, Headers, Banners, and Tickers

Adding Flash in templates

Structure of a Joomla! template

Using Flash logos

Using Flash headers

Using Flexheader3

Creating a module position

Configuring the module

Using Web Flash Module to show headers

Using Flash banners

Flash tickers

Summary

7. Playing with Code

Using Joomla! content in Flash

Using content from a database in Flash objects

Developing Flash content using J-AMFPHP

Configuring J-AMFPHP

Designing services

Using services in Flash

Ensuring accessibility of Flash content

Identifying accessibility issues

Addressing common accessibility issues

Summary

8. Troubleshoot Your Applications

Issues related to Joomla!

Problems with installation of extensions

SEF problems

Issues related to Flash

Flash 10 and Joomla! Flash Uploader

Inserting a Flash object in the Joomla! header

Issues related to individual extensions

Expose Flash Gallery

YOS amChart

The Random Flash Module

Ozio Gallery

Dynamic Flash Gallery

JVideo!

J-AMFPHP

Summary

A. Resources for Joomla! and Flash

Resources for Joomla!

Resources for Flash

Summary

Index

Joomla! with Flash

Suhreed Sarkar

Joomla! with Flash

Copyright © 2009 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: November 2009

Production Reference: 1231009

Published by Packt Publishing Ltd.

32 Lincoln Road

Olton

Birmingham, B27 6PA, UK.

ISBN 978-1-847198-24-2

www.packtpub.com

Cover Image by Vinayak Chittar <vinayak.chittar@gmail.com>)

Credits

Author

Suhreed Sarkar

Reviewers

Jose Argudo

Sonia Muñoz

Acquisition Editor

Usha Iyer

Development Editor

Swapna Verlekar

Technical Editor

Kartik Thakkar

Copy Editor

Leonard D'Silva

Editorial Team Leader

Akshara Aware

Project Coordinator

Srimoyee Ghoshal

Indexers

Monica Ajmera

Hemangini Bari

Proofreaders

Kevin McGowan

Chris Smith

Production Coordinator

Adline Swetha Jesuthas

Cover Work

Adline Swetha Jesuthas

About the Author

Suhreed Sarkar — an IT consultant, a trainer, and a technical writer—after completing Marine engineering, he served on board a ship for two years and then started his journey into the world of IT with an MCSE in Windows NT 4.0 track. Later, he studied business administration and earned an MBA from the University of Dhaka. He has a bunch of BrainBench certifications on various topics including PHP4, Project Management, RDBMS Concepts, E-Commerce, Web Server Administration, Internet Security, Training Development, Training Delivery and Evaluation, and Technical Writing.

As a trainer, he has taught courses on system administration, web development, e-commerce, and MIS. He has consulted for several national and international organizations including the United Nations and has helped clients in building and adopting their web portals, large scale databases, and management information systems. At present, he is working on building a framework for the education sector MIS and is promoting the use of ICTs in education.

Suhreed is a renowned technical author in Bengali having dozens of books published on subjects covering web development, LAMP, networking, and system administration. He authored the Zen Cart: E-commerce Application Development, and Joomla! E-commerce with VirtueMart books. Both of them are published by Packt Publishing.

While not busy with hacking some apps, blogging on his blog (www.suhreedsarkar.com), reading the philosophy of Bertrand Russell or management thoughts of Peter F. Drucker, he likes to spend some special moments with his family. Suhreed lives in Dhaka, Bangladesh.

Acknowledgement

Firstly, I am grateful to the Joomla! community and the developers and maintainers of the extensions discussed in this book, as without them, the book could not have been written.

I would like to thank the Packt team for their excellent professional support, and a special thanks to Usha Iyer, Swapna Verleker, Srimoyee Ghoshal, and Kartik Thakkar who have helped me throughout the whole process. I express my heartiest gratitude to the reviewers for providing their insightful comments on the first draft of this book. I thank my family and friends for being patient while I was working on this book.

About the Reviewers

Jose Argudo is a web developer from Valencia, Spain. After finishing his studies, he started working for a web designing company. After six years of working for that company and others, he decided to start working as a freelancer.

Now, after some years have passed, he thinks that it's the best decision he has ever made, a decision that lets him work with the tools he likes, such as Joomla!, CodeIgniter, CakePHP, JQuery, and other well-known open source technologies.

For the last few months, he has also been reviewing some of the books for Packt Publishing, such as Magento 1.3 Theme Design, Magento: Beginner's Guide, Magento Development with PHP, Joomla! SEO, and Symfony 1.3 Web Application Development.

If that weren't enough, he is also writing a book on CodeIgniter for Packt Publishing — a book he is putting all his efforts on.

To Silvia and Luis.

Sonia Muñoz is a web developer from Spain. She has completed the Superior Computer Systems Management course and is now willing to start with another of Superior Development's computer application courses. She has worked with tools like PHP, MySQL, HTML, CSS, jQuery, JavaScript, CodeIgniter, Joomla, Photoshop, and Dreamweaver.

After finishing her studies, she would like to set up her own web development business.

I dedicate this book to my father-in-law, Abul Hossain

Preface

Joomla! is an award winning Content Management System with lots of features. It is useful for almost all types of websites. It has an object-oriented, modular architecture with lots of extensibility features. You can build almost any kind of a website using Joomla!. It has a strong security, authentication, and authorization framework, a content management framework, and a templating system.

There are thousands of Joomla! components, modules, and plugins to extend the functionality of Joomla!. A component for Joomla! can be compared to an application for Joomla!. Similarly, modules are extensions to display the data on Joomla!-based websites. Plugins are also extensions for performing special tasks, such as pre- and post-filtering of content for Joomla!-based websites. With all these features of Joomla! that provide ease of administration and options for customization, sometimes you may think of integrating other technologies, such as Flash, into it. This is because Flash provides great features for animation, which is otherwise not possible using only Joomla!, HTML, or JavaScript.

Flash is unique in creating animated objects, and this adds an extra flavor to your Joomla!-based website. Besides stunning graphics, design, and layout, Flash can definitely add interactivity and value to the website. Some of the features, such as animations, small videos, and interactive games, are only possible through Flash. Considering these unique features of Flash, Joomla! developers have long been trying to use Flash content in Joomla! websites. This book shows you how to use Flash objects with Joomla! content with minimal efforts and maximum output.

What this book covers

Chapter 1: Get Started with Flash in Joomla! begins with a discussion on why one should opt for using Flash in Joomla! and what are the benefits of doing this. Next, it introduces us to the different types of Flash objects and various tools that will be useful for developing Flash and Joomla!-based sites.

Chapter 2: Enhance Your Joomla! Content with Flash teaches us how to use Flash-based image slideshows in our Joomla! website and display them at different module positions. As the chapter progresses, we learn to embed Flash animations into articles and finally learn to embed Flash movies at different module positions and within articles.

Chapter 3: Creating Attractive Menus with Flash begins with an introduction to the built-in menu system of Joomla!. It then illustrates the use of two extensions, Flash Floating Menu and Super Web Flash module for Joomla! 1.5, for embedding Flash-based menus into our Joomla! website and also lists a few other extensions.

In Chapter 4: Creating Flash Photo Galleries, we are introduced to the concept of building Flash photo galleries for our Joomla!-based website. This chapter begins with an illustration of the Expose Flash Gallery component and proceeds to the use of the Expose Scroller module and the Expose plugin. Next, we learn to embed a 3D Flash-based photo galley in our website with the help of Ozio Gallery. We also learn how to embed images from Flickr, as well as from our web server, and which of the skins available with Ozio Gallery can be used for doing so. Finally, we learn to use three simpler extensions for embedding Flash photo galleries — New Gallery, Simple Image Flash Gallery, and Dynamic Flash Gallery.

Chapter 5: Flashier than Ever: Maps, Charts, Custom Fonts, Multimedia, and More extends the use of Flash on our Joomla!-based website. Firstly, we learn to build interactive Flash-based maps and charts using the YOS amMap and amChart components respectively. Then the chapter illustrates the use of sIFR with Joomla! for displaying the contents of a Joomla! site in fonts that are not installed on users' computers. The use of the Joomla! Flash Uploader component is also illustrated. Further, the chapter takes us through how to create streaming video sites with the use of the JVideo! components and discusses various extensions for adding an MP3 player on your Joomla! website.

Chapter 6: Flash Decorations: Flashy Templates, Headers, Banners, and Tickers deals with using Flash templates for decorating our website with Flash logos, headers, banners, and tickers. In this chapter, we are introduced to the two ways of showing Flash objects in a Joomla! site, namely, by embedding the Flash object in a Joomla! template showing it permanently on a Joomla! website and by using a suitable module. Furthermore, the use of Joomla! modules like FlexHeader3 and Web Flash Joomla! for displaying Flash objects is also discussed in this chapter.

Chapter 7: Playing with Code focuses mainly on the issue of how we embed Joomla! content into a Flash site, which is exactly the opposite of what has been done in the previous chapters, using the J-AMFPHP component. In this chapter, we also take a look at some of the accessibility issues and ways to address these issues.

Chapter 8: Troubleshoot Your Applications deals with the most common problems with Joomla!, Flash, and the Joomla! extensions that have been discussed in this book. Besides pointing to the probable solution for such problems, the chapter also provides references to relevant websites and forums that can prove to be helpful in solving problems.

Appendix: Resources for Joomla! and Flash gives you a list of some more resources that can be useful for using Flash with Joomla!. Firstly, it shows some resources for Joomla!, and then it lists some Flash extension-specific resources.

What you need for this book

First of all, you will need the Apache-MySQL-PHP environment for running Joomla!. For this book, we have used Joomla! 1.5.14. All the descriptions and screenshots are based on this version of Joomla!. If you do not have access to any web-hosting service, then you still can use Joomla! and learn about it on your own computer. In that case, you need to set up the development environment by installing WAMP on your Windows machine. Further information on setting up the development environment on your Windows computer is provided in Chapter 1. To get the exact results, this book should be followed from the beginning to the end, and you should perform the tasks as described.

It is assumed that readers of this book have knowledge on Joomla! and a basic knowledge of Flash. Besides knowledge on the Apache-MySQL-PHP environment, Joomla!, and Flash, familiarity with HTML, CSS, and PHP will be an added advantage.

Who this book is for

If you are a Joomla! web developer and want to integrate Flash into your websites, then this book is for you!

Conventions

In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text are shown as follows: As you can see, the tag can contain child elements.

A block of code is set as follows:

{yos_amchart chartid='4' width='500' height='500' flashv='8' bgcolour='#ffffc0' plugin='1'}

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

flexheader

left

user1

...

right

debug

New terms and important words are