Joomla! 1.5 Site Blueprints

Joomla! 1.5 Site Blueprints

Tailor-made plans for easily building powerful and exciting Joomla! sites

Timi Ogunjobi

BIRMINGHAM - MUMBAI

Joomla! 1.5 Site Blueprints

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: May 2010

Production Reference: 1190510

Published by Packt Publishing Ltd. 32 Lincoln Road Olton Birmingham, B27 6PA, UK.

ISBN 978-1-849511-70-4

www.packtpub.com

Cover Image by Asher Wishkerman ([email protected])

Credits

AuthorTimi Ogunjobi

ReviewersJose Argudo

Deepak Vohra

Acquisition EditorSarah Cullington

Development EditorDhiraj Chandiramani

Technical EditorHithesh Uchil

Copy EditorLakshmi Menon

IndexerMonica Ajmera Mehta

Editorial Team LeaderAkshara Aware

Project Team LeaderPriya Mukherji

Project CoordinatorAshwin Shetty

ProofreaderDirk Manuel

GraphicsGeetanjali Sawant

Production Coordinator Shantanu Zagde

Cover WorkShantanu Zagde

About the Author

Timi Ogunjobi is a Technical Writer, Web Developer, and Open Source evangelist. Trained as an engineer, Timi has been developing web applications on several frameworks for more than five years, and has also been writing for more than a decade on a wide variety of topics, including fiction, business, and technology.

Timi balances his time between programming, reviewing, writing, and contributing to interesting web-based and community projects. When he isn't working (which isn't that often) he enjoys playing jazz guitar and getting involved in outdoor activities—principally cricket, golf, and swimming.

Timi is the principal architect of Websesame—www.websesame.com—which is a web programming firm. He is also the CEO of Xceedia Ltd.—www.xceedia.co.uk—which is a software development and training firm that undertakes CMS-, LMS-, and ERP-based projects and web applications in particular.

Timi has previously had two Drupal books published, titled Drupal Website Models and Drupal 6 Site Blueprints. He has also published one Joomla! book, titled Joomla! Website Models. He has also published several fiction and nonfiction books, and has been featured in several anthologies.

This book was again made possible by God, who made all things possible. Thanks also to Sarah Cullington, David Barnes, Dhiraj Chandiramani, Hithesh Uchil, and Ashwin Shetty of Packt Publishing. Thanks to my family who knew how important it is to keep out of my way, especially when I am on a mission from God. Thanks also to me of course.

About the Reviewers

Jose Argudo 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 known open source technologies.

His desire to learn and share his knowledge has led him to be a regular reviewer of books from Packt Publishing, including Joomla! with Flash, Joomla! 1.5 SEO, Magento Theme Design, and Symfony 1.3 Web Application Development.

Recently, he has even published his own book, CodeIgniter 1.7, which you can also find on Packt's site. If you work with PHP, take a look at it!

Now he is working on a new book for Packt, and this time it is Joomla! related. Check for it soon!

If you want to know more about him, you can visit his site, at www.joseargudo.com.

To my brother, I wish him the best.

Deepak Vohra is a consultant and a principal member of NuBean.com, a software company. Deepak is a Sun Certified Java Programmer and Web Component Developer, and has worked in the fields of XML and Java programming and J2EE for over five years. Deepak is the co-author of the Apress book Pro XML Development with Java Technology, and was the technical reviewer for the O'Reilly book WebLogic: The Definitive Guide. Deepak was also the technical reviewer for the Course Technology PTR book Ruby Programming for the Absolute Beginner, and the technical editor for the Manning Publications book Prototype and Scriptaculous in Action. Deepak is also the author of the Packt Publishing books JDBC 4.0 and Oracle JDeveloper for J2EE Development, and Processing XML documents with Oracle JDeveloper 11g.

Table of ContentsPreface 1Chapter 1: Installation and Configuration 7

Minimum system requirements 7Installation on a local computer 8

Installation on WampServer 8Installing Joomla! 1.5 on localhost 9

Installing Joomla! on a remote server 17Other installation possibilities 17Manual installation 18Configuration and backend administration 18Trim off sample data 19Create a new section 20Create new categories 20Extending your Joomla! 20

Content Construction Kit (CCK) 21Modules Anywhere 21Cron Scheduler 21

Learning Joomla! 21Basic Administration 22

Template settings 23Global configuration 24Site backup 24

Optimizing your site 25System cache 25Gzip 26

Table of Contents

[ ii ]

Other optimization techniques 26Template 26Components 26SEF 27

Summary 27Chapter 2: Buzzy Beez—Building a Company Site 29

Build Buzzy Beez's site 30Template 31Extensions 31Install a new template 32Basic content 33

Create the About Us page 33Create Latest Information posts 36Create the document repository 38Create a Contact form 42

Display content 44Add an About Us link 45Add the Product News link 47Add the Company News link 48Add a Downloads link 49Add a Contact us link 50

Finishing up 51Summary 52

Chapter 3: Global Hitchhikers Club—Building an Aficionado's Site 53

Build the Global Hitchhikers Club site 55Template 55Extensions 55Basic content 56

User settings 57Configure the front page 57Create a new section 58Create new categories 59Test the article submission 61Create a comments system 62Module positions 63

Display content 65Add the Africa link 66

Table of Contents

[ iii ]

Add the other continent links 67Finishing up 70Improving the basic site 71Summary 72

Chapter 4: The Daily Joomer–Building a Newspaper Site 73Build The Daily Joomer online 75Template 75Extensions 75Organizing the articles 76

User settings 76Configure the front page 77Create a new section 78Create new categories 79Test the article submission 80

Forums 81Module positions 83

Display content 85Add the News section link 85Add the other section links 86Add the Forum link 87

Finishing up 88Further development 89Summary 89

Chapter 5: Breakin' Events—Building an Events Site 91Build the Breakin' Events site 93Template 93Extensions 93

Configure JEvents component 94Configure the Component pane 95Configure the Permissions pane 96Configure the Event Editing pane 96Configure the Event Detail View pane 97Configure the Main Monthly Calendar pane 98Configure the Year/Category View pane 98Configure the RSS pane 99Configure the Calendar pane 100Configure Latest Events pane 100

Create new categories 101Test the Event submission form 102

Table of Contents

[ iv ]

Display content 104Add the Global link 104Add the Africa link 105Add other continent links 105Modify the front page display 106Calendar and Latest Events blocks 106

Finishing up 109Extending functionality 110Summary 110

Chapter 6: Joombook—Building a Community Site 111Build Joombook 113Template 113Extensions 113Basic content 114Configure Community Builder 114Create a new section and category 117

Create a section 118Create a category 118

Configure polls 119Configure forums 121Configure chat 122Create comments system 122Put it all together 124

Create new modules 124Configure the front page 124Menus 125

Create the Chat menu 125Create the Forums menu 126Create the Blogs menu 127Create the Poll menu 127Create CB menus 128

Finishing up 129Adding functionality 129Summary 130

Chapter 7: Joomgets Inc.—Building an E-commerce Site 131Build the Joomgets Inc. web shop 132Template 133Extensions 133Basic VirtueMart configurations 133

Table of Contents

[ v ]

Basic configuration 135Edit Store 135Configuration 138List Payment Methods 140Product List 140Categories 141Shippers 145Shipping rates 146

Display Products 147Have we done this correctly? 148

Joe Bling is taken to the cart 148Joe Bling goes to the checkout 149


Chapter 8: Joomlaburg Accommodations—Building a Directory Site 155

Build Joomlaburg Accommodations 156Template 156Extensions 156Install Joomla! 157Install SOBI2 157

Other settings 163Categories 164

Create new categories 165Create subcategories 168

Form fields 168Entry Configuration 171View Configuration 172Payment Options 173Front page 174Search 178Permissions 178


Chapter 9: Nosh'r—Building a Photo Sharing Site 179Build Nosh'r 180Template 181Extensions 181Install Joomla! 181

Table of Contents

[ vi ]

Install Phoca Gallery 181Categories 182Create new categories 183Themes 184

Global configuration 184Category Views 185Detail View 186

Front page 188New user registration 190Permissions 192Add images 192Finishing up 195

Have we done this right? 195Extending functionality 198Summary 198

Chapter 10: Alienspotting—Building a Google Map Site 199Extensions 201Template 201Build Alienspotting 201

Enable modules and plugins 202Configure ContentMap 202Create the front page Google map 204Configure JComments 206Test the article submission 208

Add the geographical coordinates 208Test JComments 209

Finishing up 210Extending the site 211Summary 211

Chapter 11: Weird Hap'nins—Building a News Aggregating Site 213

Build Weird Hap'nins 215Template 215Extensions 215Sections and categories 216

Create a new section 216Create new categories 217

Table of Contents

[ vii ]

Feed content 217Configure the 4RSS component 218Configure JCron Scheduler 220Add articles 222Configure the front page 222Other menus 223

Finishing up 225Summary 227

Appendix: Templates and Extensions 229Index 233

PrefaceThis is a starter book about building websites with Joomla!—and having fun while doing so. It is not a book for professional developers. The typical user of this book may only ever build a couple of websites—one for business and one for a hobby, and perhaps another for a friend, just to show off! This book will enable you to build 10 simple web projects within hours—without having to pay a developer to do it for you. Therefore, it is not a text book but an activity book with a lot of screen illustrations to make your project fun to build.

This book is not designed to make you an expert Joomla! developer. It will not even bring you close. The objective, however, is to make it possible for almost anyone with just a bit of Joomla! knowledge to build a complex website by mixing the individual projects together. Instant Joomla!!

What this book coversThe hands-on example projects in this book are based on fictitious website development briefs, and they illustrate practical ways of applying Joomla!. A chapter is dedicated to each example website project. Each chapter contains a fictitious brief from which is derived the list of core and contributed extensions that will be required to implement the project. Except for Chapter 1, all of the other chapters are independent of any other chapter in the book and should be taken as a single project module.

In Chapter 1, basic details about installing and configuring Joomla! for use on both local and remote servers are provided. This chapter also contains information about where to obtain essential resources for learning, using, and optimizing Joomla!

Preface

[ 2 ]

In Chapter 2, Buzzy Beez is a small company that intends to put information about their business and products on the Internet. They are looking to build a website that will capture the company's main information for use by clients and customers, so that Buzzy Beez can cut the costs of printing brochures, catalogues, and other essential promotional literature.

In Chapter 3, the Global Hitchhikers Club is an online club for hobos and compulsive travelers. The purpose of the club website is to enable members to keep an online blog of their travels, and to provide a means for advising other club members on their own travels.

In Chapter 4, The Daily Joomer is the only newspaper in Joomlaburg, and it has a local circulation. The intention of this website is to replicate the content of The Daily Joomer online, in a way that will enable the online edition to be easily updated on a real-time basis.

In Chapter 5, "Electric" Skid Jackson is a retired break-dancer and a full-time choreographer and owner of the Def Freeze dance crew. Skid has an idea for a website where all of the street dance events from all over the world can be listed according to their location, so that he can be the first to know what is shaking.

In Chapter 6, Tony Tortilla is a student at Joomlaburg University. Tony thinks that the University's social life can be vastly improved if the University had its own community website where the students can get to know each other a little better.

In Chapter7, Joomgets Inc. is the foremost manufacturer of custom-made widgets in Joomlaburg. Their widgets have won awards internationally and are considered to be vastly superior to other mass-produced widgets, manufactured by so many unscrupulous garage factories. In order to consolidate their success, Joomgets have decided to set up an online e-commerce store to sell their widgets.

In Chapter 8, Wally Fishbourne has the idea to create an online directory where people can post details of accommodation available for rent, share, and sale all over Joomlaburg. He is looking for a simple directory with listing and display features, rather in the style of Gumtree and craigslist.

In Chapter 9, William and Elizabeth Bunter are organizing an online food appreciation community. They intend to enroll members from all over the world to share their food photos on a new website, where users will submit photos of their food for all other members to admire and rate.

Preface

[ 3 ]

In Chapter 10, Winston Groovy returned home to his wife, Rita, in Kingston, Jamaica after being missing for two days, claiming to have been abducted by aliens. So Rita Groovy has decided to create a website to aggregate occurrences of alien sightings all over the world, in order to save other people the heartache of having their loved ones permanently lost to extra-terrestrial kidnappers.

In Chapter 11, bad news is always good news for the press. Vaughan Pyre has decided to take advantage of this and create a website that will aggregate bad news and weird happenings from all over the world. The content of the site will be entirely derived from RSS feeds from several sources, with each feed being automatically retrieved and its items displayed on the website.

In the Appendix to this book, you will find a list of modules and themes used in this book as well as links to their project pages.

What you need for this bookAll of the projects in this book are based on Joomla! 1.5. A list of the contributed extensions employed, and links to their project pages, is provided in the Appendix.

Who this book is forThis book is for anyone who wants to build a Joomla! site for business or for pleasure, and also for those who want to see how to apply the many available Joomla! core features and extensions in different scenarios. If you are looking to develop a professional quality website by using the Joomla! Framework, this is a great book to help you get started.

However, this book is not a "dummies" book, and users are advised to familiarize themselves with basic Joomla! terminology and operations, such as creating content, and uploading and enabling templates and extensions. Some installation and configuration details are provided in Chapter 1, and users are also encouraged to visit the Joomla! project site (http://www.joomla.org/) where ample help exists in the form of both documentation and a very active users' forum. Some other sources of Joomla! help are also listed in Chapter 1.

ConventionsIn 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.

Preface

[ 4 ]

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: "To create these new categories, click on the Categories button in the Control Panel."

Warnings or important notes appear in a box like this.

Tips and tricks appear like this.

Reader feedbackFeedback 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 from.

To send us general feedback, simply send an e-mail to [email protected], and mention the book title in 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 via the SUGGEST A TITLE form on www.packtpub.com, or send an e-mail to [email protected].

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 supportNow 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.

Preface

[ 5 ]

ErrataAlthough 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 to improve subsequent versions of this book. If you find any errata, please report them to us 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 to our website, and 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.

PiracyPiracy 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 [email protected] with a link to the suspected pirated material.

We appreciate your help in protecting our authors and our ability to bring you valuable content.

QuestionsYou can contact us at [email protected] if you are having a problem with any aspect of the book, and we will do our best to address it.

Installation and ConfigurationLike every other endeavor in life, there are two ways of installing Joomla!—the easy way and the difficult way. In order to do it the difficult way, you will need to set up your server by yourself before you proceed with the installation. You have the choice of environment to use for your new installation: you may install directly to a live server or you can set up a test environment on your local computer.

Minimum system requirementsA fully-operational web server (preferably Apache) is required to successfully install and use Joomla!. You also need a database (preferably MySQL) and the server-side scripting language PHP, together with specific modules for MySQL, XML, and Zlib functionality, which are activated within PHP amongst others. Following are the minimum versions of these server components that are required:

Software Minimum requirement

Recommended Latest options

Website

PHP 4.3.10 4.4.7 5.x.series http://php.net

MySQL 3.23.x or above 5.x series http://dev.mysql.com/ downloads/mysql/5.0.html

Apache 1.3 or above 2.2 series http://httpd.apache.org

Installation and Configuration

[ 8 ]

Installation on a local computerThere are a number of ways to set up a test environment on your own local computer. Most time-pressed developers will install and configure directly onto a live server, but there are good reasons for running your application first on a local development server:

Developing your application locally allows you to work on it even if you are not connected to the Internet.The experience that you gain from getting your local server running on a simple installation like WampServer for a machine running Windows, or MAMP for a Mac, will make it easier for you to understand server processes and databases. This knowledge will certainly pay off as you get deeper into Joomla!.The Web is constantly scanned and archived by various search engines, and so will everything that you put on the Web. This information will be around for quite a bit of time and you certainly don't want Google to display your inevitable learning mistakes for the world to see.

Installation on WampServerWampServer2 enables you to run Apache, MySQL, and PHP on Windows, and is available for free. You can download it from http://www.wampserver.com.The WampServer2 package comes with the following components already configured to work together:

Apache 2.2.11MySQL 5.1.30PHP 5.2.8

There are similar packages that already include Joomla! (such as DeveloperSide and WDE). However, note that these may not always have the latest secure version of Joomla!. Therefore, it is better to use WampServer2 and load it with the Joomla! version of your choice.

WampServer2 is self-installing. Just double-click on the icon after you've unpacked your zipped download and follow the installation instructions. This gets your development environment ready in just a few minutes. Now let the fun begin!

•

•

•

•

•

•

Chapter 1

[ 9 ]

Installing Joomla! 1.5 on localhostInstalling Joomla! on localhost can be remarkably straightforward:

1. Download the latest stable release of Joomla!, and unzip the discernible Joomla! 1.5 folder. You will need to use a tool such as WinZip for Windows (http://www.winzip.com) to perform this task. Another free alternative to WinZip is IZArc (http://www.izarc.org/).

2. Locate the directory in which WampServer2 is installed on your computer. This will usually be the root of your computer's main directory (usually C:\) and in a folder named wamp. Open it, locate the www folder, and copy your Joomla! 1.5 folder into it. Name the Joomla! folder as per your preference. In the unlikely scenario that you will be installing only one Joomla! test site on your local machine, you may—just for the sake of living to a ripe old age—name it Joomla.

3. Navigate to your computer desktop taskbar tray, click on the WampServer icon, and select the Start All Services option (if this has not yet been selected).

4. Then open your browser and navigate to http://localhost. This will display the main WampServer2 interface and you will see your project, Joomla, listed under Your Projects.

5. However, because Joomla! needs a database to run, you must create the database for our project. Click on the phpMyAdmin link. This will display another interface, this time for phpMyAdmin. Enter the name of your new database in the Create new database field. For the simple reason that we shouldn't live a complicated life, we have given this database the same name (Joomla) as our project and our installation folder. We are now ready to install Joomla!.


[ 10 ]

6. Joomla! has an automated installation script that automatically populates database tables. The installation script will set the base URL, connect Joomla! to the database, and create tables in the database. Navigate to http://localhost/Joomla and start your installation.

7. You will be presented with a step-by-step guide to the installation in the later pages.

Page 1: Choose LanguageThis page asks what language you want to use for the installation.

We select English as the language of choice. Click on the Next button to continue with your installation.

Chapter 1

[ 11 ]

Page 2: Pre-installation CheckChecks are made by the installation script on server configuration. If any of these items are not supported (marked as No), then your system does not meet the minimum requirements for the installation of Joomla!, and you should take the appropriate actions in order to correct the errors.

Failing to do so could lead to your Joomla! installation not functioning properly. You are not likely to face this problem on your local installation, and if you do, it can be quickly fixed.

Page 3: LicenseThe License page is just a page of legalese that the developers of Joomla! really think you must read. It tells you the conditions for use of the free software and also spells out liabilities. Primarily, if the Joomla! installation makes your computer to explode or you start acting funny after you are done with the installation, the suppliers of Joomla! will accept no liability. After correcting any host-specific errors and reading the license, you will be directed to the Database Configuration page.


[ 12 ]

Page 4: Database ConfigurationOn the Database Configuration page, you specify the database where Joomla! will store and retrieve data.

Select the type of database from the drop-down list. This will generally be mysql. Also, enter the hostname of the database server that Joomla! will be installed on. This may not necessarily be the same as your web server, so check with your hosting provider if you are not sure. In the present case, it will be localhost. Now enter the MySQL username, password, and database name that you wish to use with Joomla!. These must already exist for the database that you are going to use. We have already determined this when we created the database. Here are the values for our present project:

Host Name: localhostUsername: root (unless you have changed it)Password: Leave blank (unless you added a password when you set up your database)Database Name: Joomla (or whatever you have called yours)

•

•

•

•

Chapter 1

[ 13 ]

Table Prefix: If you are installing more than one instance of Joomla! in a single database, then give one of them a prefix (such as jos2_), or else the second instance will not install. Otherwise, you may safely ignore this.

Click on the Next button to continue.

Page 5: FTP ConfigurationYou can safely omit this step and go on to the next page. But if you do decide to carry out this step, do take notice of the following requirements:

As explained on this Joomla! installation page, due to file system permission restrictions on Linux and other Unix systems (and PHP Safe Mode restrictions), an FTP layer is used to handle file system manipulation and to enable Joomla! installers.You may enter an FTP username and password with access to the Joomla! root directory. This will be the FTP account that handles all of the file system operations when Joomla! requires FTP access to complete a task.

However, for security reasons, if the option is available, you are advised to create a separate FTP user account with access to the Joomla! installation only and not to the entire web server.

•

•

•


[ 14 ]

Page 6: Main ConfigurationThis is where you define your site's public identity.

Chapter 1

[ 15 ]

The descriptions of the fields are as follows:

Site Name: Enter the name of your Joomla! site.Your E-mail: This will be the e-mail address of the website Super Administrator.Admin Password: Enter a new password and then confirm it, in the appropriate fields. Along with the username admin, this will be the password that you will use to login to the Administrator Control Panel at the end of the installation.Install Sample Data: It is strongly recommended that new Joomla! users install the default sample data. To do this, select this option and click on the button, before proceeding to the next stage.

Page 7: FinishThat's all! Your installation success screen will be displayed. Congratulations, you are now on your way to becoming a Joomla! Guru.

•

•

•

•


[ 16 ]

Once the installation script has successfully been completed and you have removed the installation folder, you will be directed to the Joomla! Administration login page—if you want to immediately perform administrative functions on your new site. Otherwise, clicking on the Site icon will direct you to the front page of your site showing all of the sample data—if you have loaded it.

Chapter 1

[ 17 ]

That is the most of what you need to know about installing Joomla!.

Installing Joomla! on a remote serverThe steps for performing this installation are essentially the same as for installing Joomla! on a local machine. Some other hosting packages will come with one-click installation tools such as Fantastico—a commercial script library that automates the installation of web applications to a website. Fantastico scripts are executed from the administration area of a website's control panel, such as CPanel. The scripts typically create tables in a database, install the software, adjust permissions, and modify the web server's configuration files.

Although they may look like a godsend, Fantastico offered by hosting providers does have several minuses:

The installation scripts may not be frequently maintained by the hosting companies. Therefore, you may find that you have installed older releases of products along with their known security problems.Your script will be installed with the default configuration, which may not be secure. Thus it may, for example, be easier for spammers to write automated scripts to post spam messages on websites.In their eagerness to improve the user experience and heighten security, some hosting companies may wish to share an update as soon as a new release is available. Advanced Joomla! users know that it may be wise to wait until major security and functionality issues are fixed.

Other installation possibilitiesInstalling Joomla! on a remote server without Fantastico is quite similar to the localhost procedure. The method of creating a database varies greatly across hosting companies, and you are advised to contact the hosting company if there is any confusion as to how to go about doing this.

In order to install Joomla! on a non-Windows localhost, and for troubleshooting the installation, adequate documentation exists on the project website, at http://www.joomla.org, where an active forum exists with answers to virtually every problem that may be encountered during installation.

•

•

•


[ 18 ]

Manual installationThe methods discussed so far concern web browser installation. However, in certain, very rare instances, it may be difficult to perform a browser installation. This problem can be solved by the manual process, in which you will need to open up some system files and change the variables by yourself. It is a difficult process and it is quite easy to get it wrong. Some detail of how to go ahead with this method can be found at http://help.joomla.org/content/view/1944/302/.

For other common installation issues and errors, and how to resolve them, please refer to http://help.joomla.org/content/view/1945/302/.

Configuration and backend administrationOnce the installation script has successfully completed and you have removed the installation folder, click on the Admin icon and you will be directed to the Joomla! Administration login page. Alternatively, the admin login page can be accessed through the URL http://yoursitename/administrator, and in our installation through http://localhost/Joomla. Enter your username and password, and you will be taken to the main Control Panel, from where you can oversee the functions of your site.

Congratulations on choosing Joomla! as your content management system!

Chapter 1

[ 19 ]

Trim off sample dataWhen you are installing Joomla! 1.5 from the Full Package, you are given the option to also install the sample data. If you have chosen this option, you will find that your website has been preloaded with sample sections, categories, articles, and modules. Even though they could make your work faster, much of this data is actually superfluous and may even confuse you.

To prune the sample data, visit the Article Manager page from the Administration Control Panel, and feel safe to trash all of the 43 sample articles that you will find there. You must complete the deletion by navigating to the article Trash Manager from Content | Article Trash from the top toolbar. After this you can go to the Category Manager from the Control Panel and similarly delete all of the sample categories. Perform the same process with all of the sample sections by visiting the Section Manager from the Control Panel.

Now navigate to the Module Manager page from Extensions | Module Manager, and make sure that you deselect all of the modules that you don't need. You may really need only the Main Menu, User Menu, Login Form, Popular, Top Menu, and Search modules. You may play safe by not deleting the rest, as you may need some of them someday.


[ 20 ]

While you are at it, also navigate to the Menu Item Manager page via Menus | Main Menu from the top toolbar. On this page, trash all of the extraneous menu items except the Home menu. You will need to complete the deletion from the menu item's Trash Manager page from Menus | Menu Trash.

Finally, you can visit the Menu Manager page to delete all other menus except the Top Menu, User Menu, and Main Menu—although this may not be necessary.

Create a new sectionTo create a new section, perform the following steps:

1. Navigate to the Section Manager from the Control Panel and click on the New icon at the top right to create a new section.

2. In the page that opens, enter the name of the section, and then save your changes.

Create new categoriesYou may need to organize your articles into categories in order to group similar articles together.

To create a new category, perform the following steps:

1. Navigate to the Category Manager page from the Control Panel.2. In the page that opens, create a new category in the same way as you created

a new section. Select the Section to which the category belongs.

Extending your Joomla!Joomla! comes enabled with some basic functionalities. However, you may need your website to do more than the basic things—in which case you have to build in some extensions. There are components, modules, and plugins that you can locate at the extensions site, http://extensions.joomla.org. Some of these extensions are commercial, but most are free. There appears to be a Joomla! extension for just about every imaginable purpose. However, make it a point to use them sparsely, as too many extensions on a single site may actually slow down your site and make it impossible to use. There are a few extensions that are, however, worth mentioning, even though they may be more for advanced users.

Chapter 1

[ 21 ]

Content Construction Kit (CCK)The out-of-the-box Joomla! page is rather basic, and you have to be content with the article title and body, and the section and category, which can sometimes be really upsetting. Suppose that you want to be able to upload files and tack them onto the articles, or have sub-categories. This is where this group of extensions comes into play. CCK enables you to create and customize new content types, and can make the difference between a plain-looking site and a very sophisticated one:

http://extensions.joomla.org/extensions/news-production/content-construction/9128

Modules AnywhereThe Modules Anywhere extension enables you to include a single module or complete module positions anywhere in your site, including inside third-party components and even inside other modules. You may really never need it, but you never know:

http://extensions.joomla.org/extensions/core-enhancements/ embed-a-include/6402

Cron SchedulerThe Cron Sc heduler is a Joomla! component that enables you to run cron jobs on your site at preset periods of time. The purpose is to simulate cron jobs through the Joomla! frontend interface for users who either don't have access to the server crontab or don't want to use it:

http://extensions.joomla.org/extensions/administration/admin-performance/847

Learning Joomla!The following are some resources to get you up to speed with your Joomla! experience:

Absolute Beginner's Guide to Joomla!:http://docs.joomla.org/beginners

Quick Start to Joomla!:http://help.joomla.org/ghop/feb2008/task048/joomla_15_quickstart.pdf

•

•


[ 22 ]

Quick Start to Joomla! video:http://help.joomla.org/ghop/feb2008/task167/index.html

The Joomla! Community Magazine:http://community.joomla.org/magazine/view-all-issues.html

also has articles for new learners:http://community.joomla.org/magazine/article/522-introductory-learning-joomla-using-sample-data.html

Joomla! Frequently Asked Questions (FAQ):http://docs.joomla.org/Category:FAQ

Joomla! Forums:http://forum.joomla.org/

Joomla! Help site—installation manual:http://help.joomla.org/content/category/48/268/302/

Joomla! Quickstart—installing XAMP:http://help.joomla.org/ghop/feb2008/task167/xampp.html

Joomla_1.5_quickstart.pdf:

http://help.joomla.org/ghop/feb2008/task048/joomla_15_quickstart.pdf

Basic AdministrationMuch of the functionalities of the Joomla! site can easily be accessed through the admin Control Panel, as well as via the top menu bar and drop-downs. The titles of the icons and admin links are quite intuitive and easy enough to understand. Here is a list of some other things that you may easily do in the Control Panel:

•

•

•

•

•

•

•

Chapter 1

[ 23 ]

Template settingsYou may change your default template by navigating to the Extensions | Template Manager link at the top of the Administration page.

All you need to do is select your new template and click on the Default icon. To upload a new template, navigate to Extensions | Install/Uninstall.

If you click on the template title in the Template Manager page, you will be presented with the Template: [Edit] page, where you can change the properties of the template, if you have sufficient HTML/CSS skills.

You can change the colors, images, and size of the panels, as well as many other attributes of the selected template, from this page.


[ 24 ]

Global configurationYou can modify the settings that apply generally to the site from Site | Global Configuration. You may want to specifically pay attention to the Offline Message—the screen message that will be displayed when you have taken your site offline for maintenance—as well as the Global Site Meta Description and Global Site Meta Keywords, which will decide how browsers describe your site and how search engines will index it.

You may also change system-related parameters, such as User Settings, which are used to determine if the site is private or open to other contributors as well as the privileges given to such users. Additionally, you may modify the Server Settings that you set when installing your site.

Site backupIt is important to always back up your site, especially when it is live. This can prevent a major disaster if, for some reason, you lose your server. There are several extensions that may help you do this efficiently. Do try the following:

http://extensions.joomla.org/extensions/access-a-security/backup

Chapter 1

[ 25 ]

Optimizing your siteWhen a user performs a task on your Joomla! site, a query is sent to the database. If it is for a page request, then all of the raw data needed to display this page is retrieved from the database. The browser then attempts to put the data together with all of the other elements of the page, such as the CSS code, JavaScript, images, Flash, and other objects. The speed with which your requested page loads will be constrained by server efficiency, Internet connection, and also the size of the individual extensions of the page that are being assembled. Large files, such as Flash, video, and large images, could take quite a bit of time to load, especially over a slow connection.

Thankfully, there are some native Joomla! settings and optimization techniques that can improve the browsing experience of your site user. Consider the following scenarios:

Your site has more than just a few extensions installed. Many of these extensions will typically have their own CSS and JavaScript files, and so the browser is given the unenviable task of first fetching these individual files from wherever they may be and then properly interpreting them before serving the page to the user.Your site has heavy traffic and each user is making requests to the database at the same time as the other users. The database is, however, not limitless; it is like a machine, and a machine that is put under too much stress eventually breaks down.

Joomla! is able to reduce the load on the database by storing cached pages that have previously been requested by other users. When these pages are requested again, they are simply passed on to the user from the cache, without the need for making a new request to the database. However, the caching feature is disabled by default, primarily because it could affect other configuration. A couple of native Joomla! tools that may improve performance are the System cache and also Gzip features.

System cacheSystem cache may be accessed from Site | Global Configuration. Another way is to enable the System - Cache plugin from the Plugin Manager. Enabling the cache will often offer a significant performance boost. Cache might not agree with Cyrillic and special characters.

•

•


[ 26 ]

GzipTo enable Gzip compression on your Joomla! website, navigate to the site's Global Configuration page and then to the Server tab. Set GZIP Page Compression to Yes.

HTML pages sent to your browser can be compressed using Gzip compression. Most web servers support Gzip compression, which can shrink your site's pages by 70 percent to 90 percent. This will result in reduced bandwidth and faster page loads for your visitors. However, Gzip compression will also use more of your server's processing power. Try enabling Gzip and see if your site loads any faster. If it doesn't, or if you get CPU warnings from your host, disable Gzip. It may hurt your website, but it most often helps it.

Other optimization techniquesThere are a few other optimization techniques that may come in handy. Some of these are listed in the following sections.

TemplateMost templates use many separate images to display a page. Each image generates a new HTTP request. The problem becomes larger when those images are not small in size and are not optimized. You can run your site through the Website Analyzer at http://www.websiteoptimization.com/services/analyze/index.html to determine how your templates perform, and then make the recommended changes to improve your templates’ performance.

ComponentsJoomla! appears to have at least one component that is available for almost any task that you require. However, most of these components are not very efficient and may dramatically slow down your site. Typically, the more the functionality that a component offers, the more it is likely to slow down your site. Choose an extension that does just the task that you need to be done and nothing else.

Chapter 1

[ 27 ]

SEFSEF makes your site URL's look much better. The Joomla! core does an acceptable job, but keep in mind that using SEF URLs is a trade-off. A good URL will look better to a search engine and to end users, but it hurts the load time. Think carefully before deciding to enable SEF URLs. This is, however, just a suggestion, because some people do have the conviction that search engine ranking is far better than load time. In the final analysis, you may find it more useful to work on the template and other assets.

SummaryIn this chapter we have learned:

To install Joomla! 1.5 on a local computer To install Joomla! 1.5 on a remote serverTo configure Joomla! at the backend To create and organize contentBasic Joomla! administrationTo extend basic Joomla!

•

•

•

•

•

•

Buzzy Beez—Building a Company Site

Buzzy Beez is a small company that intends to put information about their business and products on the Internet. They are looking to build a website that will capture the company's main information for the use of clients and customers, so that they can cut their costs of printing brochures, catalogues, and other essential promotional literature. Buzzy Beez want their website to have:

An "About Us" page describing their businessA repository from where the company's brochures and software can be downloadedA "Latest Company Information" blog to tell the world what the company is currently doingA Contact form that site visitors can use to send e-mails to Buzzy Beez

•

•

•

•


[ 30 ]

The finished website should look similar to the following screenshot:

Build Buzzy Beez's siteTo build the website for Buzzy Beez, we will:

Create an "About Us" pageCreate a new documents repository called "Downloads", in which Buzzy Beez can list and upload all of their brochures, software, and so onDisplay a page view of the list of publicationsCreate page views of information about the company and products, submitted as blog postsCreate a simple Contact formCreate a simple menu to link to the content

••

••

••

Chapter 2

[ 31 ]

TemplateBuzzy Beez has chosen the beez template (which is a Joomla! community-contributed template) because it resonates with their business name, and also because it has font resizing, which is a great accessibility feature. The front page will feature a teaser for the Buzzy Beez "About Us" page.

ExtensionsIn order to create the desired website, we will be using some essential Joomla! components and modules.

Core extensionsThe following optional core component and module will be required for our new site. These are already installed with Joomla! and therefore do not have to be downloaded:

Contacts component—will allow site visitors to send messagesMain Menu module—will provide the primary navigation menu for the website

Contributed extensionsThe following contributed extension will also be used. It can be downloaded from the Joomla! extensions site (http://extensions.joomla.org):

DOCman component—is a document management and download system for Joomla!. With this component, users can easily upload and manage files across multiple categories, and make them available for download.

The document management system, DOCman, is not the only extension of its type on the Joomla! extensions download site. It has been chosen primarily because it is more highly recommended than the others, and the version used is free.

•

•

•


[ 32 ]

Install a new templateThe beez template is usually distributed with the full package Joomla! 1.5 download. However, if your download does not have this template included, you can get it from a Joomla! themes website such as Joomla24 (www.joomla24.com). To install the template on your website, perform the following steps:

1. Log in to your Joomla! Administration area, and then select Extensions | Install/Uninstall.

2. Select the Beez file from your computer, or from another location, and upload it as shown in the following screenshot:

3. Navigate to Extensions | Template Manager.

Chapter 2

[ 33 ]

4. Select the beez template and set it as the default template, as follows:

Basic contentThe Buzzy Beez's site is quite basic. The About Us page can be safely created as Uncategorised content, and this is the task that we will perform next. However, we have included the document management system feature to add an element of excitement to the project.

Create the About Us pageThe About Us page, as we have decided, should be quite straightforward and will be created as Uncategorised, which is the usual way to treat static content.

1. Navigate to Site | Control Panel in the Administration area, and then click on the Add New Article button. This will display a form similar to the one shown in the following screenshot:


[ 34 ]

2. The handy What You See Is What You Get (WYSIWYG) editor, which is an emulation of desktop software such as Microsoft Word and OpenDoc (which most people will be accustomed to), makes it easy for the website administrator and other permitted users to create information pages, and format them to their satisfaction.

3. You can now add some text and an image, and then save your changes. The About Us page is done. Note that in the following example we have inserted a Read more line to force the front page to display only a teaser for this article:

Chapter 2

[ 35 ]

4. When you promote this article to the front page after creating it, a preview of the front page will be similar to the one shown in the following screenshot:


[ 36 ]

Create Latest Information postsThe Latest Information blog posts will be created in the same way as the other Content types. However, these posts will not be uncategorized. Buzzy Beez will present this information under two categories: Company News and Product News. You will create a new content Section and name it Latest Information, and will also create two content Categories under this Section and name them Company News and Product News respectively. To accomplish this, perform the following steps:

1. Navigate to Content | Section Manager in the Administration area, and then select the New button at the top right-hand side.

2. Add a Latest Information section by completing the form that is presented, as follows:

Chapter 2

[ 37 ]

3. Now navigate to Content | Category Manager. Click on the New button and similarly create the Company News and Product News categories under the Section called Latest Information. In the end, the Category Manager panel should look similar to the following screenshot:

4. You will now add some posts to the Latest Information section. In order to do this, click on the Add New Article button in the Control Panel. In the form presented (shown in the following screenshot), add fresh articles in both the Company News and Product News categories as follows:


[ 38 ]

Create the document repositoryThe document management system will be created using the DOCman component. To do this, you will get this extension from the Joomla! extensions download site (http://extensions.joomla.org), and upload it to the Buzzy Beez site via the Extension Manager page. Depending on the version that you have uploaded, you may need to enable the Legacy plugin from the Extensions | Plugin Manager page. If this plugin is required, you will be prompted to install it during the installation process.

After a successful upload, you will see a page similar to the following screenshot. Click on the Add Sample Data button, to complete your installation:

Chapter 2

[ 39 ]

After you have completed this step, you should get a new Control Panel for the DOCman document management system. The new DOCman Control Panel can also be accessed from the Components | DOCman | Home tab.

We will leave the Configuration of DOCman at the default setting since there is, at this time, no real reason to change it. However, we need to create two new Categories for the documents that will be available for download—Software and Brochures. To do this, we will perform the following steps:

1. From the DOCman Control Panel page, select Categories. In the page that is displayed, select the Add button at the top right-hand side. Fill the form that is presented, in order to create a new category, as follows:


[ 40 ]

2. Create the category Brochure in the same way.3. Delete the Sample Category that was installed with DOCman, taking care to

delete the contents of this category first.

Now you can start adding the downloads into DOCman. To add the downloads, perform the following steps:

1. Navigate to the DOCman Control Panel, and then click on the New File button. This will take you to a page that requires you to indicate the location of the file to be added. In the following example, we have chosen to link from another server:

2. You can now create new files for download from the form obtained, by clicking on Make a new document entry using this file, as shown in the following screenshot:

Chapter 2

[ 41 ]


[ 42 ]

Ensure that the uploaded documents are marked Approved and Published, or else the document repository will show empty.

Create a Contact formThe Contacts component of Joomla! provides for the quick creation of multiple site contact forms that can be selected based on the category of the recipient. We can access this component from Components | Contacts in the Administration toolbar. This will lead us to the Contact Manager page.

On this page, you will select the Categories tab, in order to add a recipient category. You will only be adding a single Category, called General, as follows:

Chapter 2

[ 43 ]

In the same way, you can now select the Contacts tab in the Contact Manager pane, in order to add a new contact to the General category. You will name this new contact Front Office. In our example, we have linked this contact information to the website administrator because we want all of the mail to be directed to their inbox:


[ 44 ]

Display contentNow begins the real fun part—displaying our content through a menu. You have learned much of what is required to post content onto the Buzzy Beez website. We will now take a look at how we can view the content that we have entered.

Visit the modules page by navigating to Extensions | Module Manager, and on this page make sure that the Main Menu module is enabled:

Now navigate to Menus | Menu Manager from the administrator toolbar. This will display a menu list that has the Main Menu as the only entry, but this is all that we need. If you click on the icon (shown in the following screenshot) under the Menu Item(s) column for the Main Menu, you will be directed to another page:

Here you will see that the only menu item available, at this time, is Home, which links to the Home page. What we intend to do is to add new menu items for the About Us page, the Latest Information categories, the Downloads page, and the Contact form.

Chapter 2

[ 45 ]

Add an About Us linkTo add the About Us link to Main Menu, perform the following steps:

1. Click on New on the top right-hand side bar, in order to add a new menu item.

2. Select Articles, and from the expanded menu tree, select Article Layout.


[ 46 ]

3. On the menu item page, we will fill in the desired menu title as follows:

4. If we click on the Select button on the right-hand side panel, it will display a superimposed screen. On this screen, we can select the article that we want—in this case the About Us article—and then save the page:

Chapter 2

[ 47 ]

If we navigate to the Menu Item Manager page, we will see the new About Us menu link under the Home menu link.

Add the Product News linkTo add the Product News link, perform the following steps:

1. Navigate to the Menu Item Manager page for the Main Menu, and then select the New button.

2. On the subsequent screen, select Articles and then Category Blog Layout. This will ensure that when this particular menu link is clicked on, it will display the articles posted under the Product News category as a blog list rather than as a list of titles:


[ 48 ]

3. Now enter the menu Title, and select the Category for the menu, on the following page. Modify the display style if you wish to:

In the Menu Item Manager page, you will see that a new menu item, Product News, has been added.

Add the Company News linkYou can repeat the previous procedure to add a Company News menu link. This time, select the Latest Information/Company News as the Category source.

Chapter 2

[ 49 ]

Add a Downloads linkTo add a Downloads link, perform the following steps:


2. In the screen that is displayed, select DOCman. In the subsequent page (shown in the following screenshot), fill in the menu Title, and then save your changes:

In the Menu Item Manager page, you will see that a new menu item, Downloads, has been added.


[ 50 ]

Add a Contact us linkTo create the Contact us link, perform the following steps:


2. In the screen that is displayed, select Contacts and then Standard Contact Layout. In the subsequent page, fill in the menu Title, and then save your changes:

On the Menu Item Manager page, you will find that a new menu item Contact us has been added.

Chapter 2

[ 51 ]

Finishing upIf you now preview all of the pages, you will see that the Buzzy Beez's company site has been completed.

The Downloads and Contact us pages will look similar to the following screenshots:

The Home and About us pages will look as follows:


[ 52 ]

The Product News and Company News pages will look similar to the following screenshots:

SummaryIn this chapter, you have learned to:

Build a basic site for any purposeCreate a document repository by using the DOCman componentCreate new content Sections and CategoriesOrganize your content for display by using the Main Menu module

In real life, you may have more content pages that are linked to the menu and a larger number of content sections and categories, but the procedure basically remains the same.

•

•

•

•

Global Hitchhikers Club—Building an Aficionado's Site

The Global Hitchhikers Club is an online club for hobos and compulsive travelers. The purpose of the club website is to enable members to keep an online blog of their travels and to provide a means for advising other club members on their own travels. In their blog, club members will describe the places where they've been, including the sleeping and eating facilities, as well as the disposition of the natives. Club members can also upload photos.

The Global Hitchhikers Club website will have the following distinguishing features:

Members will be able to create blog entries, categorized by the continent, and be able to post photos into these entriesThe latest blog entries will automatically be promoted to the front pageSite users will be able to comment on these blog entriesLinks will be provided to show page views of blog entries, categorized by continent

•

•

•

•

Global Hitchhikers Club—Building an Aficionado’s Site

[ 54 ]

The final layout of the Global Hitchhikers Club website can be seen in the following screenshot:

Chapter 3

[ 55 ]

Build the Global Hitchhikers Club sitePicture Desperate Dan the hobo, sitting on a park bench in central Timbuktu, with his trusty laptop beside him. After locating a free Wi-Fi hotspot, he proceeds to report back to the rest of the club via the website about his journey so far: his present location, how he successfully completed his travels, and the best way to get free amenities such as meals and liquor at his destination.

In order to enable this website to function successfully, we need to do the following:

Select the components and modules necessary to implement the required functionalities, and configure themCreate selectable blog categories for Desperate Dan to use to describe the continent in which he has found himselfCreate a comments system for other site users to add comments to the blog entriesCategorize and organize all of the content in a logical way, in order to enable it to be easily accessed and read

TemplateThe template chosen for the Global Hitchhikers Club website is rhuk_milkyway (a Joomla! 1.5 core theme) because it is simple and quite adaptable.

ExtensionsThere are often several ways of getting the same result in Joomla!. Each method undoubtedly requires different combinations of contributed and core extensions. From the tasks presented by this project, we are able to build a list of core and contributed extensions that will be used.

•

•

•

•


[ 56 ]

Core extensionsFor the purpose of this website, we will be using the following core modules and components:

Search component—enables site-wide searches by keywordMain Menu module—provides a menu item that links to the front pageUser Menu module—provides a way to make specific menu items visible only to registered and logged-in users (such as the link to post articles)Login Form module—is used to allow registered users to log in and to allow others to registerPopular module—displays the most popular articles, inside a blockTop Menu module—is a horizontal menu to be placed in the top portion of the siteSearch module—is a block to facilitate searching the articles and other items on the site by key words

Contributed extensionsThe following contributed extensions need to be obtained and uploaded for use in this project. These contributed extensions were selected from the Joomla! extensions site (http://extensions.joomla.org) because they were more highly recommended than the others:

JComments component—a comments system that permits site users to add their comments to an articleJComments Latest module—displays a block of the latest comments created through the JComments component

Basic contentBecause this website demonstrates how to use the Joomla! framework as a multiple user blog, the main challenge is to categorize the content in a way that will make it easily accessible. But before we do this, let us first define the users and how they will be registered.

•

•

•

•

•

•

•

•

•

Chapter 3

[ 57 ]

User settingsThe basic user settings can be found on the Global Configuration page as a link named System. In the page that opens (shown in the following screenshot), in the User Settings pane, change the New User Registration Type to Author. In this way, all of the registered users can now post blog posts. However, as these users are not Editors, they cannot publish the blog posts.

Configure the front pageWe want a simple front page display with only one column throughout and only two current articles fully displayed. To configure the front page for this display, navigate to the Menu Item Manager page, and then click on the lone Home menu link, which, as we see from the table, links to the Front Page.


[ 58 ]

In the page (shown in the following screenshot) that opens, we will change the parameters required to modify the front page, and then save your changes. We will use the following parameters for this example:

# Leading = 1# Intro = 2Columns = 1# Links = 4

Create a new sectionAll of our articles are made up of blog posts. Therefore, we will only be creating a single new section, which we will call Blogs. Obviously, if we have articles of other types, we will need to create more sections. To create our new section, perform the following steps:

1. Navigate to the Section Manager from Control Panel. Click on the New icon at the top right-hand side, in order to create a new section.

2. In the page that opens (shown in the following screenshot), enter the name of the section, and then save your changes.

•

•

•

•

Chapter 3

[ 59 ]

Create new categoriesOur blog entries will be organized into categories, in order to group entries together, according to geographical location (for example, Africa, South America, North America, Antarctica, Asia, Australia, and Europe).


[ 60 ]

In this case, we will need to create several new categories—one for each continent.

1. Navigate to the Category Manager page from the Control Panel.2. In the following page, create a new Category in the same way as you created

the new Section:

Chapter 3

[ 61 ]

Test the article submissionNow let us test our article submission and see how it works. To do this, click on the Add New Article icon in the Control Panel. You will get a form similar to the one shown in the following screenshot:

Add some blog posts to ensure that you have successfully performed the tasks, taking care to select the continent from which it is supposed to have originated.

We are adding all of our sample articles from the Administration Control Panel. However, in real life, we will make it possible for permitted users to add articles from the front page once they are logged in.


[ 62 ]

Create a comments systemThe comments system is required to enable users to add comments to the posted blogs. To create this system, obtain the JComments component from the Joomla! extensions site and upload it to your site. The initial installation screen should be similar to the following screenshot:

1. On clicking the Next button you should arrive at the Settings page for JComments.

2. In the General page, we will set where the comments system should be shown, and also how it will appear.

3. In the Categories pane, we will select all of the categories, thus enabling the comments form to be shown for all blog posts, site-wide.

4. In the Notifications pane, we select No, in order to allow comments to be published without the approval of the site administrator.

5. In the Miscellaneous pane, we select Yes, in order to enable both RSS feeds and plugins.

Chapter 3

[ 63 ]

We will, in this example project, leave all of the other settings in the other configuration pages with the default values. However, deselect Enable CAPTCHA in the Permissions page, to make submissions easier. In real life, CAPTCHA might be necessary, in order to deter spammers.Also, download and install the JComments Latest module. This module will automatically create a list of the most recent comments, in a box that can be placed in module positions on the site.

Module positionsWe need to move our active site modules to the desired position. To do this, navigate to the Module Manager page via Extensions | Module Manager on the top toolbar.

1. Enable the JComments Latest module. To position the module on the right-hand side, where we want it, click on the module title to open the module's settings page.

2. While you are at it, change the Title to Latest Comments.


[ 64 ]

3. On this page, change the Position to right (as shown in the following screenshot). Leave all of the other settings with their default values (unless you need to change any setting). Save your changes.

Perform the same steps to place other modules that need to be displayed, as follows:

Main Menu = leftUser Menu = leftLogin Form = leftPopular = rightWho's Online = rightTop Menu = user3Search = user4

You can adjust how each module appears in relation to another module in the same position by changing the Order number for each. Lower numbers display further up the screen than the others.

•

•

•

•

•

•

•

Chapter 3

[ 65 ]

Display contentWe will now create menu items that can be used to view the content that we have entered. As per our site's design, links to the articles under each continent are located in the Top Menu.

1. Navigate to Extensions | Module Manager, and on this page make sure that the Top Menu module is enabled.

2. Now navigate to Menus | Top Menu from the administrator toolbar. This will display a blank table. We intend to add new menu items for the continents of Africa, Asia, Australia, Antarctica, Europe, North America, and South America.


[ 66 ]

Add the Africa linkTo add the link for the blogs posted from the continent of Africa:

1. Click on New on the top right-hand side bar, in order to add new menu item.2. Select Articles, and from the expanded menu tree, click on

Category Blog Layout.

Chapter 3

[ 67 ]

3. On the Menu Item page, we will fill in the desired menu title, change any other page view display parameters that we need to, and save the menu link:

Add the other continent linksLet us again add other continent links:

1. As before, navigate to the Menus | Top Menu page to bring up the Top Menu and select the New button.

2. Follow the steps mentioned in the Add the Africa link section to create all of the other menu links.


[ 68 ]

If we now visit the Africa link in the Top Menu, from a preview, we will see the blog posts that have been posted from Africa.

Chapter 3

[ 69 ]

On clicking the Add new comment link, we are presented with a comment form, as shown in the following screenshot:


[ 70 ]

Finishing upIf we now navigate to the front page, we will see that the project is complete. We have now given Desperate Dan the hobo a new website on which he can share his travels with his pals worldwide.

Chapter 3

[ 71 ]

Improving the basic siteThis simple site has shown you how to use Joomla! as a blog site. The site could be made more interesting by adding other functionalities, such as a forum, a Twitter module, chats, and other collaborative features. However, these need to be considered carefully before use.

ForumAesthetically, although blogs and forums do not seem to be compatible, a forum adds some permanence to discussions, and threads can be picked up at any time. There are several good extensions for forums, depending on the functionality you require, available at http://extensions.joomla.org/extensions/communication/forum.

ChatChat integration enables real-time conversation for site users. However, the problem with using chat together with a blog is that the primary functionality of the site might be lost, as more chatting than blogging might end up being done. These extensions can be found at http://extensions.joomla.org/extensions/communication/chat.

Social bookmarkingSocial bookmarking can be an exciting addition, as it enables bloggers to create followers for their blog posts. There are several modules that enable you to display the status of your Twitter, Facebook, or other accounts on your site, and also a few components that post directly to social bookmarking sites. Social extensions can be found at http://extensions.joomla.org/extensions/social-web.

Blog extensionsThis class of extensions could easily create a blog site, as we have done, with less effort and more functionality added to it. Comment systems are already built-in, and most have integrated CAPTCHA functionality as well as an RSS feed. These extensions can be found at http://extensions.joomla.org/extensions/news-production/blog.


[ 72 ]

RSSJoomla! has a nice RSS feed module that creates a small RSS button at any position that you desire. To activate this feature, perform the steps below:

1. Navigate to Extensions | Module Manager | New.2. Click on Syndicate.3. When the new module page opens, give the module a title, and set Show

title to No.4. Choose a position appropriate to your template.5. In Menu Assignment, choose the page relative to your blog.6. Save and exit.

TemplatesJoomlArt has a template called JA Uvite for a Joomla!-based weblog (http://www.elsak.org/joomla-template/1038-ja-uvite-joomla-template.html).The template features some modules in its footer that you could use for related items, recent posts, and even for recent comments if you have a Joomla! comment component and attendant modules installed.


Build a basic site for publishing blog posts from multiple usersConfigure the JComments module to collect and display comments on articlesUse sections and categories to classify contentCreate menu items from categories

•

•

•

•

The Daily Joomer–Building a Newspaper Site

The Daily Joomer is the only newspaper in Joomlaburg, and it has a local circulation. The newspaper carries a variety of articles, organized into several categories:

NEWS

LocalWorldBusiness

SPORTS

FootballCricketGolfSnooker

OPINION

EditorialLetters

•

•

•

•

•

•

•

•

•

FEATURES

PoliticsArtsMediaScienceNatural HealthLawEducationFashionFood and DrinkAuto

•

•

•

•

•

•

•

•

•

•

The intention is to replicate the content of The Daily Joomer—online—in a way that will enable the online edition to be easily updated on a real-time basis. Typically, stories will be posted from all over Joomlaburg, and are approved by the Editor before they are promoted to be read.


[ 74 ]

In addition to the usual stories, it has been decided by the publisher to introduce some other community features that will encourage users to visit the website more often. So The Daily Joomer will also include a forum for readers to join in discussions on various topics.

The final layout of the The Daily Joomer website can be seen in the following screenshot:

Chapter 4

[ 75 ]

Build The Daily Joomer onlineThe primary challenges of this project will be to:

Normalize, categorize, and organize all of the content in a logical way, in order to enable it to be easily accessed and readSelect the extensions necessary to implement the required functionalities, and configure them

TemplateThe template chosen is the aptly-titled Newstheme, created by BuyHTTP, which can be downloaded from www.joomla24.com.

ExtensionsFrom the tasks that are presented by this project, we will be using the extensions listed in the following sections.

Core extensionsFor the purpose of this example, we shall be using the following core modules and components:

Search component—enables site-wide searches by keywordMain Menu module—gives a menu item that links to the front pageUser Menu module—allows selected menu items to be visible only to registered and logged-in users (such as the link to post articles)Login Form module—for registered users to log in and for others to registerPopular module—displays the most popular articles, inside a blockTop Menu module—horizontal menu to be placed in the top portion of the siteSearch module—block to facilitate the search of articles and other items on the site by keywords

•

•

•

•

•

•

•

•

•


[ 76 ]

Contributed extensionsThe contributed extensions that we are using were selected from the Joomla! extensions site (http://extensions.joomla.org) because they were more highly recommended than others. The following will have to be obtained and uploaded for use in this project:

Agora component—for creating the forumAgora latest Posts (basic version)—for viewing the latest forum posts

Organizing the articlesWhat we need to do first is establish how the articles are going to be organized for use on the site. Having an existing print-based publication has made it easier for us to create a relationship between the various Sections. For example, News as an article Section has categories for Local, World, and Business news. So there is no need to create Local News as a main Section, but it will be created as a News category. We will establish Sports as a major Section, with Football, Cricket, Golf, and Snooker as categories. We will do the same for all of the other listed articles, as follows:

NEWS SPORTS OPINION FEATURESLocalWorldBusiness

FootballCricketGolfSnooker

EditorialLetters

PoliticsArtsMediaScienceNatural HealthLawEducationFashionFood & DrinkAuto

We have now defined the framework for how content will be organized on the site. Now let us implement this framework.

User settingsThe basic user settings may be found as a link named System on the Global Configuration page. On the page that is opened, change the New User Registration Type to Author in the User Settings pane, as shown in the following screenshot. In this way, all authorized users can now post their articles online. However, as they are not Editors, they cannot publish the articles by themselves.

•

•

Chapter 4

[ 77 ]

Configure the front pageWe want a simple front page display with only one column throughout and only three current articles fully displayed. To configure the front page for this display, navigate to the Menu Item Manager page again, and in Main Menu, click on the Home menu link, which, as we see from the table, links to the Front Page.In the subsequent page (shown in the following screenshot) that opens, change the parameters required to modify the front page, and the save your changes.


[ 78 ]

Create a new sectionWe will need to create our own new sections for News, Sports, Features, and Opinion. To do this, perform the steps shown below:

1. Navigate to the Section Manager from Control Panel, and then click on the New icon on the upper-right, to create a new section.

2. In the page that opens (shown in the following screenshot), enter the name of the section, and then save your changes.

Do this process for all of the remaining new sections.

Chapter 4

[ 79 ]

Create new categoriesCategories are used to classify items that fall under the same Section, and need to be grouped with other items with which they bear a similarity. For example, News is a Section, but it can be further categorized into Local, World, and Business news. We must now create these new categories and establish relationships between them and the new sections. Our articles will be organized into categories in order to group them together with other articles, according to Section.

In this case, we will need to create several new categories for all news types.

1. Navigate to the Category Manager page from the Control Panel.2. In the following page, create a new category in the same way as you created

the new Section.


[ 80 ]

Test the article submissionNow let us test our article submission and see how it works. To perform this, click on the Add New Article icon in the Control Panel. You will get a form similar to the one shown in following screenshot:

Now add some articles, in order to ensure that you have successfully performed the tasks, taking care to select the Section and Category to which each article belongs.

We are adding all sample articles from the Administration Control Panel. However, in real life, we will make it possible for permitted users to add articles from the front page after the user is logged in.

Chapter 4

[ 81 ]

ForumsCreating the forums should also be fairly easy. However, we will have to install the forums extensions first, through the Extension Manager, which is accessed from the top toolbar Extensions | Install/Uninstall.

Agora is just one of several forum extensions that are available from the Joomla! extension site, and we have only chosen it for this example because it is popular. Otherwise, any other forum component that has the functionality that the project requires may be used. The Agora download cannot be directly installed in the format in which it is downloaded because it is a zipped package that contains the component, along with separate folders for the extra modules, plugins, and languages. Upload the Agora Forum component from the unzipped folder. After a successful installation, we may now access the Control Panel from Components | Agora Forum on the top toolbar:

Now let’s create the forums. We will be creating only one forum, Have Your Say, which will have the container General as the Parent Category.


[ 82 ]

In order to do this, click on the Categories & Forums icon in the Agora Control Panel. On the subsequent page, we will create a new category:

1. Click on the Add Category icon on the upper-right, and complete the form that it presents.

2. On returning to the previous page once more, you will notice that a new icon, Add Forum, can now be found on the upper-right. Let us therefore create the Have Your Say forum.

Chapter 4

[ 83 ]

In some browsers, the Newstheme template may make some of the forum display a bit difficult to read due to CSS conflicts. An experienced user might opt for another template.

Module positionsWe need to move our active site modules to the desired position. To move the modules, navigate to the Module Manager page, via Extensions | Module Manager on the top toolbar:

1. Enable the Agora latest post basic module. To position the module on the left (where we want it), click on the module title and open the settings page.

2. On this settings page, you can either set or modify the display parameters for the Agora latest post basic module. In our example, change the display position of the module to left. Change the Title to Latest forum posts, and change the Number of posts that will be shown in the block, if desired. Leave all other settings with their default values, unless you have a specific need to change any of them. Save the changes.


[ 84 ]

Perform the same steps to place other modules where we want them to display, as follows:

Main Menu = leftUser Menu = leftLogin Form = rightPopular = contactWho's Online = rightTop Menu = user3Search = user4Latest News = user2

You can adjust how each module displays in relation to others in the same position, by changing the order number of each. Lower numbers will appear further up the screen than the others.

•

•

•

•

•

•

•

•

Chapter 4

[ 85 ]

Display contentWe are now going to create menu items, in order to view the content that we have published. Our links to the articles by Section should be located in the Top Menu.

1. Navigate to the modules page, via Extensions | Module Manager. On this page, make sure that the Top Menu module is enabled.

2. Now navigate to Menus | Top Menu from the administrator toolbar. This will show a blank table. What we intend to do is add to new menu items for the sections News, Sports, Opinion, Features, and Forums.

Add the News section linkWe need to add a menu link for the News section.

1. Click on New on the top right-hand side bar, in order to add a new menu item.

2. Select Articles, and from the expanded menu tree, click on Section Layout.


[ 86 ]

3. On the Menu Item page, we will fill in the desired menu title, change any other page view display parameters necessary, and then save the menu link.

Add the other section linksWe also need to add links for the other sections (Sports, Opinion, and Features), which we do as follows:

1. Navigate to the Menus | Top Menu page, in order to bring up the Top Menu, and then select the New button.

2. Follow the same steps that we performed for the News section link, in order to create all of the other menu links.

Chapter 4

[ 87 ]

Add the Forum linkNow let us add a link to the newspaper forum:

1. As before, navigate to the Menus | Top Menu page, in order to open the Top Menu, and then click on the New button.

2. Follow the same steps as we used to create the section links. However, to create a link for the forum, we select Agora Forum on the Menu Item configuration page.

If you now navigate to the Top Menu, from a preview, you will see all of the new menu links that we have created. If you click on the News link, you will see the Categories containing the articles that have been posted under News, and the number of articles in each category.


[ 88 ]

Finishing upIf you return to the front page, you will see that we are done with this project.

Chapter 4

[ 89 ]

Further developmentThe result, as we can see, is a simple site that is probably suitable only for a small local newspaper. A good idea for enhancing the site might be to add a poll, through the Poll component, and advertisement banners, through the Banners component. Both of these components are core components. An exciting extension to use is CCK, which enables customized content type construction. An overview of one of the popular CCK extensions is given in Chapter 1 of this book.


Build a basic site for publishing an online newspaper or magazineOrganize articles into several sections, and categoriesCreate and use custom menu links for the display of articlesUse the Agora Forum extension to create a users forum

••••

Breakin' Events—Building an Events Site

"Electric" Skid Jackson is a retired break-dancer. Having won the Red Rhino Street Dance Award for five years in a row, Skid is now a full-time choreographer and owner of the Def Freeze dance crew. Skid has an idea for a website where all of the street dance events all over the world can be listed according to their location. The primary advantage of such a website to Skid will be to provide a constant stream of prize-winning dance duels where he can enter the Def Freeze dance crew. He has chosen the name "Breakin' Events" for his website.

Skid Jackson wants a website where new events, from anywhere in the world, can be listed on the site by all of the registered users.

The Breakin' Events website will have the following features:

Registered users will be able to create events, categorized by continentA Calendar, which will show all of the events, in a grid viewA listing of the latest listed events, shown on the front page

•

•

•


[ 92 ]

The completed Breakin' Events site is shown in the following screenshot:

Chapter 5

[ 93 ]

Build the Breakin' Events siteTo enable this website to function as designed, we need to do the following:

Create selectable terms for users to select the Continent in which the event is taking placeSelect the extensions necessary to implement the required functionalities, and configure themCategorize and organize all of the content in a logical way through a menu system, in order to enable them to be easily accessed and read

TemplateThe template chosen for this website is Come Dance, which has a stunning design and is quite appropriate for the theme of the site.

ExtensionsThe extensions listed in the following sections will be used:

Core extensionsWe need to visit the Module Manager page, and enable all of the modules that we need, especially the following:

Main Menu module—gives a menu item that links to the front pageUser Menu module—allows selected menu items to be visible only to registered and logged-in users (such as the link to post articles)Login Form module—is used to allow registered users to log in and to allow others to registerTop Menu module—is a horizontal menu to be placed on the top part of the siteSearch module—enables site-wide searches by keyword

Any other modules in the page may be disabled, as they are not relevant to this project.

•

•

•

•

•

•

•

•


[ 94 ]

Contributed extensionsThe Breakin' Events website is built entirely around the JEvents module, and should be fairly easy to build. The following contributed extensions will be required:

JEvents Component—is the main component requiredJEvents Mini-Calendar Module—gives an overview of events, which can be placed on any pageJEvents Latest Events Module—gives a brief summary of upcoming eventsJEvents Search Plugin—makes events searchable via the core Joomla! search engine

Configure JEvents componentUpload the JEvents component via Extensions | Install/Uninstall in the top toolbar on the Administrator page. Then configure the component through the configuration page that appears during upload or installation. There are nine panes to configure on this page—Component, Permissions, Event Editing, Event Detail View, Main Monthly Calendar, Year/Category View, RSS, Calendar, and Latest Events.

•

•

•

•

Chapter 5

[ 95 ]

Configure the Component paneThe Component pane is the first pane that you will see on the Global Configuration page. It is where you set the basic displays of the Events component. Most of the parameters can be safely left with their default values.

You may want to prevent advertisements from the JEvents website from being displayed on your website, and may also want to prevent search engines from indexing your events. In this case, select the options as shown in the following screenshot:


[ 96 ]

Configure the Permissions paneThe Permissions pane establishes the category of users who may post events to the site, and the conditions under which the posts are accepted. If you select Enable User Authorisation you will need to assign authorization to specific, individual users, in order to enable them to manage events. Otherwise, leave this setting with the default value, in order to permit general user registration.

For user-level permissions, the default setting only permits the administrator to publish posts, unless you decide to change this.

Configure the Event Editing paneThe Event Editing pane shows how published events may be edited.

1. The first three lines decide if a pop-up window is enabled and the size of such a window.

2. The 10th and 11th lines determine whether the administrator should be alerted when a modification is made to published events or a new event is posted. You may want to change this setting, or leave it with the default value.

Chapter 5

[ 97 ]

The other default settings can be left as it is:

Configure the Event Detail View paneThe Event Detail View pane shows the fields that are viewable for each posted event, such as:

By whom it was postedThe e-mail address of the person who posted the eventThe number times that the listed event has been viewedIf and when the event repeats

•

•

•

•


[ 98 ]

Configure the Main Monthly Calendar paneThe Main Monthly Calendar pane sets the maximum number of events that are shown in the page view for any month. The starting time for each event can also be shown. The bottom part of this pane provides the tooltip parameters if the feature is selected. These may be left with their default values.

Configure the Year/Category View paneThe Year/Category View pane describes how the yearly view and the category views are displayed. The yearly view shows a list of events for an entire year, and the category view shows a list of the events for an entire category. The settings may be left with their default values.

Chapter 5

[ 99 ]

Configure the RSS paneYou may think that it is a fine idea to have the ability to post to your site available for subscribers who may want to export them for use on other websites, read them in their favorite feed reader, or read them in their e-mail client. In this case, you will find the RSS pane useful. Many of the settings may be left with their default values, except the fields for the RSS Title and the RSS Description, which you need to change to reflect your site's identity.


[ 100 ]

Configure the Calendar paneThe Calendar pane is relevant only if you have installed the optional Calendar module. The settings on this pane may be left with their default settings. The JEvents Mini-Calendar module displays events in a calendar view.

Configure Latest Events paneThe Latest Events pane is also only relevant if you have installed the optional Latest Events module. This module displays new events that have just been posted to the site, in a block. These settings may be left with their default values, unless you really must make changes.

Chapter 5

[ 101 ]

Upon saving your definitions by clicking on the top right-hand side icon, you will be presented with the backend Control Panel for JEvents, which you may also access from the top toolbar Components | JEvents. From this Control Panel, you may modify the configuration at any time.

Create new categoriesOur events will be organized into categories, in order to group together events according to their geographical location.

1. Navigate to the JEvents Control Panel, and then click on the Manage Categories icon.

2. On the subsequent page, click on the New icon on the top right-hand side, in order to add a new category.


[ 102 ]

3. Add parameters for the new category, and then save your changes.

Ensure that all of your categories are Published.

Test the Event submission formWe will perform the following steps in order to test the event submission form:

1. Click on Manage Events from the JEvents Control Panel.2. Click on the New button on the top right-hand side, and fill in the details of

the event in the following primary form.

Chapter 5

[ 103 ]

The second tab at the top of the form (Calendar) takes you to another pane, where you set the event dates:

Save the Event submission form, and then post some more events in other categories.


[ 104 ]

Display contentWe are now going to create menu items that can be used to view the content that we have entered. From our design links to the articles by continent, everything should be located in the Top Menu.

1. Navigate to the modules page, via the Extensions | Module Manager link. On this page, make sure that the Top Menu module is enabled.

2. Next, navigate to Menus | Top Menu from the administrator toolbar. This will show a blank table. Here we intend to add new menu items for the continents of Africa, Asia, Australia, Oceania, North America, and South America. We will also include a Global link.

Add the Global linkTo add the Global link, we will perform the following:

1. Click on New in the top right-hand side bar, in order to add a new menu item.

2. Select Jevents and from the expanded menu tree, and then select Category List of Events.

Chapter 5

[ 105 ]

3. On the subsequent page, enter the title of the link (Global). In the Parameters (Component) pane on the right-hand side, select all of the categories available. You may leave the Parameters (System) settings with their default values.

Add the Africa linkWe will perform the following steps in order to add the Africa link:

1. Click on New in the top right-hand side bar, in order to add a new menu item.

2. Repeat the process that we followed for the Global link. However, this time select only the Africa category.

Add other continent linksTo add other continent links, perform the following:

1. As before, visit the Menus | Top Menu page, in order to display the Top Menu, and then click on the New button.

2. Follow the same steps as we previously did for the Africa link, in order to create all of the other menu links.

If we now click on the Africa link on the Top Menu, from a preview, we will see the events that have been posted from Africa.


[ 106 ]

Modify the front page displayThe front page is, by default, shown by the Home link in the default Main Menu. However, we want the Home page to show the events in the Global list category instead. Therefore, we will edit the Home link via the Menus | Main Menu option on the top bar. On clicking the Home link, we are presented with the page shown in the following screenshot. Click on the Change Type button:

On the page that opens, change the settings as we did for the Global link, and we are done.

Calendar and Latest Events blocksThere is a calendar view block provided by the JEvents Calendar module. In order to make this easily accessible, we will place it on the sidebar. There is also a Latest Events block, which lists newly-posted events, which we will also place in the sidebar.

Navigate to the Module Manager page, and then move these two modules to the right sidebar. If we return to the front page, we will then have the blocks arranged, as we want.

Chapter 5

[ 107 ]

Upon clicking the month link at the top of the calendar, we are presented with the page view shown in the following screenshot, which allows a more detailed view of individual events:


[ 108 ]

There, if you click on any event panel, you will see a page similar to following screenshot, showing the details of the event.

Chapter 5

[ 109 ]

Finishing upIf we now visit the Home page from the Preview tab, we will see that our project is complete.


[ 110 ]

Extending functionalityThis site was created for the sole purpose of listing events. It might be possible to add some other features, such as allowing comments, and possibly a forum for site users to discuss past and upcoming events. Useful extensions that will do these can be found on the Joomla! extensions site http://extensions.joomla.org.


Build a basic site for listing events from multiple users, by using the JEvents moduleCategorize listed eventsCreate calendar views for listed eventsCreate a list of the latest events on the front page

•

•

•

•

Joombook—Building a Community Site

Tony Tortilla is a student at Joomlaburg University. Tony thinks that the social life could be vastly improved if the University had its own community website where the students could get to know each other a little better. With about 5,000 students, Tony thinks that the idea might immediately make him a big hit with the girls, and also possibly make him lots of money in the future when the site is bought by Google. So Tony Tortilla has come up with the idea of Joombook—a simple community website for the students at Joomlaburg University.

Joombook is intended to be quite simple, initially, and will have the following main features:

Users will be able to create detailed profile pages for themselvesUsers will be able to create blogs, which will be shown on a general blog page and be available for commentsThere will be a forum for users to express their views and opinions on several subjects, including books, music, film and video, and concertsPermitted users will be able to create polls and have others vote in themUsers will have access to real-time chat

•

•

•

•

•


[ 112 ]

The completed social website will look similar to the following screenshot:

Chapter 6

[ 113 ]

Build JoombookTony is not looking for anything fancy like Facebook or MySpace, but just a weekend project. All he wants is a simple community portal with basic social networking features.

In order to create this site, we need to do the following:

Establish profile pages where users may fully describe themselvesSelect the extensions necessary to implement the required functionalities, and configure themCreate blogging functionality to enable users to share their journals with one anotherCreate a forum for discussing entertainment topics, principally, books, music, film and video, and concertsEnable users to create pollsEnable users to chat with one another in real timeOrganize all of the content in a logical way, in order to access and read it easily

TemplateThe template chosen is News StudioAlfa, which is a community-contributed template. Tony chose this template because he liked its simple, clean, and uncluttered appearance.

ExtensionsFor Tony Tortilla's community website, we will be using some core extensions and some unique contributed extensions.

Core extensionsThe core modules that will be used for this site are as follows:

Main Menu module—creates primary navigation for the site pages.

Polls module—allows your site to capture votes on different topics in the form of multiple choice questions. This is a core component.

•

•

•

•

•

•

•

•

•


[ 114 ]

Contributed extensionsThe contributed extensions that will be used for this site is as follows:

Community Builder—provides components and modules that will enable users to register, create profile pages, and interact with one another.JComments—allows users to comment on articles.Simplest Forum—enables threaded discussions about general topics.jPFChat—provides a discussion space, like a chat room.

Basic contentThe site is built around the Community Builder (CB) component, which should give it the "community" functionality. Tony wants the users to have a standard profile form so that uniformity of the information (which the site presents to other users) can be maintained. This functionality is provided by CB, and it also lets users know what they should expect to include on a user profile.

Configure Community BuilderThe distribution package of the Community Builder is a compressed ZIP file comprising the following eight files:

com_comprofiler.zip—contains the installation package of the CB componentmod_cblogin.zip—is the module package that will be used to substitute the default Joomla! Login modulemod_comprofilerOnline.zip—is the module package that displays online membersmod_comprofilerModerator.zip—is the moderation package used to support the delegation of registration approval tasks to moderators, and pending connection items to registered userscb_expert_files_only_m_4_j_1.0.tar.gz—contains three folder hierarchies that can be used to upgrade previous installations of the Joomla! 1.0.x series without uninstalling previous versionscb_expert_files_only_j_1.5.tar.gz—contains three folder hierarchies that can be used to upgrade previous installations of the Joomla! 1.5.x series without uninstalling previous versions

•

•

•

•

•

•

•

•

•

•

Chapter 6

[ 115 ]

README-NEW-INSTALL.txt—is the traditional text file that contains condensed information regarding the distribution, functionality, and quick installation instructions targeting first-time CB installationsREADME-UPGRADE.txt—contains information that should guide you through upgrading a pre-existing CB installation to the latest CB version

You will, of course, not need all of the files, except for the first four, as we will be performing a new installation. This is how we will proceed further:

1. Install the com_comprofiler.zip file via Extensions | Install/Uninstall. The installation of CB is a two-step process, and will be done automatically. You need to wait for the green message stating that the installation has finished.

2. Install the mod_cblogin.zip file via Extensions | Install/Uninstall.3. Install the mod_comprofiler Moderator.zip file.4. Install the mod_comprofilerOnline.zip file. This is a module that displays

a list of online users, with a link to their profiles.5. Navigate to Extensions | Module Manager. Enable the mod_cblogin

module (CB Login) which in turn enables the other CB modules' administration backend manager. Click on the red cross in the Enabled column, or click on the module name to set the module's parameters.

6. Navigate to Components | Community Builder | Configuration, and at least choose the Name Style (first/last name mode choice) corresponding to how you want to split, or not split, the existing users' names during the synchronization of existing users in the next installation step. Make sure that you click on Save on the Configuration page. Many of the settings may be left at with their default values, but remember to change the Registration Reply To Email Address field.

7. Navigate to Components | Community Builder | Tools, and use the Synchronize Users tool to synchronize CB with Joomla!.

8. If you have installed sample data during the installation of Joomla!, disable the standard Joomla! Login module. In order to do that, navigate to Extensions | Module Manager and then click on the green checkmark in the Enabled column of the Login Form (mod_login); the icon then becomes a red cross.

9. Navigate to Components | Community Builder | Tools, and use the Load Sample Data tool to pre-populate fields with standard user contact fields (address, phone, and so on), and also create a default users list. To edit the default users list, or to add other users lists, navigate to Components | Community Builder | List Management, and change or add the list(s), along with the corresponding access level. Make sure that these are published.

•

•


[ 116 ]

10. If you want to allow registrations only through Community Builder, which is recommended, navigate to Community Builder | Configuration | Registration and set Allow User Registration to yes, independently of global site setting. In Site | Global Configuration | Users, set the Allow User Registration option to No.

11. Once these steps have been performed, for the user registration link (which we shall create later), we should have a registration form similar to following screenshot:

Chapter 6

[ 117 ]

Also, on a typical user profile page, which will appear after a user has submitted his or her registration and logged in, we should have a profile display similar to the following screenshot:

If we have added more fields to the registration form, a more detailed profile will be generated.

Create a new section and categoryOf course, we really don't need to create a new section and a category. This is because we only have one type of article—blogs. Therefore, all of the articles could be left uncategorized. However, this is quite untidy, and Tony might decide to add another article section, such as Campus Gist, in the future. Therefore, we will create a single category and a single section for this particular project.


[ 118 ]

Create a sectionAll of our articles are made up of blogs. However, we will create one new section that we will call "Articles". In order to create this section, perform the steps shown below:

1. Navigate to the Section Manager from the Control Panel, and then click on the New icon at the top right-hand side, in order to create a new section.

2. On the page that is displayed next, add the name of the section, and then save your changes:

Create a categoryAs mentioned before, we will need to create a new category, which we will call "Blogs".

1. Navigate to the Category Manager page from the Control Panel.2. On this page, create a new category in the same way as we created the new

section. In the Section field, select Articles.

Chapter 6

[ 119 ]

3. Now add some blog posts, to ensure that you have successfully performed the task.

Configure pollsNavigate to the Poll Manager component page from Components | Polls. A poll is used for obtaining feedback on various topics from the users.

Let us create a sample poll for the users of Tony Tortilla's Joombook. Our poll will be as follows:

Who is the coolest dude on campus?Tony TortillaThe Invisible ManWalter (Wally) RosenbergI don't care

°

°

°

°


[ 120 ]

To create this poll, click on the New link. Enter your question and the options, and then save the poll:

Tony wants this poll to be seen in the sidebar. Therefore, we need to create a module for this poll. To do this, we navigate to the Module Manager page and click on the New button on the top right-hand side. This will display the page shown in the following screenshot:

Chapter 6

[ 121 ]

On this page, we select Poll, and then click on the Next button. This displays a configuration page (shown in the following screenshot) for the new Poll module that we have created:

Now give the module a title, and also select the poll that it should display, as well as the position in which it should be placed. We now have a module for displaying Tony's poll about the coolest dude on campus.

Configure forumsCreating forums should also be fairly easy. Navigate to the Extensions | Install/Uninstall page, and then upload the Simplest Forums component. We will now navigate to the Simplest Forums configuration page from Components | Simplest Forums. We will create four forum boards for Books, Music, Film and Video, and Concerts. By clicking on the New tab, we will get the page shown in the following screenshot:


[ 122 ]

Posting to the forum requires that the posting form can be accessed through a menu link. We shall create this menu link later.

Configure chatThere are several other components and modules that are capable of adding the chat functionality to the community website. However, the jPFChat component has been selected purely as an example, and not because it is necessarily better than any other component. Navigate to the Extensions | Install/Uninstall page, and upload the jPFChat component. Then navigate to the jPFChat configuration page via Components | jPFChat. Most of the settings on this page (shown in the following screenshot) may safely be left with their default values—except for the modifications that you need to make because of your specific needs:

The chat system is now configured and ready for use. However, it will also need a menu link that will take the user to the chat page. We shall create this later.

Create comments systemThe comments system is needed to enable users to add comments to the posted blogs. To create this system, obtain the JComments component from the Joomla! extensions site, and upload it. The initial installation screen should look similar to the following screenshot:

Chapter 6

[ 123 ]

On clicking the Next button, you will be directed to the configuration page for JComments.

On the first, General, page, we will set the locations where the comments system should be shown and how they will be shown, as follows:

1. In the Categories pane, we select a category of Articles/Blogs—it is the only category available.

2. In the Notifications pane, we select No, in order to enable comments to be published without the approval of the site administrator.

3. In the Miscellaneous pane, we select Yes, in order to enable both RSS feeds and plugins.


[ 124 ]

Also, download the JComments Latest module and install it. This will automatically create a list of the most recent comments, in a box that can then be placed in module positions on the site.

Put it all togetherNow we need to tie all of the elements of this project together, in order to make the site more meaningful to the users.

Create new modulesYou may want to create new modules to display the following:

Who is online?Most read blog

Follow the procedure that we used in creating the module for Tony's poll in the section Configure polls.

Configure the front pageFrom our design, we need to move the latest blog posts to the front page. To do this, we need to reconfigure the Home menu link on Main Menu to point to the Blogs category. Because all of our articles are blogs, it is simply an administrative task to publish whichever article we want to the front page. However, we do need the articles to appear in a single column on the front page. Therefore, we navigate to Menus | Main Menu, select Home, and then change the parameters as required:

••

Chapter 6

[ 125 ]

Now all of the blogs posted onto the front page will be displayed in a single column.

MenusLet's tidy up our site by creating a menu system that is more intuitive. For simplicity, we will put our links to the User Profile, Blogs, Chat, Forums, and the Polls menu all under the Main Menu. We will, however, need to create these menu links first.

Create the Chat menuTo create the Chat menu link that points to the jPFChat component, perform the following steps:

1. Navigate to Menus | Main Menu, and then click on New, in order to create a new item.

2. On the next page, select jPFChat from the tree. This will display the page shown in the following screenshot:

3. Add the menu item Title, and then save your changes.


[ 126 ]

Create the Forums menuTo create the Forum menu link that points to the Simplest Forum component, perform the following steps:


2. On the following page, select Simplest Forum, and then click on Forum List from the tree, in order to display a page of the available forums:

3. This will direct us to the menu parameters page. Add the menu item Title, and then save your changes.

Chapter 6

[ 127 ]

Create the Blogs menuTo create the Blogs menu link that points to the Blogs category, perform the following steps:


2. On the following page, select Articles, and then click on Category List Layout. We have made this selection because we envisage that a large number of blog posts may be submitted on a regular basis, and it will be neater to have only the titles displayed in a list, rather than the blog layout.

3. On the next page (shown in the following screenshot), give a name to the menu item, and also select the category from which it will fetch articles:

Create the Poll menuTo create the Poll menu link that points to the current poll on the site, as well as a selection box for other available polls, perform the following steps:


2. On the following page, select Polls.3. On the next page, add the menu item title, as usual, and then select the poll

that should be displayed.


[ 128 ]

4. After performing these tasks, save the link. If we click on the link created, the page shown in the following screenshot is displayed:

Create CB menusWe need to add the User Profile link for Community Builder—this will be the link to the user's profile page:


2. On the following page, select Community Builder and then click on User Profile.

3. On the next page, add the menu item and then save the link.

We also need to add the menu item for registration and also for a list of users. In this case, we will perform the above-mentioned steps, and select Community Builder | Registration page and Community Builder | Users lists.

Community Builder has a large selection of additional extensions that can be used to improve its appearance and performance. You can find these at http://extensions.joomla.org/extensions/extension-specific/community-builder-extensions.

You may also visit the Joomla! showcase site at http://community.joomla.org/showcase/sites/society/social-networking.html in order to obtain more ideas on how to add further customization.

Chapter 6

[ 129 ]

Finishing upWe may now make sure that our News StudioAlfa template is selected as Default, in Extensions | Template Manager. Tony Tortilla now has a new social networking site for his friends and the entire Joomlaburg University student community!

Adding functionalityThere are dozens of other extensions available that can be used to spice up the basic site. These range from social bookmarking tools and other extensions that emulate functionalities seen on websites such as MySpace and Facebook, to commercially-available ones that provide out-of-the-box configurations (for example, Jomsocial: http://www.jomsocial.com).


[ 130 ]


Build a basic website for social networking, by using Community Builder and other Joomla! extensionsConfigure the Forums, Polls, Chat, and so on as community features for the portal

•

•

Joomgets Inc.—Building an E-commerce Site

Joomgets Inc. are the foremost manufacturers of custom-made widgets in Joomlaburg. Their 'Joomgets' have won awards internationally, and are considered vastly superior to other, mass-produced widgets. In order to consolidate their success, Joomgets Inc. have decided to set up an online e-commerce store to sell their Joomgets. To start with, however, the widgets will only ship within Joomlaburg and will be available in three colors—pink, yellow, and blue—and in only one size.

The functionality required by Joomgets for their website includes:

Simple page views of the store from the links on the Main Menu and Top MenuA billing system with the automatic addition of a flat shipping cost for all itemsA shopping cart with checkout that permits payment by PayPal

•

•

•


[ 132 ]

Having considered other alternatives, Joomgets Inc. have chosen to use the VirtueMart shopping cart for their web shop. The following screenshot shows the completed web shop:

Build the Joomgets Inc. web shopMany books have been written on how to use VirtueMart, and it will be foolhardy to imagine that everything about this very versatile shopping cart system can be learnt in a few pages. Therefore, we will look exclusively at the steps required to build the Joomgets Inc. project. Specifically, we will be looking at how to:

Chapter 7

[ 133 ]

Enable the shopping cart to list detailed product descriptions and imagesShow the product name, detailed description, prices, and the ordering procedure in full page view, and provide links from the Main MenuConfigure the product prices and billing to reflect the cost of flat-rate local shippingConfigure the checkout to accept payment through PayPal

TemplateThe theme chosen is siteground-j15-101, which has a bright, pleasant, and simple design, and is very adaptable. The URL to the download page is listed in Appendix A of this book.

ExtensionsFrom the tasks that are presented by this project, the Joomgets website will be built entirely around the VirtueMart component.

Basic VirtueMart configurationsAt first glance, VirtueMart can look very hostile indeed, with many pages of daunting features. However, this needn't be so. Just imagine it as a feast, and you only need to take what you need from the whole table and leave the rest for later, or for other people with more varied tastes.

Firstly, we must install VirtueMart and all of the optional modules. The downloaded VirtueMart package cannot be installed as it is; it needs to be unzipped into a new folder. Unzipping the package will yield the VirtueMart component as well as two folders containing some optional modules and plugins respectively. It should also provide you with an installation manual, which might not be very useful to you if you don't like a hard life. It could actually be a bit of work to read it all.

•

•

•

•


[ 134 ]

Because we want to go to the beach in the next couple of hours, we will only upload the main VirtueMart component. When installing the VirtueMart component, it may be useful to also install the sample data, as this will show how things eventually go together, even though we will need to delete it later:

After installing the sample data, you are directed to the VirtueMart Control Panel, as shown in the following screenshot:

Chapter 7

[ 135 ]

Even though we have, at this time, chosen not to upload any of the modules contained in the modules folder (as they are not needed for this exercise), you should note that these might be useful if you want to perform further customizations in the future.

Basic configurationFrom the VirtueMart Control Panel, there are three icons that currently concern you: Edit Store, Configuration, and List Payment Methods. We will address the other icons later.

Edit StoreUpon clicking the Edit Store icon, you are directed to a page where you will be able to modify some basic data about your store:

Store panel—provides a set of fields where you will be able to enter your store name and addressStore Information panel—uploads a logo for your site and sets the parameters for the minimum purchase order amount and the minimum purchase amount required to qualify for free shipping

•

•


[ 136 ]

Contact Information panel—sets the name and other contact details for the store's key operativeCurrency Display Style panel—sets your primary store currency, how prices should be displayed, and also what other currencies are permitted

•

•

Chapter 7

[ 137 ]

Description panel—describes what your store offersTerms of Service panel—describes your terms for doing business

•

•


[ 138 ]

ConfigurationWhen the Configuration icon is clicked from your VirtueMart Control Panel, it directs you to the main configuration page, which has seven configurable panes, as seen in the following screenshot:

Chapter 7

[ 139 ]

1. Global—is the landing page. The settings on this page may be left with their default values.

2. Security—provides security settings that may also be left with their default values.

3. Site—provides settings for the site that may be left with their default values.4. Shipping—sets the store's shipping method. In this case, as shown in the

following screenshot, we have selected only the Standard Shipping module:

5. Checkout—provides checkout settings that may be left with their default values.

6. Download—answers the question "does your store sell downloadable ware?". This is the place to set how the purchase and delivery of such products are handled. These settings may be left with their default values.

7. Feed Configuration—sets rules by which items are incorporated into the outgoing feeds for your site. You may leave these settings with their default values.


[ 140 ]

List Payment MethodsOn clicking the List Payment Methods icon, we are directed to a page that lists all of the payment methods acceptable to VirtueMart. From this list, you will select the payment method that will be implemented on your site. In this case, we have selected PayPal (listed in the following screenshot) as the only permitted payment method:

Product ListOur VirtueMart installation provides a lot of sample products—mostly related to gardening. However, our store does not sell any of these, so we will delete all of the sample products. We do this by clicking on the Product List icon in the VirtueMart Control Panel. Select all of the listed products, and then click on Remove on the top right-hand side.

Chapter 7

[ 141 ]

CategoriesOur VirtueMart installation also provides predefined product categories, none of which agree with our store items. Therefore, we will also delete all of these categories. We do this by clicking on the Category Tree icon in the VirtueMart Control Panel. Select all of the listed categories and subcategories, and then click on Remove on the top right-hand side, taking care to remove the subcategories first.

Now we can begin building our store the way we want it—first by adding new categories, and then adding products to the categories. However, in our case, we only need one category: widgets.

To add the new category, access the Category Tree page, and perform the following steps:

1. Click on New to add a new category. We will be presented with the following page:


[ 142 ]

2. Add the category name and its description. The Images pane can be selected from the top of this form and is needed if you want to add an image for your category. This pane is optional. Save the category before proceeding.

3. To add products, navigate to the Product List page, which will be empty at this time, and then click on New on the top right-hand side. The form that we are presented may look quite daunting, but we will tame it in a few moments. The page has five panes for describing the product. However, for the purpose of this simple project, we will only concern ourselves with Product Information and Product Images panes.

Product InformationThe first pane that we see is the Product Information page, where basic information about the item being listed is entered. On this product form, we do not have to fill in all of the fields. Only the essential parts, such as the Name, SKU, and the product price, need to be completed, as shown in the following screenshot. We should also enter an appropriate description of the item and one or more photographs, or else we will find it a bit tough to get a potential buyer to purchase our invisible product:

Chapter 7

[ 143 ]

Note that these fields are essential because VirtueMart demands that they be filled in. SKU stands for Stock Keeping Unit. It is the unique identifying mark for a specific product and thus must be defined. Without a price, nobody will be able to purchase the product. This example website is selling widgets, but in real life it may be helpful to add the product dimensions and the weight so that the buyers have an idea of the size—especially if they are expecting the product to fit in their mailbox.

Product ImagesIn the Product Images pane, we will add a descriptive image of the product that we have just listed. In the left-hand side panel, browse your computer for the required image, and upload it. The product thumbnail image will automatically be added by the same procedure:


[ 144 ]

After adding the product descriptions and saving the product, we will have a summary for the product page similar to the following screenshot:

Chapter 7

[ 145 ]

We will repeat the procedure for the other products, and on completion, our Product List page should look similar to the one shown in the following screenshot:

ShippersHaving listed our products in the catalogue, we must define how they will be delivered to the purchaser. On the left-hand side panel of our VirtueMart configuration, we will select the Shipper tab.


[ 146 ]

This tab will show us that the only available shipping methods are DHL and UPS. However, we want to use the Joomlaburg Mail Service (JMS). Therefore, we will need to create another shipper by clicking on New at the top of the page. In the page that appears, we enter the required information for JMS, and then save your settings. Our new shipper's list will now include JMS, as shown in the following screenshot:

Shipping ratesIt is necessary to define what rates will be chargeable for the items to be shipped by JMS, so we will again select Create a Shipping Rate from the left-hand side administration panel, and call this new rate Flat rate shipping, as shown in the following screenshot:

Chapter 7

[ 147 ]

Having done this, we can now visit the Shipper list page and remove all of the other shippers except JMS—taking care to remove the listed shipping rates first.

Display ProductsThis is a simple shopping cart with only one category of products, and there is no need for any elaborate menus and navigation systems. All we need to do is place the links to the store in the Top Menu. In order to do this, we will visit the Menu Item Manager page from Menus | Top Menu in the administration bar. We will then click on the New icon, in order to create a new menu item. On the next page, we will select VirtueMart from the menu tree, and then on the following page we will complete the creation of our menu item:


[ 148 ]

We could also configure the Home link in the Main Menu to point to the VirtueMart store.

Have we done this correctly?We have configured the cart to accept payment, and we have added products to the cart. Let's see whether we have done this correctly, by following a typical order process.

Joe Bling, our customer, has clicked on the Add to Cart button, in order to buy a Blue joomget, as shown in the following screenshot:

Joe Bling is taken to the cartPlacing the order directs Joe Bling to the cart, where he is given the options to either Continue Shopping or to proceed to the Checkout, as follows:

Chapter 7

[ 149 ]

Joe Bling goes to the checkoutOn deciding to go to the checkout, Joe Bling is taken to another page where the delivery and billing information is demanded, as seen in the following screenshot:


[ 150 ]

It is hard to proceed beyond this stage on anything other than a live site because of authentication problems. However, as we are logged in as administrator, we may go to the next stage of checkout:

Chapter 7

[ 151 ]

The checkout process will demand that Joe Bling updates his address for the purpose of billing and shipping.


[ 152 ]

In the payment method stage of the checkout process, only PayPal is listed (as seen in the following screenshot) because it is the only method that we have permitted:

On clicking Confirm Order at the bottom of the page, Joe Bling is taken to the payment point at the PayPal site.

Finishing upTo finish up, we must select the siteground-j15-101 theme as the Default from Extensions | Template Manager. If we then preview the front page, we will see that our project is complete:

Chapter 7

[ 153 ]

Adding functionalityVirtueMart is a very huge feast indeed. There are dozens of extensions available to make it work more effectively and to adapt it to specific applications. If you feel the need to get more out of your VirtueMart installation, visit the page created for these specific extensions at http://extensions.joomla.org/extensions/extension-specific/virtuemart-extensions, and dig in as much as you like.

"Joomla! E-Commerce with VirtueMart" by Suhreed Sarkar is also a great book from Packt Publishing in which you will learn topics such as:

The Store and Catalog mode of VirtueMartThe Administration Tool of VirtueMartThe Orders, Discounts, Shopper Groups, and Customers features of VirtueMartThe Secure Sockets Layer encryption feature The support for AJAX

... and much more!

•••

••


[ 154 ]

It may also be great fun and quite inspirational to visit the Joomla! showcase page at http://community.joomla.org/showcase/sites/business/retail.html to see how other websites are using VirtueMart to power their shopping cart.


Build a simple online shopping cart selling multiple products, by using VirtueMartConfigure the payment processing functionality to use PayPalDefine and implement the basic shipping method and cost parameters for the shopping cart

•

•

•

Joomlaburg Accommodations—

Building a Directory SiteWally Fishbourne had the idea of creating an online directory where people can freely post details of accommodation available for rent, share, and sale all over Joomlaburg. He is looking for a simple directory, with listing and display features, rather than the style used in Gumtree and craigslist. Users will be permitted to post without being registered.

The basic features of the Joomlaburg Accommodations website are:

A front page view showing simple links to the following main sections:Houses for Rent (Offered and Wanted)Houses for Share (Offered and Wanted)Houses for Sale (In Joomlaburg and Elsewhere)

Site-wide search facilities

•

°

°

°

•

Joomlaburg Accommodations—Building a Directory Site

[ 156 ]

The completed site should look similar to the example shown in the following screenshot:

Build Joomlaburg AccommodationsJoomlaburg Accommodations is another example of an easy-to-build website, which can be completed within a couple of hours. The primary aim is to be able to access entries that have been created by means of their categories and also by means of the site-wide search facility.

TemplateThe template chosen is rhuk_milkyway, which is included in the complete Joomla! package, and which is highly adaptable.

ExtensionsThis site will be built entirely around the SOBI2 - Content Construction Kit (CCK) and Directory Component for Joomla! extension. This extension was chosen on the basis of popularity.

Other extensionsThe core module that will be used for this site is as follows:

Main Menu module—creates the primary navigation features for the site pages

•

Chapter 8

[ 157 ]

Install Joomla!When you are installing Joomla! 1.5 from the full package, you are given the option of whether to also install the sample data. Do not select this option or you will find your website preloaded with superfluous data, none of which is remotely relevant to this project.

Install SOBI2SOBI2 can be downloaded from http://extensions.joomla.org. In order to install it, use the Extensions Manager from the top menu bar, and navigate, as usual, to Extension | Install/Uninstall, in order to upload the component. You will be led though the installation, starting with the first screen that comes up, as follows:

After the installation has completed you will get an acknowledgement. You should also be directed to a web page that lists all of the tasks that can be carried out with SOBI2. This page also identifies some other extensions that could make the component more useful. However, this information is not very important to our project, so we will return to the SOBI2 Configuration page on our website, via the admin toolbar options Components | SOBI2 | General Configuration.

On the Configuration page, we will see that there are eight configurable panes: General, Mainpage, Search Options, System Emails, Cache, Debug, Background, and Sigsiu Tree.


[ 158 ]

GeneralIn the General page, you can set the rules as to how items will be entered into the directory, and how they will be displayed. Many of these settings may be safely left with the default values, as shown in the following screenshot:

In this example, we have made the following changes:

1. Changed the Component Name to the name of our directory site.2. Opted not to show the entries on the main page so as not to clutter it up.3. Opted to display three categories in a single line, for a neater main

page display.

Chapter 8

[ 159 ]

MainpageThe Mainpage is where the summaries are shown. Also, when a search is initiated, this is where the results are displayed. By default, some information related to the SOBI2 component is also displayed on this page, unless you disable this here:

In this example, we have opted for the following:

1. Not to show the description of component on main page for an uncluttered display.

2. Not to show the component description on the search page, for the same reason as above.


[ 160 ]

Search OptionsThe Search Options page is where you determine how searches are conducted and also the display characteristics. Many of these settings can be safely left with their default values:

System EmailsE-mails related to posted items, registration, payment (if configured), and so on will ordinarily be sent by SOBI2. On the System Emails page, you can make decisions as to where such e-mails will go. You can make multiple selections by holding the Ctrl key.

In this example, we have defined it so that only the Administrator will receive system-generated e-mails.

Chapter 8

[ 161 ]

CacheCaching enables your website to display faster. This feature holds the most frequently-requested data in a sort of intermediary pool, so that the database is not overworked by excessive requests. The Cache page allows you to enable or disable the cache feature. It also determines for how long the data should be cached before it is destroyed and the maximum length of a related data string that can be captured in a single string. Many of these settings may be left with their default values.

DebugOn the Debug page, you determine the types of error messages that should be displayed, and how. These options can be safely left with their default settings.


[ 162 ]

BackgroundOn the Background page, you can change the background color of your displays, and also the border color. We have selected new values as an illustration: black (#000000) for the border and pink for the background image, as shown in the following screenshot:

Sigsiu TreeLeave the Sigsiu Tree page settings with their default values unless you really know what you are doing. This page shows the locations of the main icons used by the component:

Chapter 8

[ 163 ]

Other settingsOn the left-hand side of the configuration page, we will see a column (shown in the following screenshot) that contains details of some other configurable characteristics of the SOBI2 directory:

This is how the main headings look when expanded:

Entries & CategoriesAwaiting approval (0)All Entries (0)Add EntryAdd CategoryAdd Multiple Categories

CategoriesFirst Category

•

°

°

°

°

°

•

°


[ 164 ]

ConfigurationCustom Fields ManagerGeneral ConfigurationEntry ConfigurationView ConfigurationPayment OptionsLanguage ManagerRegistry EditorRecount CategoriesUninstall SOBI2

Templates & CSSTemplates ManagerDetails View TemplateV-Card TemplateEntry Form TemplateCSS FileEmail Templates

PluginsPlugin Manager

About System

Most of these are not relevant to our present project, and the ones that are will be addressed when the time comes.

CategoriesFor this simple project, the categorization of the submissions will be quite basic:

Houses for Rent (Offered and Wanted)Houses for Share (Offered and Wanted)Houses for Sale (In Joomlaburg and Elsewhere)

•

°

°

°

°

°

°

°

°

°

•

°

°

°

°

°

°

•

°

•

•

•

•

Chapter 8

[ 165 ]

Therefore, we are going to have the following rules for the categories:

CATEGORIES SUBCATEGORIESHouses for Rent Offered

WantedHouses for Share Offered

WantedHouses for Sale In Joomlaburg

Elsewhere

Create new categoriesAs we can see, our accommodations will need to be organized into categories in order to group them together along with other houses, according to the listing type. To create these new categories, navigate to the SOBI2 Category Manager from Components | SOBI2.


[ 166 ]

We will find that the Category Manager has been pre-populated with a sample category, First Category, as an illustration. We will rename this to Houses for Rent. In order to do this, click on the title to bring up a form (as shown in the following screenshot), make the necessary changes, and then click on Save:

Chapter 8

[ 167 ]

We also need to add more categories. To do this, we click on the Add Category link in the left-hand side block:

This will give us a page similar to the one that we used for Houses for Rent, on which we changed the category title at the top. We shall do this to add all of the main categories.


[ 168 ]

Create subcategoriesSubcategories are created in the same way as the main categories—by selecting the Add Category link in the Category Manager page. For example, to create the Offered subcategory in House for Rent, we make sure that House for Rent is selected as the Parent Category.

All other settings are optional. We will repeat the same process to create all of the subcategories.

Form fieldsData will be entered into the directory through a form. The default form has preset fields. For some of these fields data must be entered, and for others data is optional. You can control some more aspects of these fields if you access the Custom Fields Manager through the top administration menu bar Components | SOBI2 | Custom Fields Manager, as shown in the following screenshot:

Chapter 8

[ 169 ]

Here are some explanations of the table columns:

Field Label—is the title of the field when the form is presented for data entryPublished—when selected, this means that the field will be shown on the form; otherwise it will be omittedField Type—explains what sort of data is accepted in the fieldFor Free—determines whether or not any payment is required to enter data into the fieldRequired—determines whether entering data in the field is compulsory or optionalIn Category View—determines if the content of the field will show up in the category viewIn Details View—determines if the content of the field will show up in the details view

•

•

•

•

•

•

•


[ 170 ]

Our project requires that site users must be able to post into the directory free of charge. Therefore, we must modify the Description and the Website fields to permit posting without cost. In order to do this, click on the Description title to edit the field. You will be directed to a form, as shown in the following screenshot:

Chapter 8

[ 171 ]

In this form, we modify the default parameters as shown in the previous screenshot. Perform these steps for the Website field as well. Users are now able to post into the directory completely free of charge.

Entry ConfigurationSome rules also need to be set regarding matters such as:

If posting is allowed into the main categoryIf a single entry can be simultaneously added to more than one categoryIf the posting naturally expires and/or the duration is renewed before it doesIf anonymous posting is permitted, and if postings are automatically publishedIf users must accept the Terms and Conditions of the site before posting is admitted

•

•

•

•

•


[ 172 ]

These and other related rules can be set in the Entry Configuration section, which is accessed through the link on the left-hand side column of the Configuration page.

View ConfigurationThe View Configuration setting determines what is shown to site users and how this is presented. It is similarly accessed through the link on the left-hand side column of the Configuration page:

Typical parameters that may be adjusted include:

If unregistered users are permitted to see detailed viewsIf the date of entry should be shown in viewsIf Google Maps should be shown in detailed views

•

•

•

Chapter 8

[ 173 ]

Payment OptionsSOBI2 is preconfigured to accept payment for entries into the directory. If you eventually decide to start accepting payment for posting, you may reconfigure your payment details from the Payment Options page, which is shown in the following screenshot, and is accessed through the link on the left-hand side column of the Configuration page:

Typically, you can modify your bank payment and PayPal payment details. This is a simple enough procedure.

Other configuration on the left-hand side column of the configuration page, such as Language Manager, Registry Editor, Recount Categories, Uninstall SOBI2, may all be ignored as these are not relevant to this project.


[ 174 ]

Front pageWe need to make our site's front page the Category View of the SOBI2 directory. In order to do this, we must make the home page menu link point to the SOBI2 component. The quick and dirty way to do this is to locate the Menu Item Manager from Menus | Main Menu in the administration bar, and then click on the single Home menu link to modify it:

This will display the configuration page for this menu item. However, what we intend to do is to change the menu type from Front Page Blog Layout to SOBI2. In order to do this, select the Change Type button, as shown in the following screenshot:

Chapter 8

[ 175 ]

This opens the Change Menu Item page, from where we select SOBI2 and then Frontpage or Selected Category:

Save the new setting. If we now preview the home page to see how much has been completed, we will see the following result:


[ 176 ]

Let us click on the Add Entry link, and add some postings into the directory.

Chapter 8

[ 177 ]

All of the entries need to be approved by the administrator before appearing in the directory, so you must visit Components | SOBI2 | Entries Awaiting Approval and publish the entry:

Following is the detailed view of this entry when selected from the subcategory Houses for Rent | Offered:


[ 178 ]

SearchThe Search function is displayed on the main page and does not need to be configured.

PermissionsOur SOBI2 setup has been configured to accept anonymous postings. However, when an entry is anonymously submitted, you will notice a warning that it cannot be edited by a submitter unless he or she is properly registered on the Joomla! site and logged in. The default setting that permits only the administrator to approve and publish entries will adequately ensure that your site does not quickly become crippled by spam.

Finishing upOur site, as we can see from the preview, is completed. In real life, however, many more categories and subcategories may be required, but the procedure for doing this is still basically the same.

Adding functionalityThere are other directory extensions available that may do as good as a job as SOBI2. A search of the Joomla! extensions site—and especially the following page—will show some similar extensions:

http://extensions.joomla.org/extensions/directory-a-documentation/directory.

A lot of other extensions are also available to make your SOBI2 experience more exciting. These can be viewed on the following website:

http://extensions.joomla.org/extensions/extension-specific/sobi2-extensions.


Build a basic directory site by using SOBI2 component for Joomla!Configure the relevant SOBI2 basic settingsConfigure SOBI2 categories and subcategoriesConfigure the SOBI2 payment option

•

•

•

•

Nosh'r—Building a Photo Sharing Site

William and Elizabeth Bunter are organizing an online food appreciation community. They intend to enroll members from all over the world to share their food photos on their new website—Nosh'r. Here, the users will submit photos of their food for all of the other members to admire and rate by means of stars. Photos will be classified into several categories: starters, main courses, desserts, and drinks.

The Nosh'r website will have the following features:

Photo galleries for several food categories (starters, main courses, desserts, and drinks)A simple photo uploading form, which will also permit detailed descriptions of uploaded items to be enteredA star rating system and comment form for each added contribution

•

•

•

Nosh’r—Building a Photo Sharing Site

[ 180 ]

The completed website should look similar to the example shown in the following screenshot:

Build Nosh'rBilly and Bessie, as they are fondly known by their many friends from all over the world, will do anything for the promotion of gastronomic delights, and Nosh'r is a child of their zeal. On this website, registered users will be permitted to post pictures of the exciting foods and drinks that they have just consumed (taken before the food and drink are consumed), or that they have just discovered in an exotic eating place somewhere in the world. These photos will typically be accompanied by a description or a recipe and will be displayed in an image gallery on the website with facilities for other members to add comments and also to appreciate by means of a five-star rating system.

For this website to become a reality, we need to do the following:

Create an image galleryEnable the categorization of food images by class of food (starters, main courses, desserts, and drinks)Enable the rating of and commenting on submitted food images

•

•

•

Chapter 9

[ 181 ]

TemplateThe template chosen (and for no particular reason other than it looks pleasant for the project) is JA_Purity, which comes with the Joomla! 1.5 download.

ExtensionsThis site will be built entirely around the Phoca Gallery component, which is an image gallery for Joomla!. This component was chosen on the basis of popularity.

Other extensionsThe core module that will be used for this site is:

Main Menu module—creates primary navigation for the site pages

Install Joomla!When you are installing Joomla! 1.5 from the Full Package, you are given the option to install sample data also. Do not select this option or you will find your website preloaded with superfluous data—none of which is remotely relevant to this project.

Install Phoca GalleryPhoca Gallery can be downloaded from http://extensions.joomla.org. In order to install it, use the Extensions Manager from the top menu bar and navigate as usual to Extension | Install/Uninstall to upload the component. You will be led though the installation from the first screen, which is shown in the following screenshot:

•


[ 182 ]

After the installation is complete, you will see a new screen that shows you the Phoca Gallery Control Panel. From this page, we can add and delete images, and we can configure Categories, Themes, Category Rating, Image Rating, and Comments.

Let us, however, first create the categories.

CategoriesFor this simple project, the categorization of the image submissions will be quite basic, as follows:

StartersMain CoursesDessertsDrinks

Our food and drinks will need to be organized into these categories in order to group together similar food items.

•

•

•

•

Chapter 9

[ 183 ]

Create new categoriesTo create these new categories, click on the Categories button in the Control Panel. The page shown in the following screenshot is displayed:

We intend to first add Starters as a category. Therefore, click on the New icon to open the form shown in the following screenshot:


[ 184 ]

For this simple project, we will only be adding the category name and setting access levels. To add Geotagging functions, we will need to sign up for the Google Maps API Key. A specific key will be provided for the site. We will, however, not be setting Geotagging options, as it is not required for this simple project.

We need to add more categories, and will therefore repeat the process and save the additions until we have a page similar to the one shown in the following screenshot:

ThemesThemes determine how submitted images are displayed in the gallery—especially what the backgrounds look like. We will leave the default setting as it is, or else new themes will need to be uploaded. Themes can be downloaded from http://www.phoca.cz/themes/.

Global configurationOn the top right-hand side of the Control Panel, there is an icon titled Parameters, from which the global gallery configurations can be set. On clicking this icon, we are presented with a pop-up inset containing the display parameters and other configurable parameters, as shown in the following screenshot:

Chapter 9

[ 185 ]

The major gallery views are the category views and the detail views.

Category ViewsCategories View is a page where all of the gallery categories will be listed. In the Global Configuration box, we may set category view (thumbnails), category views (categories), and category views (category list). All of the settings may be left with their default values. In this case, however, we have changed the value of the Number of Columns in Categories View Settings (List of Categories) to 2, for a neater view.


[ 186 ]

Detail ViewThe Detail View is where details of an image will be displayed. It can be a standard JavaScript pop up or modal box, shadowbox, highslide pop up, JAK, and so on. We shall leave it at the default value, which is Modal Popup Box for Detail window.

In the summary for this particular project, we will adjust the following settings:

Category View Settings (Categories)Display Categories in Category View = YesDisplay Subcategories On Each Page = First PageDisplay image instead of folder icon = NoCategory Image Ordering = Date DescendingDisplay Back Button = No

•

•

•

•

•

Chapter 9

[ 187 ]

Display Categories View Back Button = NoNumber of Columns = 2Display Image Beside Category Name = ShowImage Size Beside Category Name = Small with Shadow

Categories View Settings (Category List)Number of Columns = 2Display Categories Style = categories, images, and detail informationImage Size Beside Category Name = Small with ShadowCategories Image Ordering = RandomDisplay Subcategories = YesDisplay Empty Categories = YesDisplay Unaccessible Categories = No

Description SettingsDisplay Description = Show (Standard)Display Title In Description = Yes

Comment SettingsDisplay Comments = YesComment Box Width = 500Maximum Comment Characters = 1000

Upload settingsDisplay Title = YesDisplay Description = YesMaximum Description Characters = 10000

The other settings we will leave with their default values.

•

•

•

•

•

•

•

•

•

•

•

•

•

•

•

•

•

•

•


[ 188 ]

Front pageWe need to make our site's front page the Category View of Phoca Gallery. To do this, the home page menu link needs to point to the Phoca Gallery component. The easy way to do this is to locate the Menu Item Manager from Menus | Main Menu on the administration menu bar. Then, we click on the single Home menu link, in order to modify it:

This will present us with the configuration page for this menu item. However, what we intend to do is change the menu type from Front Page to Phoca Gallery. In order to do this, click on the Change Type button:

Chapter 9

[ 189 ]

This brings up the Change Menu Item page, from where we select Phoca Gallery and then Phoca Gallery Category List Layout:

Although only registered users of the site may create an image, the means for users to register and to log in needs to be created. Save the new setting.


[ 190 ]

New user registrationTo create a link to the new user registration form, we again visit the Menu Item Manager from Menus | Main Menu on the top menu bar in administration. Then we click on the single New icon at the top right to create a new menu item. This will again lead us to the Menu Item page, from where we select Internal Link | User | Register | Default Registration Layout.

Chapter 9

[ 191 ]

This will take us to the page where we specify the item description. Here we will add Register as the menu item title (as shown in the following screenshot) and save:

To create the login menu item, we will repeat the same process, this time selecting Internal Link | User | Login | Default Login Layout. Add Login as the menu item title.


[ 192 ]

PermissionsOur Phoca Gallery setup has been configured to accept the posting of images and comments only by registered users who are logged in. Therefore, the image upload functions are not visible unless users are properly registered on the Joomla! site and logged in. The default setting, which only permits the administrator to approve and publish entries, will adequately assure that your site does not quickly become crippled by spammers.

Add imagesTo add some images to the gallery, click on the Images icon in the Phoca Gallery Control Panel. On the following page, click on the New icon at the top. What we intend to do is upload one image each for each of the categories that we have created.

To upload a new image from this administration backend, click on the Image button, as shown in the following screenshot:

Chapter 9

[ 193 ]

This will open a highlighted window from where you may either select an uploaded image or upload a fresh image. We shall be uploading a new image.


[ 194 ]

Once the image thumbnail has been uploaded into this panel, click on it to accept it into the new image creation form. Now complete the rest of the form by adding a title and a detailed description of the submitted image—in this case, a recipe.

Chapter 9

[ 195 ]

We repeat the same procedure for the other categories, after which our initial images list should look similar to the example shown in the following screenshot:

Finishing upTo finish up, we must select the JA_Purity theme as Default from Extensions | Template Manager.

Have we done this right?We can see what our front page looks like by using the Preview link on the top right-hand side of the administration page.


[ 196 ]

So far, however, we have added images from the backend administration area that other users will not have access to. However, if a registered user logs in from the frontend and clicks on any category, thumbnails of all of the images in that category will be shown, along with a comment form and an image upload form, as shown in the following screenshot:

Chapter 9

[ 197 ]

And finally, when any of the thumbnails are clicked on a larger-sized version of the image is shown in a pop-up window, along with the detailed description.

Other display characteristics can be reviewed in the Phoca Gallery Control Panel, by using the Parameters pop-up configuration panel.


[ 198 ]

Extending functionalityThis site was created for the sole purpose of listing images. It might be possible to add some other features, such as allowing payment for submission or download. A search through the Joomla! extensions site might yield some suitable additions. However, there are some other Phoca Gallery-specific extensions that could make the site more exciting to users. You may wish to have a look at the following pages for some inspiration:

Phoca Gallery extensions—http://extensions.joomla.org/extensions/extension-specific/phoca-gallery-extensions

Phoca download extensions—http://extensions.joomla.org/extensions/extension-specific/phoca-download-extensions


Build a basic site for publishing images uploaded by various users, by using the Phoca Gallery componentConfigure Phoca Gallery and its basic settingsCreate categories and associated views

•

•

•

•

•

Alienspotting—Building a Google Map Site

When Winston Groovy returned home to his wife, Rita, in Kingston, Jamaica, after being missing for two days, Rita was not amused. This was the third weekend in a row that Winston had claimed to have been abducted by aliens. But Winston really did seem quite sincere and sober ("Yeah man! dem mash me up," he claimed), and Rita was, as usual, very forgiving and quite happy to have her Winston back home. However, to save other people from the heartache of having their loved ones permanently lost to extra-terrestrial kidnappers, Rita Groovy has decided to create a website called Alienspotting, to aggregate occurrences of alien sightings all over the world. The website will consist of:

A description of encounters with aliens, including photos, if availableA means for the site users to comment on stories, with recent comments being shown in a side barA front-page world map, with each documented encounter appearing on this map as a marker

•

•

•


[ 200 ]

The completed site should look similar to the following screenshot:

Chapter 10

[ 201 ]

ExtensionsAlienspotting is built around the following contributed and core extensions, and can be surprisingly easy to build.

Core extensionsThe core modules that will be used for this site are as follows:

Main Menu module—creates primary navigation for the site pagesUser Menu module—allows selected menu items (such as the link to post articles) to be visible only to registered and logged-in usersLogin Form module—used for registered users to log in and for others to register

Contributed extensionsThe contributed modules and components that will be used for this site are as follows:

ContentMap module—to display articles on a Google mapJComments component—to provide the ability to add comments to postsJComments Latest module—to create a list of the most recent comments

TemplateAlienspotting will use the Alien template, which is a contribution to Joomla! by Hilliger Media, and which can be downloaded from www.joomla24.com.

Build AlienspottingIn order to create this website, we need to do the following:

Configure the ContentMap module to display content on a mapPermit articles to be commented onPut the most recent comments in a sidebar module

•

•

•

•

•

•

•

•

•


[ 202 ]

Enable modules and pluginsFirst, upload the module and component required, and then visit the Module Manager page, in order to ensure that the ContentMap module is enabled.

Configure ContentMapWe need to configure the ContentMap module before it can function. Before we do this, we need to get a Google Map API code specifically for this website; otherwise the Google map will not show. In order to do this, visit the Google Maps API page at http://code.google.com/apis/maps/signup.html. After successfully signing in with your Google account, you will be presented the following page, on which you will enter your website URL:

Chapter 10

[ 203 ]

After entering the URL, you will be presented the page shown in the following screenshot, from which you may obtain the required API code:

Again, navigate to the Module Manager page and click on the link for the ContentMap module. Insert the API Key, as shown in the following screenshot:


[ 204 ]

Create the front page Google mapNow the fun begins: How do we get the Google map full of articles on the front page?

1. Modify the existing Home menu link to display a Category List Layout, as shown in the following screenshot:

2. Select the Category to display. In this case, there will be only one category, as shown in the following screenshot:

Chapter 10

[ 205 ]

3. Adjust the parameters in the right-hand side pane to your display preferences. In this case, we have modified the following parameters:

Table Headings = Hide

Date Column = Hide

Filter = Hide

Primary Order = Default

Pagination = HideDisplay Select = Hide

Show Page Title = No

4. Open up the ContentMap module page once again, from Extensions | Module Manager. In the Position parameter, enter a non-existing position (in this case we have written "mappa"). Also, get the Category ID from the Category Manager page, and insert it as indicated. In this case, our Category ID for Spotting Locations category is 31:

°

°

°

°

°

°

°


[ 206 ]

5. Navigate to Content | Category Manager, select your category (in this case Spotting Locations) and insert the following code into the description box:{loadposition mappa}

We are done with configuring the ContentMap module.

Configure JCommentsJComments is required in order to allow users to add comments to the posted articles. Obtain the JComments component from Joomla! extensions site, and upload it. The initial installation screen should be similar to the example shown in the following screenshot:

Chapter 10

[ 207 ]

On clicking the Next button, you should be directed to the configuration page for JComments.

1. In the first General page, we will set where comments should be shown and how they will be shown.

2. In the Categories pane, we will select the lone categories, thus enabling the comments form to be shown for all articles site-wide.

3. In the Notification pane, we select No to enable comments to be published without the approval of the site administrator.

4. In the Miscellaneous pane, we select Yes to enable both RSS feeds and plugins.

We will, in this project, leave all of the other settings in the other configuration pages with their default values, but will deselect Enable CAPTCHA in the Permissions pane, to make submissions easier. In real life, CAPTCHA might be necessary to deter spammers.

You should also download the JComments Latest module and install it. This will automatically create a list of the most recent comments, in a box that can then be placed in module positions on the site. In this case, after enabling the module, we publish it to the right module Positon.


[ 208 ]

Test the article submissionLet us now test our article submission, and see how it works. In order to do this, click on the Add New Article icon in the Control Panel. You will get a form similar to the one shown in following screenshot:

Now add some articles, to ensure that you have successfully performed the tasks, taking care to select the Section and Category to which the article belongs.

Add the geographical coordinatesThe purpose of adding geographical coordinates to the articles is to be able to associate each to a specific position that can be seen on a Google map. The geographical coordinates consist of the longitude and latitude of a location, expressed in decimals, such as 51.5426,0.036707.

These coordinates must be added without spaces, and separated only by a comma, or else they will not be useful.

A good place to obtain the geographical coordinates of a place is the website http://www.turismo.eu/it/geo.html where you can calculate the coordinate by entering such information as the place name or postal code.

Chapter 10

[ 209 ]

We are adding all of our sample articles from the Administration Control Panel. In real life, however, it should be possible for permitted users to add articles from the front page, after they are logged in. This is one limitation of the ContentMap module, as it is only possible for the coordinates to be added by people logged in as an administrator and with backend privileges. Comments can be added as the site administrator decides.

Test JCommentsOn opening any article, you will find a comments box at the bottom of the page. This is where readers submit their comments. The comments will not be displayed, however, until they are approved by the site administrator.


[ 210 ]

Finishing upIf we display a preview of the front page, we will see that our project is complete. Clicking on any of the markers will reveal the title of the article that generated it. Now Rita knows where to start looking when Winston goes missing permanently.

Chapter 10

[ 211 ]

Extending the siteThis project is primarily used to add location markers to articles. The idea may be used for many other similar projects. An example is http://www.balispotting.com/, which made use of a different extension working in a different way, and specifically to locate public places.

The use of ContentMap is limited in the sense that it is a bit difficult for non-administrative users to add coordinates. There are several other extensions that may do the same job better than the ContentMap module, but which are unfortunately commercial. Nevertheless, some may be worth the purchase price.


Build a basic site based on the ContentMap moduleUse the ContentMap module to create a typical Google Map mash-upIntegrate a comment system, by using the JComments component

•

•

•

Weird Hap'nins—Building a News Aggregating Site

Bad news is always good news for the press. This is why Vaughan Pyre has decided to take advantage of this fact and create a website that will aggregate bad news and weird happenings from all over the world. The content of the site will be entirely derived from Really Simple Syndication (RSS) feeds from several sources (each feed being automatically fetched and its items displayed on the website).

Weird Hap'nins requirements will be the need to:

Get external feed sources and allocate them to menu links on the websiteCreate the means to automatically fetch and display article items located in the feedsDisplay the latest content from all feed sources on the front page

•

•

•


[ 214 ]

The completed news aggregation site will look similar to the example shown in the following screenshot:

Chapter 11

[ 215 ]

Build Weird Hap'ninsVaughan Pyre is a very ambitious webpreneur. What he really hopes for is a website that is completely self-maintaining, and on which he can place some Google AdSense blocks. Clicks from the visitors to his site will ensure that he makes lots of money. For this, he needs a site where the content updates regularly with fresh content so that visitors will keep coming back to click on some more Google ads. Vaughan's ultimate objective is to create several of these websites.

TemplateThe template chosen is Midnight by BuyHTTP, which is a template that fits the theme of this unique website.

ExtensionsThis is, surprisingly, a very simple site to build, and much of the requirements can be actually be achieved by using the native News Feeds component. However, the News Feeds component will only list the title links to the external feed items, whereas what Vaughan wants is that the feeds are pulled into the site as articles. Therefore, we will be using an automatic article generator component. There are several of such components on the Joomla! extensions site, but almost all of them are commercial. Vaughan is a skinflint and will not pay to buy any script, so what we are looking for is free component. That is why we have chosen the following:

4RSS—aggregates RSS feeds and creates articles from themJCron Scheduler—used for cron jobs management and scheduling to simulate cron jobs through the Joomla! frontend interface at preset intervals

Indeed, were it not for the fact that Vaughan needs the content to automatically be updated, we needn't use any extension other than the 4RSS component.

Other extensionsThe core module that will be used for this site is:

Main Menu module—creates the primary navigation functionality for the site pages

•

•

•


[ 216 ]

Sections and categoriesNew sections and categories will need to be created so that incoming article feeds will be correctly routed according to their description.

A new section will be created that we will call Feed. Under this section, we shall have three categories—Bad News, More Bad News, and Weird News.

Create a new sectionWe intend to create a section that will be named Feed. In order to do this, perform the following steps:

1. Navigate to the Section Manager from the Control Panel, and then click on the New icon at the top right-hand side, in order to create a new section.

2. On the next page, add the name of the section, and then save your changes.

Chapter 11

[ 217 ]

Create new categoriesTo create a new category, perform the following steps:

1. Navigate to the Category Manager page from the Control Panel.2. On the following page, create a new category in the same way as we created

the new section. However, remember to set the Section to Feed.

Feed contentVaughan has decided to initially use eight feeds (which are listed in the following sections), obtained from www.newsfeedmaker.com, for the different categories. It is from these RSS feeds that the articles will be created.


[ 218 ]

Bad NewsThe newsfeeds based on "bad news" as the topic of interest on www.newsfeedmaker.com are as follows:

http://www.newsfeedmaker.com/feed.php?code=ddb874f7

http://www.newsfeedmaker.com/show-feed/32bf1388

More Bad NewsThe newsfeeds based on "more bad news" as the topic of interest on www.newsfeedmaker.com are as follows:

http://www.newsfeedmaker.com/show-feed/faa72b04

http://www.newsfeedmaker.com/feed.php?code=e2d95271

http://www.newsfeedmaker.com/show-feed/028f06da

Weird NewsThe newsfeeds based on "weird news" as the topic of interest on www.newsfeedmaker.com are as follows:

http://www.newsfeedmaker.com/feed.php?code=936f006a

http://www.newsfeedmaker.com/show-feed/9493452f

http://www.newsfeedmaker.com/show-feed/0d7dcdbb

Configure the 4RSS componentAfter uploading the 4RSS component and installing it through Extensions | Install/Uninstall in the administration toolbar, access the component from Components | 4rss. This will provide a page, shown in the following screenshot, on which we shall specify the RSS feeds:

•

•

•

•

•

•

•

•

Chapter 11

[ 219 ]

To add a new RSS field, you need to click on the New icon. This will direct you to the Feed Set-Up page shown in the following screenshot:

On this page, we will do the following:

Add a specific name to identify each feed itemAdd the RSS feed URLSelect the Section and Category to which articles from the particular feed should goAdd keyword(s) if you are targeting only feeds with specific words in them, for SEO purposesSelect whether you want the articles from this feed to show on the front page (in our example: Yes)Select whether you want a link inside each article to the original source of the story (in our example: Yes)Select whether you want the articles to be checked for duplicate entries (in our example: Yes)

•

•

•

•

•

•

•


[ 220 ]

After we have added all of the feeds, the Feeds Management page should look similar to the example shown in the following screenshot:

Configure JCron SchedulerUpload the JCron Scheduler component, and install it through Extensions | Install/Uninstall on the administration toolbar.

The function of JCron Scheduler is to simulate cron jobs through the Joomla! frontend interface, at preset intervals, by users who either don't have access to the server crontab or don't want to use it. By default, it also installs and enables the JCron plugin. You need this enabled in order to make the cron jobs run. Therefore, check Extensions | Plugin Manager to ensure that the plugin is enabled.

We will need some information from the 4RSS component in order to make it function with JCron Scheduler—specifically the location of the site's cron script. In order to obtain this location, we return to the 4RSS Feeds Management page and click on the 4RSS Cron tab. On the Set Up Cron page, locate the information that we need, and copy it. In this case, the information is as follows:

C:\wamp\www\weirdjoomla\administrator\com_4rss\cronjob_4rss\cronjob.php

Chapter 11

[ 221 ]

We now open the JCron Scheduler via Components | JCron | Manage Cron Jobs, in order to create a fresh cron job, as shown in the following screenshot:

On this page, we have:

Given the cron task a name (4RSS).Selected a task type (Web Address fopen()).Entered a command to run. A sample command is Php –q /home/xxxx/public_html/cronjobs/cronjob.php > /dev>null. Replace /home/xxxx/public_html/cronjobs/ by the actual path of your script. For this project, the following path, which is derived from the cron job script location that we had earlier copied, should be added:

Php C:\wamp\www\weirdjoomla\administrator\com_4rss\cronjob_4rss\ cronjob.php /dev>null

Created the schedule. The example schedule shown will run the cron script to get fresh articles at midnight, every day, and every month.

•

•

•

•


[ 222 ]

Add articlesWe now return again to the 4RSS Feeds Management page, select all of the feeds, and click on Post on the top right-hand side, in order to fetch the feeds:

Configure the front pageVaughan needs only five articles on the front page. These articles will be randomly selected from the entire Feeds section. In order to achieve this, the front page will be configured through the Main Menu item that links to it—the Home menu link.

To configure the front page for this display, navigate to the Menu Item Manager page again, and then click on the lone Home menu link, which, as we see from the table, links to the Front Page.

On the next page, we change the parameters to what we need on the front page and then save our changes, as shown in the following screenshot:

Chapter 11

[ 223 ]

Other menusOur objective is to create menus that link to articles drawn from each of the three different categories. In other words, we want to create the following menu links:

Bad News—links to articles from the Bad News categoryMore Bad News—links to articles from the More Bad News categoryWeird News—links to articles from the Weird News category

In order to do this, again access the Menu Item Manager page from Menus | Main Menu. Create a new menu item by clicking on the New icon. On the next page, select Articles | Category | Category Blog Layout, as shown in the following screenshot:

•

•

•


[ 224 ]

Set the parameters for the menu link and also for the page to be displayed. The following screenshot shows the settings for the Bad News link:

The other two links—More Bad News and Weird News—are created in the same way.

Chapter 11

[ 225 ]

Finishing upWe now make sure that our Midnight template is selected as Default in Extensions | Template Manager. If we now click on the Preview link, our front page will look similar to the example shown in the following screenshot:


[ 226 ]

The page for a category view page such as Weird News should look similar to the example shown in the following screenshot:

Chapter 11

[ 227 ]


Build a basic site for publishing news feeds, by using the 4RSS componentUse the JCron Scheduler component to run regular site tasks

•

•

Templates and ExtensionsCHAPTER 2

VERSION DOWNLOAD PAGETEMPLATEbeez Core TemplateEXTENSIONSDOCman component 1.5.2 http://www.joomlatools.eu/docman-14.html

CHAPTER 3VERSION DOWNLOAD PAGE

TEMPLATErhuk_milkyway Core TemplateEXTENSIONS

JComments component

2.1.0.0 http://www.joomlatune.com/jcomments-downloads.html

JComments Latest module

2.5.4 http://www.joomlatune.com/jcomments-downloads.html


TEMPLATENewstheme http://www.joomla24.com/

EXTENSIONSAgora component 3.0.095 http://jvitals.com/

Agora latest Posts http://jvitals.com/

Templates and Extensions

[ 230 ]


TEMPLATECome Dance http://www.joomla24.com/

EXTENSIONSJEvents Component 1.5 http://www.jevents.net/jevents-download

JEvents Mini-Calendar module

http://www.jevents.net/jevents-download

JEvents Latest Events Module


JEvents Search Plugin



TEMPLATENews StudioAlfa http://www.joomla24.com/

EXTENSIONSCommunity Builder—components and modules

CB 1,2 http://www.joomlapolis.com/component/option,com_docman/Itemid,36/

JComments 2.1.0.0 http://www.joomlatune.com/jcomments-downloads.html



Simplest Forum 1.5.1 http://simplestforum.org

jPFChat 2.1.1 http://www.jpfchat.com/index.php/downloads


TEMPLATEsiteground-j15-101 http://download.siteground.com/

joomla15/siteground-j15-101.zip

EXTENSIONSVirtueMart component

1.1.4 http://virtuemart.net/downloads

Appendix

[ 231 ]


TEMPLATErhuk_milkyway Core TemplateEXTENSIONSSOBI 2 - Content Construction Kit (CCK) and Directory Component

RC 2.9.2.3 http://www.sigsiu.net/download/components/sigsiu_online_business_index_2.html


TEMPLATEJA_Purity Core Template

EXTENSIONSPhoca Gallery component

2.5.8 http://www.phoca.cz/download/category/1-phoca-gallery-component


TEMPLATEAlien http://www.joomla24.com/

EXTENSIONSContentMap module 1.0.0 http://www.turismo.eu/en/news/

contentmap-for-joomla.html

JComments component

2.1.0.0 http://www.joomlatune.com/jcomments-downloads.html



Templates and Extensions

[ 232 ]


TEMPLATEMidnight by BuyHTTP

http://www.joomla24.com/

EXTENSIONS4RSS 1.3 http://www.4rss.com/download-4rss-

component/

JCron Scheduler 1.4 http://extensions.joomla.org/extensions/administration/admin-performance/847

IndexSymbols4RSS

URL, for downloading 2324RSS component, news aggregating site

configuring 218-220

AAbout Us link, Buzzy Beez's site

adding 45-47About Us page, Buzzy Beez's site

creating 33-35Absolute Beginner's Guide to Joomla!

URL 21Africa link, events site

adding 105Africa link, Global Hitchhikers Club site

adding 66Agora component 76

URL, for downloading 229Agora latest post basic module 83Agora latest Posts

URL, for downloading 229Agora latest Posts (basic version) 76Alien

URL, for downloading 231alienspotting. See Google Map Sitearticles, news aggregating site

adding 222articles, newspaper site

article submission, testing 80front page, configuring 77new categories, creating 79new section, creating 78, 79organizing 76

user, settings 76article submission, Global Hitchhikers Club

siteblog posts, adding 61testing 61

article submission, Google Map sitegeographical coordinates, adding 208, 209testing 208

article submission, newspaper sitetesting 80

BBeez template

URL, for downloading 229blog extensions 71Breakin' Events site. See events siteBuzzy Beez's site

building 30, 31content 33extensions 31finishing 51template 31template, installing 32

Ccalendar events blocks, events site 106, 107calendar pane, JEvents component

configuring 100categories, events site

configuring 101, 102categories, Global Hitchhikers Club site

creating 59categories, news aggregating site

creating 217

[ 234 ]

categories, newspaper sitecreating 79

category, community sitecreating 118, 119

chat 71chat, community site

configuring 122coe module, news aggregating site

main menu 215Come Dance template

URL, for downloading 230comments system, community site

creating 122-124comments system, Global Hitchhikers

Club sitecreating 62JComments Latest module 63

community builder, community siteabout 114cb_expert_files_only_j_1.5.tar.gz file 114cb_expert_files_only_m_4_j_1.0.tar.gz file

114com_comprofiler.zip file 114configuring 115, 117extension, URL 129files 114mod_cblogin.zip file 114mod_comprofilerModerator.zip file 114mod_comprofilerOnline.zip file 114README-NEW-INSTALL.txt file 115README-UPGRADE.txt file 115

community siteabout 111building 113chat, configuring 122comments system, creating 122-124community builder, configuring 114, 115content 114extensions 113finishing up 129forums, configuring 121, 122functionality, adding 128, 129menus 125new category, creating 117new modules, creating 124new section, creating 117polls, configuring 119-121

template 113component pane, JEvents component

configuring 95components 26contact form, Buzzy Beez's site

creating 42, 43contacts component, Buzzy Beez's site 31Contact Us link, Buzzy Beez's site

adding 50content, Buzzy Beez's site

About Us page 33-35contact form, creating 42, 43document repository, creating 38, 39latest information posts, creating 36, 37

content, community site 114content, Global Hitchhikers Club site

article submission, testing 61comments system, creating 62, 63displaying 65front page, configuring 57module, positions 63, 64new categories, creating 59new section, creating 58user, settings 57

Content Construction Kit (CCK) 21content display, Buzzy Beez's site

about 44About Us link, adding 45-47contact us link, adding 50downloads link, adding 49latest company news link, adding 48latest Product News link, adding 48latest product news link, adding 47

content display, events siteAfrica link, adding 105calendar blocks 106, 107front page display, altering 106global link, adding 104, 105latest events blocks 106, 107other continent links, adding 105

content display, Global Hitchhikers Club site

Africa link, adding 66, 67content links, adding 67, 69

content display, newspaper siteforum link, adding 87news section link, adding 85

[ 235 ]

other section links, adding 86ContentMap module

about 201URL, for downloading 231

ContentMap module, Google Map siteconfiguring 202, 203

continent links, events siteadding 105

continents links, Global Hitchhikers Club site

adding 67-69contributed components, Buzzy Beez's site

DOCman component 31contributed extensions, community site

communtiy builder 114JComments 114jPFChat 114simplest forum 114

contributed extensions, events siteJEvents component 94JEvents Latest Events Module 94JEvents Minicalendar module 94JEvents Search Plugin 94

contributed extensions, Global Hitchhikers Club site

JComments component 56JComments Latest module 56

contributed extensions, Google Map siteContentMap module 201JComments component 201JComments Latest module 201

contributed extensions, newspaper siteAgora component 76Agora latest Posts (basic version) 76

contributed modules and components, Google Map site

ContentMap module 201JComments component 201JComments Latest module 201

control panel, Joomla! siteglobal configuration 24site backup 24template, settings 23

core components and modules, Buzzy Beez's site

contacts component 31main menu module 31

core extensions, community sitemain menu 113polls 113

core extensions, events site 93core extensions, Global Hitchhikers Club

sitelogin form module 56main menu module 56popular module 56search component 56search module 56top menu module 56user menu module 56

core extensions, Google Map sitelogin form 201main menu 201user menu 201

core extensions, newspaper sitelogin form module 75main menu module 75popular module 75search component 75search module 75top menu module 75user menu module 75

core modules, Google Map sitelogin form 201main menu 201user menu 201

core modules and components, newspaper site

login form module 75main menu module 75popular module 75search component 75top menu module 75user menu module 75

Cron Scheduler 21

DDaily Joomer. See newspaper sitedirectory site

about 155building 156extensions 156finishing up 178

[ 236 ]

functionality, adding 178Joomla!, installing 157SOBI2, installing 157template 156

DOCman component 31URL, for downloading 229

document repository, Buzzy Beez's sitecreating 38-41

downloads link, Buzzy Beez's siteadding 49, 50

Ee-commerce site

building 132extensions 133finishing up 152functionality, adding 153products, displaying 147, 148template 133VirtueMart configurations 133

entry configuration, directory siterules 171, 172

event detail view pane, JEvents componentconfiguring 97

event editing pane, JEvents componentconfiguring 96

events sitebuilding 93content, displaying 104event submission form, creating 102, 103extensions 93finishing 109functionality, extending 110JEvents component, configuring 94new categories, creating 101, 102template 93

event submission form, events sitecreating 102, 103

extensions, Buzzy Beez's sitecontacts component 31contributed components 31core components 31main menu module 31

extensions, community sitecontributed extensions 114core extensions 113, 114

extensions, directory siteDirectory Component for Joomla! extension

156main menu 157other extensions 156SOBI2 156

extensions, e-commerce site 133extensions, events site

contributed extensions 94core extensions 93

extensions, Global Hitchhikers Club siteabout 55contributed extensions 56core extensions 56

extensions, Google Map siteabout 201contributed extensions 201core extensions 201

extensions, news aggregating site4RSS 215about 215JCron Scheduler 215other extensions 215

extensions, newspaper sitecontributed extensions 76core extensions 75core modules and components 75

extensions, photo sharing sitemain menu 181other extensions 181

Ffeed content, news aggregating site

4RSS component, configuring 218-220about 217articles, adding 222bad news 218front page, configuring 222JCron Scheduler, configuring 220-222more bad news 218other menus 223, 224weird news 218

form fields, directory siteabout 168field label 169field type 169

[ 237 ]

for free 169in category view 169in details view 169published 169required 169

forum 71forum link, newspaper site

adding 87forums, community site

configuring 121, 122forums, newspaper site

creating 81Have Your Say forum, creating 82module, positions 83, 84

front page, directory site 174-177front page, news aggregating site

configuring 222front page, newspaper site

configuring 77front page, photo sharing site 188, 189front page display, events site

altering 106front page display, Global Hitchhikers Club

siteconfiguring 57

front page Google map, Google Map sitecreating 204-206

Gglobal configuration, photo sharing site

about 184, 185category view 185category view settings (categories) 186, 187category view settings (category list) 187comments settings 187description settings 187detail view 186upload settings 187

Global Hitchhikers Club sitebasic site, improving 71building 55content 56content, displaying 65extensions 55features 53finishing 70template 55

global link, events siteadding 104, 105

Google Map sitearticle submission, testing 208building 201ContentMap, configuring 202, 203contributed modules 201contributed modules and components 201core modules 201extending 211extensions 201finishing 210front page Google map, creating 204-206JComments, configuring 206-208JComments, testing 209modules and plugins, enabling 202template 201

Gzip 26

HHave Your Say forum, creating 82

Iimages, photo sharing site

adding 192-195installation, Joomla!

manual installation 18on local computer 8on localhost 9, 10on non-Windows localhost, URL 17on remote server 17on WampServer 8

JJA_Purity template

URL, for downloading 231JA Uvite template 72JComments, community site 114JComments, Google Map site

configuring 206, 207testing 209

JComments componentabout 56, 114, 201URL, for downloading 229-231

JComments Latest module 56, 63, 201

[ 238 ]

URL, for downloading 229-231JCron Scheduler

URL, for downloading 232JCron scheduler, news aggregating site

configuring 220-222JEvents component

URL, for downloading 230JEvents component, events site

calendar pane, configuring 100component pane, configuring 95configuring 94event detail view pane, configuring 97event editing pane, configuring 96latest events pane, configuring 100, 101main monthly calendar pane, configuring

98permissions pane, configuring 96RSS pane, configuring 99year/category view pane, configuring 98

JEvents Latest Events Module 94URL, for downloading 230

JEvents Mini-Calendar moduleabout 94URL, for downloading 230

JEvents Search Plugin 94URL, for downloading 230

Joombook. See community siteJoomgets Inc. See e-commerce siteJoomla!

backend administration 18Buzzy Beez's site, sample site 29events site, sample site 91Global Hitchhikers Club, sample site 55installing, on local computer 8installing, on remote server 17installing, on WampServer 8new categories, creating 20new section, creating 20newspaper site, sample site 73resources, URL 21, 22system, requisites 7

Joomla!, installingmanual installation 18on local computer 8on localhost 9, 10on ocal computer 8on remote server 17

on remote server, without Fantastico 17on WampServer 8

Joomla!, installing on local computerneed for 8

Joomla!, installing on localhostdatabase configuration 12finishing 15, 17FTP configuration 13, 14language, selecting 10, 11license page 11main configuration 14, 15pre-installation check 11steps 9, 10

Joomla!, installing on remote serversteps 17

Joomla!, installing on WampServersteps 8

Joomla!, photo sharing siteinstalling 181

Joomla! 1.5installing, on localhost 9

Joomla! basic site, improvingblog extensions 71chat 71forum 71RSS feed module 72social bookmarking 71template 72

Joomla! Community MagazineURL 22

Joomla! componentCron Scheduler 21

Joomla! extensionsabout 20Content Construction Kit (CCK) 21Cron Scheduler 21Modules Anywhere extension 21

Joomla! extensions siteURL 178

Joomla! ForumsURL 22

Joomla! Frequently Asked Questions (FAQ)URL 22

Joomla! Help siteURL 22

Joomla! QuickstartURL 22

[ 239 ]

Joomla! showcase pageURL 154

Joomla! showcase siteURL 129

Joomla! site, optimizingabout 25Gzip 26system cache 25techniques 26

Joomla_1.5_quickstart.pdfURL 22

Joomlaburg Accommodations. See directory site

JoomlArtJA Uvite 72

jPFChatURL, for downloading 230

jPFChat 114

Llatest company news link, Buzzy Beez's site

adding 49latest events blocks, events site 106, 107latest events pane, JEvents component

configuring 100, 101latest information posts, Buzzy Beez's site

Company News category, creating 37creating 36, 37Latest Information section, adding 36Product News category, creating 37

latest product news link, Buzzy Beez's siteadding 47, 48

local computerJoomla!, installing 8

localhostJoomla!, installing 9, 10

login form 201login form module 56, 75

Mmain menu 113, 157, 181, 201main menu module 31, 56, 75main menu module, Buzzy Beez's site 31main monthly calendar pane, JEvents

componentconfiguring 98

menus, community siteabout 125blogs menu, creating 127CB menus, creating 128chat menu, creating 125forums menu, creating 126, 127poll menu, creating 127

menus, news aggregating sitebad news 223creating 223more bad news 223weird news 223

Midnight by BuyHTTP templateURL, for downloading 232

module manager page 19module positions, Global Hitchhikers Club

site 63, 64module positions, newspaper site

about 83, 84Agora latest post basic module, enabling 83

modules, community sitecreating 124front page 124

modules and plugins, Google Map siteenabling 202

Modules Anywhere extension 21

Nnews aggregating site

building 215categories, creating 217extensions 215feed content 217finishing up 225sections, creating 216template 215

newspaper sitearticles, organizing 76content, displaying 85Daily Joomer online, building 75extensions 75finishing 88forums 81template 75

news section link, newspaper siteadding 85

News StudioAlfa template 230

[ 240 ]

Newstheme templateURL, for downloading 229

new user registration, photo sharing site 190, 191

Nosh'r. See photo sharing site

Ooptimization techniques, Joomla! site

components 26SEF 27templates 26

other section links, newspaper siteadding 86

Ppayment options page, directory site 173permissions, directory site 178permissions, photo sharing site 192permissions pane, JEvents component

configuring 96Phoca download extensions, URL 198Phoca Gallery, photo sharing site

categories 182installing 181, 182new categories, creating 183, 184themes 184

Phoca Gallery extensions, URL 198, 231photo sharing site

building 180, 181extensions 181finishing up 195front page 188, 189functionality, extending 198global configuration 184, 185images, adding 192-195Joomla!, installing 181new user registration 190, 191permissions 192Phoca download extensions, URL 198Phoca Gallery, installing 181, 182Phoca Gallery extensions, URL 198template 181

polls 114polls, community site

configuring 119-121popular module 56, 75

products, e-commerce sitedisplaying 147-152

QQuick Start to Joomla!

URL 21Quick Start to Joomla! video

URL 22

Rremote server

Joomla!, installing 17rhuk_milkyway template

URL, for downloading 229, 231RSS feed 72RSS pane, JEvents component

configuring 99

Ssample site, Joomla!

Buzzy Beez's site 29events site 91Global Hitchhikers Club site 55newspaper site 73

search component 56, 75search functionality, directory site 178search module 56, 75section, community site

creating 118section, Global Hitchhikers Club site

creating 58section, newspaper site

creating 78, 79sections, news aggregating site

creating 216SEF 27simplest forum 114

URL, for downloading 230simplest forum, community site 114siteground-j15-101 template

URL, for downloading 230SOBI2, directory site

background page 162caching 161

[ 241 ]

categories 164, 165debug page 161downloading 157entry configuration 171, 172form fields 168-170front page 174-177general pane 158installing 157Mainpage 159, 160new categories, creating 165, 167other settings 163, 164payment options page 173permissions 178search functionality 178search options pane 160sigsiu tree page 162subcategories, creating 168systems email page 160URL, for downloading 231view configuration setting 172

SOBI2 categories, directory sitehouses for rent (offered and wanted) 164,

165houses for sale (in Joomlaburg and

elsewhere) 165houses to share (offered and wanted) 164,

165new categories, creating 165, 166subcategories, creating 168

SOBI2 payment options page, directory site 173, 174

social bookmarking 71social extensions 71system cache 26

Ttemplate 26template, Buzzy Beez's site

about 31installing, steps 32

template, community siteNews StudioAlfa template used 113

template, directory siterhuk_milkyway template used 156

template, e-commerce sitesiteground-j15-101 used 133

template, events site 93

template, Global Hitchhikers Club site 55template, Google Map site

Alien template used 201template, news aggregating site

Midnight template used 215template, newspaper site

Newstheme used 75template, photo sharing site

JA_Purity template used 181top menu module 56, 75

Uuser menu 201user menu module 56, 75user settings, Global Hitchhikers Club site

57user settings, newspaper site 76

Vview configuration, directory site 172Virtuemart component

URL, for downloading 230VirtueMart configurations, e-commerce site

about 133-135Category Tree icon 141, 142Category Tree icon, Product Images page

143Category Tree icon, Product Information

page 142, 143Configuration icon 138, 139Edit Store icon 135-137List Payment Methods icon 140Product List icon 140shippers tab 145, 146shipping rates 146, 147

WWampServer

Joomla!, installing 8Weird Hap'nins. See news aggregating site

Yyear/category view pane, JEvents

componentconfiguring 98

Thank you for buying Joomla! 1.5 Site Blueprints

About Packt PublishingPackt, pronounced 'packed', published its first book "Mastering phpMyAdmin for Effective MySQL Management" in April 2004 and subsequently continued to specialize in publishing highly focused books on specific technologies and solutions.

Our books and publications share the experiences of your fellow IT professionals in adapting and customizing today's systems, applications, and frameworks. Our solution based books give you the knowledge and power to customize the software and technologies you're using to get the job done. Packt books are more specific and less general than the IT books you have seen in the past. Our unique business model allows us to bring you more focused information, giving you more of what you need to know, and less of what you don't.

Packt is a modern, yet unique publishing company, which focuses on producing quality, cutting-edge books for communities of developers, administrators, and newbies alike. For more information, please visit our website: www.packtpub.com.

About Packt Open SourceIn 2010, Packt launched two new brands, Packt Open Source and Packt Enterprise, in order to continue its focus on specialization. This book is part of the Packt Open Source brand, home to books published on software built around Open Source licences, and offering information to anybody from advanced developers to budding web designers. The Open Source brand also runs Packt's Open Source Royalty Scheme, by which Packt gives a royalty to each Open Source project about whose software a book is sold.

Writing for PacktWe welcome all inquiries from people who are interested in authoring. Book proposals should be sent to [email protected]. If your book idea is still at an early stage and you would like to discuss it first before writing a formal book proposal, contact us; one of our commissioning editors will get in touch with you. We're not just looking for published authors; if you have strong technical skills but no writing experience, our experienced editors can help you develop a writing career, or simply get some additional reward for your expertise.

Building Websites with Joomla! 1.5ISBN: 978-1-847195-30-2 Paperback: 384 pages

The best-selling Joomla! tutorial guide updated for the latest 1.5 release

1. Learn Joomla! 1.5 features

2. Install and customize Joomla! 1.5

3. Configure Joomla! administration

4. Create your own Joomla! templates

5. Extend Joomla! with new components, modules, and plug-ins

Joomla! 1.5 Development CookbookISBN: 978-1-847198-14-3 Paperback: 360 pages

Solve real world Joomla! 1.5 development problems with over 130 simple but incredibly useful recipes

1. Simple but incredibly useful solutions to real world Joomla! 1.5 development problems

2. Rapidly extend the Joomla! core functionality to create new and exciting extension

3. Hands-on solutions that takes a practical approach to recipes - providing code samples that can easily be extracted

Please check www.PacktPub.com for information on our titles

Joomla! 1.5 SEOISBN: 978-1-847198-16-7 Paperback: 324 pages

Improve the search engine friendliness of your web site

1. Improve the rankings of your Joomla! site in the search engine result pages such as Google, Yahoo, and Bing

2. Improve your web site SEO performance by gaining and producing incoming links to your web site

3. Market and measure the success of your blog by applying SEO

4. Integrate analytics and paid advertising into your Joomla! blog

Joomla! 1.5 Template DesignISBN: 978-1-847197-16-0 Paperback: 284 pages

Create your own professional-quality templates with this fast, friendly guide

1. Create Joomla! 1.5 Templates for your sites

2. Debug, validate, and package your templates

3. Tips for tweaking existing templates with Flash, extensions and JavaScript libraries

Please check www.PacktPub.com for information on our titles

Documents

Joomla! 1.5 Site Blueprints