Joomla Integration Guide

Version 1.0

Written by Thumann

Table of Contents

Preface

Foreword
Audience
Requirements
Todo list

Joomla Installation

Introduction
Prerequisites
Installation
The Basics
Look & Feel

Roster Installation

Installation
Configuration

Wrapping in Joomla

The basics
WowRoster
EQDKP

Preface

Foreword

After having run/designed homepages for years.. I, like many else, had gotten tired of all the manual content that needed to be maintained.. and a simple task as adding a new article to your page could take hours..

Solution? Well, that’s a simple question to answer; CMS!
CMS?! Yeah.. that’s right.. CMS! Content Management System

There are hundreds of CMS systems out there.. just do a quick google on it..and you’ll find a million hits… both open source an commercial products..

This guide is based on Joomla CMS (a “port” of the Mambo CMS), which I’ve come to like very much, you might like another one.. but then you should be reading another guide! :-p

Audience

This guide is mainly targeted at the many fine people at wowroster.com, where I in detail will describe the methods used to integrate the wowroster into the Joomla cms.
Others may of cause also find this useable, and it shows just how easy joomla is to work with :)

Requirements

Okay.. like any good cookbook, we need to do some shopping!

Run to the store and get the following things for mom:

Todo list

Adding phpBB joomla integration guide (50% complete)

Joomla Installation

Introduction

In this chapter we'll go through the installation of joomla in detail, but please take note that setups will vary since we don’t all have identical hosting providers. In the example used in the this guide the hosting provider has enabled php, so the joomla installation needs a patch to function optimal.

We'll also talk about the basics of joomla; creating content, linking and the templates.

But let's get started!

Prerequisites

Unzip the latest joomla package ( Joomla_1.0.0_to_1.0.10-Stable-Patch_Package.zip at the time of writing) and upload it to your web servers root folder,or where ever you decide to place it, using an ftp client or what ever you have available..
In case your web server has PHP Safe Mode enabled, you need the safemode patch from http://developer.joomla.org/sf/frs/do/viewSummary/projects.safejoomla/frs
You should also have a mysql database ready along with a username and password for it.

Note: Do yourself a favor and read the installation procedure for everything you install.. they aren’t written just for the heck of it.. they often contain good tips that saves you that trip to the forums asking, already answered, questions ;)

Installation

Good, Fire up your favorite web browser and access your site @ http://server.com/path/to/joomla  (I installed it in the root folder of the server) so it's http://roster.thumann.dk in this guide.
Here you’ll be greeted by the main installation screen of joomla, it’s main task is to check your system for the requirements needed for joomla to function properly.

!And remember, the screens may vary depending on your setup!

As you can see on the picture above, safe mode is turned on.
Joomla won't function very well with this turned off, and there's usually no way to turn it off if your hosting provider has turned it on.

Joomla running in safe mode will limit the functionality of the built in component installer, so it will be hard to add new features to your joomla; but luckily there's a patch available for us less fortunate ;)
Extract the patch files and overwrite the existing joomla files under the admin directory.

Good, that being settled (note.. the status won't change after you upload the patch) lets move on..
What we should focus on here in the next section, is making stuff write able.. as you can see on the image below , there’s a whole list of directories we need to fix permissions on.
So let's start with that:

Take one by one of the directories and make them write able (chmod 777 as shown in the picture below)
The reason why i show the chmod way of changing directory & filer permissions, is because it's the most commonly used I believe. And all ftp clients more or less support this.

Change them all and hit f5 to refresh the screen.
As you can see.. the directories are now write able..

Let’s continue...

Read, understand and accept the license agreement and proceed to fill in your host information, such as host name (usually localhost), username, password and database.
Since we want a very clean joomla, remove the check mark so it DOESN’T install sample content



If you entered the server information correctly, you can now give your new joomla site a title! :-D

Continue and enter your email address and chose an admin password for the site. (or stick with the random one it generates) and write it down!

Good.. the setup is now complete.. You have installed Joomla CMS! :-D
Click in the field below (the one with the configuration) it will mark all the text..
Copy/paste it into a document and call it configuration.php.
Delete the Installation directory from the root of the joomla folder

You now have a working joomla installation. Click ‘View Site’ in the top right corner!


If you see this message.. then you aren't paying enough attention! :-p
Delete the installation directory.

Ahh.. that’s better!

The Basics

Since I can’t/won’t go through all the aspects of running a joomla site.. I’ll hereby direct you towards the many guides and great documentation online that can be found @ www.joomla.org so start reading..

But! I’ll explain some of the basics..
Well.. our currently front page was very boring.. we didn’t have any news.. only one link in the menu which loads the front page again, and no content what so ever..

We'll start by logging into the administration panel of joomla (called the backend).
Enter the address in your browser and login with the info you wrote down earlier (you did write it down right? :-p)
http://roster.thumann.dk/administrator/

When we reach the backend of Joomla we can see a big group of buttons in the lower left corner, they are the most commonly used functions.
Now.. to add some content to our site!

We can start by making a news message on the front page saying that the new guild site is up and under development! :)

Click the ‘Section Manager’ so we can create a new section for our content.
And then click the ‘New’ button in the top right corner and enter as shown below:'

Click the save button in the top right corner.
We now have a section called Newsflashes.

Click the Home button in the top left corner, And then  click the ‘Category Manager’ so we can create a new category.
Category’s in joomla are used to ‘group’ content together.

Click the ‘New’ button in the top right corner and fill in as shown below.

Since we only have one section, the section property is automatically selected.

Click the save button to save your new category.
Click the home button to return to the backend main menu.

Now! For some content finally!

Click the ‘Create new content button’
Give the new content a title, select the Newsflashes Section and the Newsflashes Category.
And Write a message like shown below.

In the right portion of the screen you can see a menu.
This menu controls the content you’re working on.
From here we can do a number of things, where the two most important settings, for us, are the ‘Shown on FrontPage’ and the ‘Published‘ check marks.
Check them both to have our new content displayed on the front page! Then click save.

If you take a look at your front page now, you’ll see it has gotten some new content! :)

But hey… our newly created message doesn’t show up in the newsflash thing in the top right corner.. what’s up with that? :-/
Simple! ;)
In the Backend select ‘Site Modules’ from the Modules menu at the top.
Here you’ll see a list of the modules currently installed in your joomla.

Basically.. Joomla consists of Components, Mambots, Modules and content …

Scroll down the list until you find the ‘Newsflash’ module and click on it.
From here you can change the settings of the module selected.
The first part is more or less always the same, but the parameters part of a module is often different.

From here you can select if the module should be published or not (enabled for the user) and if it should be displayed somewhere on the front page..
But! Since the module is already shown.. let’s head for the parameters part..

In the category field select our Newsflashes category.
We’ve now told the module to look for content in the newsflashes category.
Now click save and take a look at the main page again.

Bingo! All our future newsflashes will now also be displayed here!

All right, we’ve now mastered the art of content creating.. so go create a new category and section for your regular pages/articles, It can’t be news it all!

Okay, let’s try to create a link to thottbot.com in our main menu, it’s kind of boring with only one option.
Login to the Backend, And in the menu called ‘Menu’ select the ‘mainmenu’ (that sounded weird.. but you get my point)

Since we only have the ‘Home’ link, let’s create a new one..
Click new in the top right corner.
Here you’ll get a long list of options for the various link types your joomla currently supports.
Since we want to make a hyperlink to thottbot.com select the ‘Link – Url’ in the lower right corner and click next in the top right corner.
On the next screen you create the link itself, so fill in the data as below

Make sure ‘yes’ is selected in published so we can see it in the menu.
Good, now click save and take a look at your front page again.

Ahh nifty ^^

Look & Feel

Good, you now have some content and a menu link to press…

It’s not much.. but it’s something :)

Now.. if you think the current template your joomla is using is kind of boring..
Fire up google and search for joomla templates and there should be plenty of sites to choose from..

Many of the sites are terrible.. and you need to register on most of them in order to download the templates.. but.. do so.. and find one you like and download it..

I found one called Kashmir_black with two dancing pigs… I suggest you find one a bit more meaningful but this one will do nicely since this is just an example..

Extract the package you’ve downloaded and upload it to your template dir in the joomla root dir.

After that, go to your backend and from the Site menu select Template manager and then Site templates.

You should now be able to see the template(s) you’ve uploaded.

Select the one you want to be your default template and click the button called ‘Default’ in the top right corner.

As you can see on the front page now.. it certainly looks different! :-D

See, that was easy! :) now find one you like, or create your own template..

Just google for Joomla template tutorial and you can get started!

Roster Installation

Installation

We'll install the roster in a subdirectory of joomla for two reasons.

  1. To have some order in our structure
  2. We don't want joomla files mix with roster files!

Good, so create a directory called apps in your joomla root dir, and upload your extracted roster files to the dir.

Upload the image package as well, you're going to be needing it sooner or later.

Open your browser to the newly uploaded roster dir. (http://roster.thumann.dk/apps/roster/ in this example) and you’ll see a message about roster not being installed.. well.. let’s do that now!
Click the link.

As with joomla, certain requirements are needed to have roster function properly.

Start the installation.

And again, fill in server information

Choose a roster admin password and don’t forget it ;)

Download the configuration file and upload it to the roster root dir before you click continue!

That’s it.. roster is now installed.. now let’s configure it.

Configuration

Enter the passw0rd to enter the configuration area of the roster.

From the menu on the left, select Guild Config, and fill in your info.

Save the settings and proceed to the update profile page (button in the top menu)

Browse to your characterprofiler.lua file (characterprofiler and guildprofiler mods are ofc. Installed in wow) and enter your admin password in the lower field and click the upload button.

You can see in the log if it accepted your upload or not.. if not.. then you probably haven’t setup the guild config like I told you to ;)

Wowroster 1.7.0 is now configured!

Wrapping in Joomla

The Basics

Good, if we want to seamlessly integrate something into joomla, we’re going to use a feature in joomla called ‘Wrapping’

Wrapping is more or less a fancy word for changing the target of a link, like when working with frame sets.

It's cool, easy and it works!

Wrapping WoWRoster

We’ll ‘Wrap’ wow roster into the page now, so we can see it by clicking on a link in the menu.

Now, head for the backend and select mainmenu from the menu called menu menu.
Once again click the new button, but this time select ‘Wrapper’ in the list like shown below.

Then click next and fill in as shown below, then click save and check your front page again.

Ahh!

And if we click on the new link called roster


Bingo! The roster is integrated into joomla!

Ahh.. nice.. but.. it looks kind of funky no?

Yeah.. it does.. let’s break it down! :-D

As you can read in the wowroster sdk (http://www.wowroster.net/wiki/index.php/Roster:Addon:AddonSDK)
You have the options to hide the header, menu and footer..
Let’s play a bit with that..

The code we’ll circle about is:

// Make the header/menu/footer show by default
$roster_show_header = true;
$roster_show_menu = true;
$roster_show_footer = true;

These can be inserted into the various pages of the roster.. (built in and addon's, play around with it but be sure to back up your files)

Let’s take the addon called Max. Res

Right click the link in the menu for Max. res and copy the destination (http://roster.thumann.dk/apps/roster/addon.php?roster_addon_name=maxres)

Good, now go to the backend of joomla and create a new ‘wrapper’ item in the mainmenu like shown below, for the link you just copied.

Save it and check the front page, you should see the new link; click it :)

Good, it shows up.. but let’s hide the footer and the menu..
Open the following file in your favorite editor and change like shown below

Roster_root_dir/addons/maxres/maxres.php

Paste the 4 lines in as you can see below (can vary from page to page.. but in general.. it should be placed at the top)
Notice I’ve set the last two to false, save the file and upload it again or what ever..

Check the link at the front page again :-D

Woohoo.. now menu and now footer.. looks nice doesn’t it.. (with a proper joomla template that is.. )

That’s pretty much it..
If you have some links you don’t want to have displayed to public users,
change the ‘Access level’ on the links, so that they’re only visible for registered users.

Wrapping EQDKP

Well.. nothing much to it..

First we need to change the way eqdkp uses links pr. Default..
To do this, open the following file /eqdkp/includes/eqdkp.php

Line 298:
${$var} .= '<a href="' . $this->root_path . $menu['link'] . '" class="copy" target="_top">' . $menu['text'] . '</a> | ';

Change it to be:
${$var} .= '<a href="' . $this->root_path . $menu['link'] . '" class="copy" target="_self">' . $menu['text'] . '</a> | ';

(only change was target=”_top” -> target=”_self”)

Save and upload the file again.

Create a wrapper link to your eqdkp as shown before

See :-D simple