Joomla! 1.5 JavaScript jQuery
()
About this ebook
Jose Argudo Blanco
Jose Argudo Blanco is a web developer from Valencia, Spain. After finishing his studies he started working for a web design company. After working for six years for that company and some others, he decided to work as a freelance. Now, after some years have passed, he thinks it's the best decision he has ever takena decision that let him work with the tools he likes, such as CodeIgniter, Joomla!, CakePHP, JQuery, and other well-known open source technologies. For the past few months he has also reviewed some books for Packt Publishing, such as Magento 1.3 Theme Design, Magento: Beginner's Guide, Joomla! 1.5 SEO, Symfony 1.3 Web Application Development, and Joomla! with Flash. The one yet to be published is Magento Development with PHP.
Related to Joomla! 1.5 JavaScript jQuery
Related ebooks
Joomla! with Flash Rating: 0 out of 5 stars0 ratingsGetting Started with React Native Rating: 4 out of 5 stars4/5Building Impressive Presentations with Impress.js Rating: 4 out of 5 stars4/5Developing Windows Store Apps with HTML5 and JavaScript Rating: 0 out of 5 stars0 ratingsDrupal 6 Content Administration Rating: 0 out of 5 stars0 ratingsApache Solr PHP Integration Rating: 0 out of 5 stars0 ratingsLearning Behavior-driven Development with JavaScript Rating: 5 out of 5 stars5/5Instant IntroJs Rating: 0 out of 5 stars0 ratingsInstant HTML5 Responsive Table Design How-to Rating: 0 out of 5 stars0 ratingsBuilding job sites with Joomla! Rating: 0 out of 5 stars0 ratingsCreating concrete5 Themes Rating: 0 out of 5 stars0 ratingsPrimeFaces Theme Development Rating: 0 out of 5 stars0 ratingsNode.js High Performance Rating: 0 out of 5 stars0 ratingsASP.NET Core 3 and React: Hands-On full stack web development using ASP.NET Core, React, and TypeScript 3 Rating: 0 out of 5 stars0 ratingsAdvanced Express Web Application Development Rating: 0 out of 5 stars0 ratingsOpenCart Theme and Module Development Rating: 0 out of 5 stars0 ratingsKnockoutJS Essentials Rating: 0 out of 5 stars0 ratingsBuilding a Web Application with PHP and MariaDB: A Reference Guide Rating: 0 out of 5 stars0 ratingsResponsive Media in HTML5 Rating: 0 out of 5 stars0 ratingsNode.js By Example Rating: 2 out of 5 stars2/5Express Web Application Development Rating: 3 out of 5 stars3/5My First Website for Students: Build Your First Website from Design to Code with Ease (English Edition) Rating: 0 out of 5 stars0 ratingsLearning PHP Data Objects Rating: 5 out of 5 stars5/5ReactJS for Jobseekers: The Only Guide You Need to Learn React and Crack Interviews (English Edition) Rating: 0 out of 5 stars0 ratingsBeginning Web Programming with HTML, XHTML, and CSS Rating: 0 out of 5 stars0 ratingsINSTANT Fancybox Rating: 0 out of 5 stars0 ratingsProgramming with CodeIgniter MVC Rating: 0 out of 5 stars0 ratingsjQuery Mobile Web Development Essentials - Third Edition Rating: 0 out of 5 stars0 ratingsBootstrap Site Blueprints Rating: 0 out of 5 stars0 ratingsBackbone.js Testing Rating: 0 out of 5 stars0 ratings
Information Technology For You
Computer Science: A Concise Introduction Rating: 4 out of 5 stars4/5Creating Online Courses with ChatGPT | A Step-by-Step Guide with Prompt Templates Rating: 4 out of 5 stars4/5How to Write Effective Emails at Work Rating: 4 out of 5 stars4/5Summary of Super-Intelligence From Nick Bostrom Rating: 5 out of 5 stars5/5An Ultimate Guide to Kali Linux for Beginners Rating: 3 out of 5 stars3/5Data Analytics for Beginners: Introduction to Data Analytics Rating: 4 out of 5 stars4/5How To Use Chatgpt: Using Chatgpt To Make Money Online Has Never Been This Simple Rating: 0 out of 5 stars0 ratingsSupercommunicator: Explaining the Complicated So Anyone Can Understand Rating: 3 out of 5 stars3/5Health Informatics: Practical Guide Rating: 0 out of 5 stars0 ratingsCompTIA A+ CertMike: Prepare. Practice. Pass the Test! Get Certified!: Core 1 Exam 220-1101 Rating: 0 out of 5 stars0 ratingsPanda3d 1.7 Game Developer's Cookbook Rating: 0 out of 5 stars0 ratingsCompTIA Network+ CertMike: Prepare. Practice. Pass the Test! Get Certified!: Exam N10-008 Rating: 0 out of 5 stars0 ratingsChatGPT: The Future of Intelligent Conversation Rating: 4 out of 5 stars4/5Windows Registry Forensics: Advanced Digital Forensic Analysis of the Windows Registry Rating: 4 out of 5 stars4/5Quantum Computing for Programmers and Investors: with full implementation of algorithms in C Rating: 5 out of 5 stars5/5Linux Command Line and Shell Scripting Bible Rating: 3 out of 5 stars3/5Hacking Essentials - The Beginner's Guide To Ethical Hacking And Penetration Testing Rating: 3 out of 5 stars3/5Cybersecurity for Beginners : Learn the Fundamentals of Cybersecurity in an Easy, Step-by-Step Guide: 1 Rating: 0 out of 5 stars0 ratingsPractical Ethical Hacking from Scratch Rating: 5 out of 5 stars5/5The Programmer's Brain: What every programmer needs to know about cognition Rating: 5 out of 5 stars5/5A Mind at Play: How Claude Shannon Invented the Information Age Rating: 4 out of 5 stars4/520 Windows Tools Every SysAdmin Should Know Rating: 5 out of 5 stars5/5The Basics of Hacking and Penetration Testing: Ethical Hacking and Penetration Testing Made Easy Rating: 4 out of 5 stars4/5Computer Organization and Design: The Hardware / Software Interface Rating: 4 out of 5 stars4/5A Civic Technologist's Practice Guide Rating: 0 out of 5 stars0 ratingsThe Ultimate Guide to Landing a Network Engineering Job Rating: 0 out of 5 stars0 ratingsDNS in Action Rating: 0 out of 5 stars0 ratings
Reviews for Joomla! 1.5 JavaScript jQuery
0 ratings0 reviews
Book preview
Joomla! 1.5 JavaScript jQuery - Jose Argudo Blanco
Table of Contents
Joomla! 1.5 JavaScript jQuery
Credits
About the Author
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. Let's Start Making a Better Site—Images
How Joomla! handles images by default
Inserting images into articles
Placing images in modules
Placing images in the template
Adding a jQuery-powered image slideshow module
Some other modules to try
Image pop ups
Some other modules to try
Putting images together—image galleries
Some other extensions to try
Tips and tricks
Summary
2. Site Content—Our Next Step
Basic concepts on Joomla! content
How Joomla! shows our articles to site visitors
Enhance your site content using JavaScript
Organizing our content into tabs
Some other modules to try
Article slideshows
Some other extensions worth checking
Site search
Introducing AJAX search
Some other extensions to try
Tips and tricks
Summary
3. Embedding Rich Media Features with Joomla! Plugins
Concept of plugin—what is a Joomla! plugin and how does it work?
Code highlighter plugin
Some other extensions to try
captbunzo's Flickr Album plugin
Some other plugins to try
SC jQuery
Some other plugins to try
Tips and tricks
Summary
4. One Last Look at Joomla! jQuery Modules
Limitations of Joomla! menu modules
Creating a drop-down menu with CSS alone
jQuery-powered Joomla! menu modules
Adapting the menu to suit our template
Some more extensions to try
Creative ways of placing login modules in our site
Some other extensions to try
Tips and tricks
Summary
5. Refactoring Our Site
Warning
Removing unnecessary jQuery loads
Code highlight
pPGallery plugin
Shadowbox
AJAX Header Rotator
Content Slider module
What happens with jQuery UI
c7DialogMOD
jQuery tabs module
Removing MooTools
Tips and tricks
Summary
6. Getting Our Hands on Coding JavaScript
Adding movement to our site's header—Parallax effect
Preparing the HTML necessary for our example
Adding jQuery Parallax library
Tips and tricks
jQuery library jScrollPane
Adding mouse scrolling
Adding useful tooltips
Tips and tricks
Summary
7. Creating Our Own Modules
Learning the basics of Joomla! module creation
Creating a Send us a question
module
Making a better form using JavaScript
Send the form using jQuery AJAX
Tips and tricks
Validating form fields using jQuery—why validate?
Warning
What could you check?
What to do next? Packing and installing the module
Summary
8. Building Complete Solutions, Modules, and Components
Working with the news rotator module
Creating the component base
XML installer file
Why are so many files necessary?
Building our first model
How Joomla! helps us work with the database
Inserting data
Updating data
Deleting records
Reading data
loadResult
loadObject
loadObjectList
Modifying our installer to create our table
Coding a basic admin zone
Inserting, editing, and deleting records in our admin zone
Showing our data in our module
Adding jQuery to our module—refreshing data using JavaScript
Summary
9. Going Further with Our Component Development
Adding a table paginator plugin to our admin zone
Textarea autogrow plugin
Working on our component's frontpage
Equal size columns with jQuery
Paginating our contents
Going back to the admin zone
Adding tips and instructions to fill our form using JavaScript
Uploading images
Showing our images in the frontend
An interesting way to show the caption
Adding a fresh full image pop-up script
Adding a WYSIWYG editor to our component backend
Summary
10. Problems and Usability
What happens if JavaScript is disabled?
Using Firebug to help us in our development
Possible problems and solutions with jQuery
Optimizing CSS and JavaScript
Summary
Index
Joomla! 1.5 JavaScript jQuery
Joomla! 1.5 JavaScript jQuery
Copyright © 2010 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: July 2010
Production Reference: 1190710
Published by Packt Publishing Ltd.
32 Lincoln Road
Olton
Birmingham, B27 6PA, UK.
ISBN 978-1-849512-04-6
www.packtpub.com
Cover Image by Asher Wishkerman (<a.wishkerman@mpic.de>)
Credits
Author
Jose Argudo Blanco
Reviewers
Eric Brown
Tahsin Hasan
Acquisition Editor
Darshana Shinde
Development Editor
Rakesh Shejwal
Technical Editor
Hithesh Uchil
Copy Editors
Janki Mathuria
Lakshmi Menon
Indexer
Hemangini Bari
Editorial Team Leader
Akshara Aware
Project Team Leader
Lata Basantani
Project Coordinator
Srimoyee Ghoshal
Proofreader
Aaron Nash
Graphics
Geetanjali Sawant
Production Coordinator
Aparna Bhagat
Cover Work
Aparna Bhagat
About the Author
Jose Argudo Blanco is a web developer from Valencia, Spain. After completing his studies, he started working for a web design company. Then, six years later, he decided to freelance.
Now that some years have passed as a freelancer, he thinks it's the best decision he has ever taken because it let him work with the tools that he likes, such as Joomla!, CodeIgniter, CakePHP, jQuery, and other well-known open source technologies.
His desire to learn and share his knowledge has led to him being a regular reviewer of books from Packt Publishing, including Magento 1.3 Sales Tactics, Openx Ad Server, Drupal E-commerce, Joomla! With Flash, Joomla! 1.5 SEO, and Magento Theme Design.
Recently, he published his own book, CodeIgniter 1.7, which you can also find on Packt's site. And since then he has been working on this Joomla! book, putting all his effort into it.
To Silvia, my brother, my family, Packt's team, and, of course, to you, the reader. I hope this book is useful to you.
About the Reviewers
Eric Brown, born and raised in California, joined the US Navy at 17 and became a Preventive Medicine Technician. Upon exiting military service, he left the medical field behind and moved to Nebraska and entered college to study art and design, which resulted in a Bachelor's of Science in Graphic Design from Wayne State College in Nebraska. Eric has since branched out by teaching himself (or learning from others) various aspects of HTML, CSS, and PHP as well as a variety of other code languages and web marketing strategies and tools. He currently owns his own design and development business located in Curtis, Nebraska, where he lives with his wife and pets.
Over the years Eric has worked for a local design and development firm in Nebraska on such projects as the Golden Spike Tower website, aimed at tourist traffic centered on the Union Pacific's Bailey Yard, and with a premier pet industry design and development firm as a project manager. He has also written for such prestigious publications as Trafficology (a purchased print publication on web marketing read by over 80,000 worldwide), CMSWire.com (a leader in content management news), Revenews (a highly rated site on various aspects of marketing), and Gadgetell (a well-known gadget news site).
Eric has been involved in other books as well, providing editing, image touch-up, and custom hand-drawn maps for Tagging Along (a Neville Family retrospective) as well as editing, layout, cover art, and image touch-up for My Life and Community (autobiography of Ken Huebner).
I would like to thank any and all who have helped to bring my career to this point, but most of all I would like to thank my wife Jaime and two children Ariel and Autumn for all their patience and understanding as my career and business underwent their developmental stages.
Tahsin Hasan is the 16th Zend PHP 5 certified programmer from Bangladesh. He is a tech enthusiast and has more than five years of web development experience. He has proficiency in LAMP environment. Tahsin Hasan is deft in both client-side and server-side programming techniques. He has worked with several PHP frameworks, such as CodeIgniter, Symphony, and CakePHP. He has contributed several libraries to the CodeIgniter community. He has also worked on several jQuery plugins. He has professional experience on software development lifecycle.
Tahsin Hasan always contributes to technical discussions on cutting edge technologies on his blog (http://newdailyblog.blogspot.com). You can reach him at
I would like to thank my parents and my siblings for their encouragement while reviewing this book. And I would like to give special thanks to Srimoyee Ghoshal, Project Coordinator at Packt Publishing.
Preface
To date, Joomla! has been well known as a great content management system (CMS). There are many sites using it throughout the world, some of them having great features that impress their visitors. Most of the time, these appealing and powerful features work thanks to JavaScript. In this book, we are going to see how to enhance our site with these features, using another powerful open source tool—the jQuery JavaScript library.
Do you want to have a full-featured site? And more importantly, do you want to know how to develop jQuery-powered extensions? Just keep reading!
What this book covers
Chapter 1, Let's Start Making a Better Site Images, shows how Joomla! works with images by default. It then moves on to explain some image slideshows, pop ups, and image galleries—all using some interesting Joomla! extensions, which are jQuery-powered.
Chapter 2, Site Content Our Next Step, as its name suggests, is all about the content of our site and the different ways in which we can organize it. Not only does it show the basic ways, but also the use of tabs and article slideshows. It also includes a bit of site search, even AJAX site search.
Chapter 3, Embedding Rich Media Features with Joomla! Plugins, shows some interesting plugins, such as the code highlighter and Flickr plugins. We will also see the SC jQuery plugin—a plugin that will be of help in the future chapters of the book.
Chapter 4, One Last Look at Joomla! jQuery Modules, is where we will stop and see some interesting modules before proceeding to more complex chapters. For example, we will build drop-down menus, first with CSS and then with a Joomla! module. We will also see how to interestingly place the login module.
Chapter 5, Refactoring Our Site, is the last chapter before we start coding ourselves. Here we will stop and see how to make fewer jQuery library loads, and also some tips and warnings—it may not be the easiest chapter, but is an important one.
Chapter 6, Getting Our Hands on Coding JavaScript, shows us how to, instead of using Joomla! extensions, make use of some jQuery plugins to add some interesting effects to our template. This will involve some coding, but the results will be quite nice, including a Parallax effect, tooltips, and the always useful jScrollPane plugin.
Chapter 7, Creating Our Own Modules, shows us that it's much better to create our own modules so that our hard work of development can be easily used in any Joomla! site. In this chapter, we will see how to create our own modules with a small example: a quick, AJAX-powered contact form.
Chapter 8, Building Complete Solutions, Modules, and Components, will help us dive further and start working on a component. By the end of the chapter, we will not only have a working component backend, but also a module on the frontend to show our data—of course, with some interesting jQuery effects.
Chapter 9, Going Further with Our Component Development, continues work on our previous component to give it a frontend. However, we will also add some interesting features to the backend, such as textarea autogrow, equal size columns, pagination with JavaScript, and many more.
Chapter 10, Problems and Usability, is a chapter centered on solving some problems, and gives some interesting tips that we can apply to all the work we have seen throughout the book. It will cover topics such as JavaScript being unavailable and a failed AJAX request.
What you need for this book
Basic knowledge on Joomla! will help you follow the book. We try to make all explanations as easy to follow as possible. Basic HTML, PHP, and JavaScript knowledge is a prerequisite for the book. But don't worry, you will be provided with step-by-step explanations throughout the book. You will find this book very easy to follow. Also, in order to make the book even more easier to follow, you can download the code bundle from Packt’s site. In the code bundle given on the site, you will find all the code that are given as examples in the book.
Who this book is for
This book is mostly for PHP developers who work with Joomla! and web designers who want to add JavaScript and jQuery elements to their Joomla! themes and modules. However, it will also be useful to those who are interested in building their own jQuery-powered Joomla! extensions.
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: After we create an instance of the controller class, we call the execute method.
A block of code is set as follows:
defined( '_JEXEC' ) or die( 'Restricted access' );
jimport('joomla.application.component.controller');
class TinynewsController extends JController{
function display(){
parent::display();
}
}
When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:
class TinynewsController extends JController{ var $_name='viewtoload';
function display(){
parent::display();
}
New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: Then go to Extensions | Install/Uninstall. Here, after selecting the file, click on the Upload file & install button
.
Note
Warnings or important notes appear in a box like this.
Tip
Tips and tricks appear like this.
Reader feedback
Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.
To send us general feedback, simply send an e-mail to <feedback@packtpub.com>, and mention the book title via the subject of your message.
If there is a book that you need and would like to see us publish, please send us a note in the SUGGEST A TITLE form on www.packtpub.com or e-mail
If there is a topic that you have expertise in and you are interested in either writing or contributing to a book on, see our author guide on www.packtpub.com/authors.
Customer support
Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.
Tip
Downloading the example code for the book
You can download the example code files for all Packt books you have purchased from your account at http://www.packtpub.com. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.
Errata
Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/support, selecting your book, clicking on the let us know link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded on our website, or added to any list of existing errata, under the Errata section of that title. Any existing errata can be viewed by selecting your title from http://www.packtpub.com/support.
Piracy
Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.
Please contact us at <copyright@packtpub.com> with a link to the suspected pirated material.
We appreciate your help in protecting our authors and our ability to bring you valuable content.
Questions
You can contact us at <questions@packtpub.com> if you are having a problem with any aspect of the book, and we will do our best to address it.
Chapter 1. Let's Start Making a Better Site—Images
Pictures are worth a thousand words; images are one of the best ways to make our site interesting and grab our visitors' attention.
Although some people will agree with this statement more than others, the truth is that images have been one of the most important aspects of websites to date. From images incorporated into the layout to images used in content, they all help to make our site look interesting and appealing. And that's very, very important. We can have the best content, products, and articles; however, if our site is not appealing enough, our visitors will leave before we can even show them all of our site's great features.
If you stop to think