My short list of must-have, FREE Joomla Extensions

Components:
1. akeebaBackup (formerly joomlapack) – Since updating to akeebaBackup, I think this particular component has started to cater to its commercial version a little too heavily. Nonetheless, it stands as the best backup utility that I have used. It backups the entire file system (allowing custom exclusions, and including standard exclusions for directories like tmp), it generates a backup of the database (including all the tables, not just the standard installation tables), and it creates its own custom installation directory for restoring the site using the file system and db backups. I use akeebaBackup for moving sites between my test servers, and among live servers. I also have akeebaBackups pre-built with all of my preferred extensions and templates installed, so I can hit the ground running on my new projects.
2. JCE (Joomla Content Editor) – Joomla Content Editor takes Tiny MCE project to the next level within Joomla sites. It occasionally causes issues with editor buttons, but these are worth troubleshooting, as the JCE interface is much more manageable, and offers a lot of configuration options. This component requires the JCE plugin to reach its full glory.
3. Phoca Gallery – I have posted a couple of hacks to alter Phoca Gallery plugins, and I am generally a big fan of their projects. Phoca Downloads, Phoca Maps, Phoca Documentation, and Phoca PDF have all served my needs well for projects – but I must admit to not investigating alternatives in these cases. As far as galleries go, I think the Phoca Gallery really has the best combination of user-friendly administration, feature-rich without being bloated with parameters (although it does have quite a few), and a great suite of complimentary Modules and Plugins (I never install the Phoca Gallery without the Phoca Image Module and Phoca Search Plugin).
4. ChronoForms – I wish forms would just go away. They’re ugly, annoying, browser-specific, and did I mention ugly and annoying? Anyway, they are not going anywhere, and I have spent a lot of time looking for a good (free) form component that can meet all my form building needs. I think ChronoForms is a bit lacking in UI elements, but it by far the best option I have found for putting forms in my Joomla sites.
5. JEvents – For event management. UI, options, functionality are all where they should be for a free component. JEvents is popular for a reason, and I use it when I need events data on a site. There are also good modules/plugins available to complement.
6. XMap – Everyone is concerned about SEO and making sure Google has their latest and greatest site map and has indexed every last word they posted. XMap easily takes care of this, and also provides a means to include your site map on your site.
7. VirtueMart – I prefer VirtueMart for e-commerce in Joomla. I hope I am not starting a war here.
8. My Custom Blank Component. I searched long and hard for a blank component, but could not seem to track one down. I know you should use a different template, or you can include a show component option in your template. But many times I just have one page, where all I want is to show a bunch of modules. In those cases, I just want to assign a menu item that is going to leave the component blank. So I made a blank component, and I use it a LOT.

This is getting long, so I’ll skim the modules:
1. Extended Menu Module – If you are not using this already, you should be.
2. AiDaNews Module – A good enhancement to the Latest News plugin that comes pre-installed.
3. Simple Image Holder – I use this thing everywhere. It is probably my most used extension on a per page basis.
4. Simple Image Rotator – I am fairly anti-flash, and I generally opt for the Simple Image Rotator over alternatives.

My Plugins are all complements to my components. Since I tend to avoid flash, my articles tend to be images and text. The only times I require plugins are when I want an article to interface with a component, hence you will find all my top Plugins at the links previously provided.

And for templates, I will defer to a good article I caught recently at JoomlaPraise. I will also say that many of my Joomla projects start with one of the free JoomlaPraise templates.

I intentionally did not list a flash player (I usually turn to the Flash Module or Embedia – moseasymedia, are these really the best?) or an all encompassing media component. I have tried too many to count, and just can’t seem to find one (or even two or three) that will meet all of my needs. Hopefully someone can recommend a good media component (plugin/module) or suite of utilities and help me figure what I am doing wrong on this front.

Well, other than the media component/flash player are there any others I missed? Or, does anyone have reasonable alternatives or disagreements?

This list combines keywords, functions, classes, and language constructs into a single alphabetical list you can scan quickly to determine if the name you want to use is on the list and thus should not be used.

abstract
and
array
as
break
case
catch
class
clone
const
continue
declare
default
do
die
echo
else
elseif
empty
enddeclare
endfor
endforeach
endif
endswitch
endwhile
eval
exit
extends
final
for
foreach
function
global
goto
if
implements
include
include_once
interface
isset
instanceof
list
namespace
new
or
parent
print
private
protected
public
require
require_once
return
self
static
switch
throw
try
unset
use
var
while
xor

Not, that I had any inside knowledge, I just knew from reviewing the Release Candidate that most of the bugs were gone, and the release could not be far away.

Sure enough, in just 3 days, July 1st, the release became official. My review of June 27th stands, this post is for those who decided to wait for the official release. Well, it’s here.

On the release, the developers stated, “We hope you will make MySQL Workbench your preferred tool for Design, Development, and Administration of your MySQL database.”   We agree.

Download MySQL Workbench here. Any one working with MySQL will quickly find the tool has many enhancements from the older MySQL Administrator and its companion MySQL Query Builder, which are now retired.   MySQL Workbench should become a much used tool in your toolbox.

And you have your $_SESSION variables. Is the one variable you put in the $_SESSION variable three files ago still there?

This often leads you to making a series of echo statements, where you jump back and form from the form file to the controller file checking if the variable is good, or you misspelled a name. This is time consuming, and sometimes frustrating when creating a new form with a lot of entries.

Most of the time you endure, because your into that moment, and the thought of stopping to think of an easier way does not enter your mind.

With this little snippet of code, you can do all your checking with one line of code, with a simple include file, which will tell you everything you want to know. This allows you to fix every problem encountered with passing variables, and when everything works correctly, you simply remove the one include line, and you’ve finished your variable checking.

Here’s a simple piece of code, which loops through your $_COOKIE array, your $_SESSION array, your $_GET array and your $_POST array, listing each variable name and their corresponding value currently available to the page. There is nothing complicated here, just simple foreach loops looping through each array. Just put the file in your application, and call it when needed with an include.

Here’s the code. Save it to a file, like “var_check.php” for example, and put it in a folder in your application.

function var_check()
{
echo "VARIABLES IN YOUR GLOBAL ARRAYS ";
echo "These are the current COOKIE variables ";
    foreach( $_COOKIE as $key_name => $key_value)
    {
	echo $key_name . " = " . $key_value . "" ;
    }

echo "These are your current SESSION variables:" ;
    foreach( $_SESSION as $key_name => $key_value)
    {
	echo $key_name . " = " . $key_value . "" ;
    }

echo "These are your current GET variables:";
    foreach( $_GET as $key_name => $key_value)
    {
	echo $key_name . " = " . $key_value . "";
    }

echo "These are your current POST variables: " ;
    foreach( $_POST as $key_name => $key_value)
    {
	echo $key_name . " = " . $key_value . "";
    }
}  // end of the var_check function

function server_check()
{
    echo "These are your SERVER variables: " ;
    foreach( $_SERVER as $key_name => $key_value)
    {
	echo $key_name . " = " . $key_value . "";
    }
}  // end of the server_check function

var_check();

You’ll notice, I call the function at the end of the include file, so you don’t have to include the function call as a separate line when you drop it in your file.

Here’s the one line that you put at the top of your controller to list all your variables.

include("../files/test/var_check.php");

Here’s the output of the function call.

VARIABLES IN YOUR GLOBAL ARRAYS
These are the current COOKIE variables
PHPSESSID = dpo4glbo7314hs3frr6bvd2fu1

These are your current SESSION variables:
username = dale
user_id = 2
login_status = OK
LOGIN_MESSAGE =
news_id =

These are your current GET variables:

These are your current POST variables:
projname = dsafdsaf
dept = 3
prjyear = 2010
description = dsaf ad fads
stat = 5
lead = 2
statnote = dasfds a dfsadf
execorder = 11
cgoal = 2
ngoal = 3
mandates = adfa
objectives = dafdsf
measures = dsaf  dsfa  sadf
comms = dsfds adsf asddf
keymess = sdafsda asddfsad
tools = adfsd
saveprj_mile = save project & add a milestone

To check each one of these variables separately would involve a line of code something like this example:

echo "this checks the stat variable: " . $_POST['stat']  ;

Then you would have to remember the value you set “stat” to in your form. So this could save you quite a bit of time going back and forth between the view and controller files.

As an added bonus I included a function you can call separately called, “server_check()” which will loop through your server globals and show you the information available there.

Here’s how to use the server_check function in your file.

include("../files/config/var_check.php");
server_check();

Here’s the sample output from the server_check() function.

HTTP_HOST = localhost
HTTP_USER_AGENT = Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2.6) Gecko/20100625 Firefox/3.6.6
HTTP_ACCEPT = text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
HTTP_ACCEPT_LANGUAGE = en-us,en;q=0.5
HTTP_ACCEPT_ENCODING = gzip,deflate
HTTP_ACCEPT_CHARSET = ISO-8859-1,utf-8;q=0.7,*;q=0.7
HTTP_KEEP_ALIVE = 115
HTTP_CONNECTION = keep-alive
HTTP_REFERER = http://localhost/intranet3/views/pp_new.php
HTTP_COOKIE = PHPSESSID=dpo4glbo7314hs3frr6bvd2fu1
HTTP_CACHE_CONTROL = max-age=0
CONTENT_TYPE = application/x-www-form-urlencoded
CONTENT_LENGTH = 205
PATH = c:\Program Files\NVIDIA Corporation\PhysX\Common;C:\wamp\bin\php\php5.3.0\;C:\Program Files\ActiveState Komodo Edit 5\;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\Program Files\QuickTime\QTSystem\;C:\Program Files\Git\cmd;C:\Program Files\Git\bin
SystemRoot = C:\WINDOWS
COMSPEC = C:\WINDOWS\system32\cmd.exe
PATHEXT = .COM;.EXE;.BAT;.CMD;.VBS;.VBE;.JS;.JSE;.WSF;.WSH
WINDIR = C:\WINDOWS
SERVER_SIGNATURE =
SERVER_SOFTWARE = Apache/2.2.11 (Win32) PHP/5.3.0
SERVER_NAME = localhost
SERVER_ADDR = 224.10.0.1
SERVER_PORT = 80
REMOTE_ADDR = 224.10.0.1
DOCUMENT_ROOT = C:/wamp/www/
SERVER_ADMIN = admin@localhost
SCRIPT_FILENAME = C:/wamp/www/intranet3/rules/ru_pp_new.php
REMOTE_PORT = 2247
GATEWAY_INTERFACE = CGI/1.1
SERVER_PROTOCOL = HTTP/1.1
REQUEST_METHOD = POST
QUERY_STRING =
REQUEST_URI = /intranet3/rules/ru_pp_new.php
SCRIPT_NAME = /intranet3/rules/ru_pp_new.php
PHP_SELF = /intranet3/rules/ru_pp_new.php
REQUEST_TIME = 1278368120

That’s about it. Enjoy.

First, the Joomla process for creating a new user goes like this:
1. Validate that username is unique.
2. Generate a random 32 character “salt” value.
3. Combine the password + salt, and encrypt the compounded value.
4. Store the encrypted result followed by the salt value used to generate it.

For example, when I create a new user with username ‘joomla_user’ and password ‘joomla_password’, Joomla does the following:
1. Make sure there is not an existing ‘joomla_user’ username value in jos_users.
2. Generate a random 32 character salt (ex: TUIG6Wyx2gPavlcPm73mdpN4uWjZ8dvv).
3. Combine password and salt, then encrypt the entire value:
$value = ( md5(‘joomla_password’.'TUIG6Wyx2gPavlcPm73mdpN4uWjZ8dvv’);
4. Store encrypted value followed by original salt in database (separated by colon):
$value.’:TUIG6Wyx2gPavlcPm73mdpN4uWjZ8dvv’ is inserted.

In order to integrate your web application with the Joomla login, retrieve the appropriate values from the database, separate the salt and the encrypted password + salt combination, salt and encrypt the entered password value, and compare your result to the value in the database. Looks like this in PHP:

$dbhostname = 'localhost';
$dbusername = 'root';
$dbpassword = 'password';
$dbdatabase = 'joomla15';

// Get these from your form...
$username_for_check = 'admin';
$password_for_check = 'admin';

$joomla_user;
$joomla_pass;
$joomla_salt;

$mysqli = new mysqli($dbhostname,$dbusername,$dbpassword,$dbdatabase);

if ($result = $mysqli->query('SELECT j.username,j.password FROM joomla15.jos_users j WHERE j.username="'.$username_for_check.'" LIMIT 1;')) {

  if ($result->num_rows == 0){
      echo 'Username does not exist.';
  }else{
    while ($row = $result->fetch_object()) {
      $joomla_user = $row->username;

      $pass_array = explode(':',$row->password);
      $joomla_pass = $pass_array[0];
      $joomla_salt = $pass_array[1];
    }

    if($joomla_pass == md5($password_for_check.$joomla_salt)){
      echo 'Username and password combination validated.';
    }else{
      echo 'Invalid password for username.';
    }
  }
} else {
  echo 'LOGIN VALIDATION: MySQL Error - '.$mysqli->error;
}

$mysqli->close();

What I thought I’d do is walk you through the process, like a mystery, and see if we can save, at least, one of our readers a couple of hours in the future, and while were doing that we’ll talk about the operation of some of Joomla’s internals.

Let’s set the scene, one of the sites we maintain is a Joomla site with a Section Blog Layout front page.  The center of the page has three article snippets, each with a “read more” link to the full article on another page.

Normal operation: when you click on a “read more” link in each one of the three article snippets, a new page comes up with the full article in the center and a picture in the right sidebar.

The problem: When you click the “read more” link on one of the articles, the new page comes up with the entire article, however there is no picture in the right sidebar.  What made the problem more interesting was of the three articles, only one article did not bring up the picture, the other two articles operated normally, and brought up the picture in the right sidebar.

There you have it, pause number one. What’s your first guess of what could cause this problem?

Answer: something is different in the one article without the picture, than the articles with the pictures in the right sidebar.

Looking at each article in the editor, the html was identical, except for the actual article content, in each or the articles, no, not the problem. And when you think of it, it didn’t matter if the article html structure was different or not.

Let’s go over how the screen populates.  You click on the “read more.” This is a hidden menu with a link to the template page and article number of the full “read more” page.  When the template loads it goes to the database with the article number, retrieves the page, and inserts it into the center component section of the page.  The template then loads the module for the right sidebar, which goes to the media library, gets the correct picture, and places the picture in the module in the right sidebar, that’s the normal flow.  The module controls the picture load, not the component which loads the article.  The article load has nothing to do with the right picture problem.

Let’s move on. Pause number two, your next guess of what could be the cause of the problem?

Well, something in the module. The module’s job is to place the picture in the right sidebar, true, but, two of the articles work properly, so the module is working properly.

Next guess, the menu link is not hooked up properly, or is bringing up the wrong template. We checked. No not the problem, the menu hook ups were identical to those of the two good articles, as were the section and category.  As a matter of fact, all the parameters you can configure by clicking on menus, the media library, modules, templates, and the articles were identical in all three articles, hmmm.

We started going through the modules and plug ins and wondering if there wasn’t a conflict, yes, we were starting to pull at straws. Each time we’re shot down, by the fact, that two articles are working properly.

Then we came to the “AceSEF” component.  For those not familiar with this component, it has the same functionality as “sh404SEF,” and “JoomSEF.”  Let’s talk about what an SEF component does and how it works.

SEF stands for Search Engine Friendly. An SEF component’s job is to make easy URL’s for pages on your web site.  Instead of having a long URL with numbers and strange long cryptic text, you can call a page something like, “/the_cat_page,” which will show up in the top of the browser in the address window.  The easy URL is easy to remember, and makes it easy for Google to list your site higher up in their ratings.

How does AceSEF or any SEF component work?  When you create a menu item to bring up an article, Joomla assigns it a Joomla URL with the article id number, category id number, and section id number.  This is the sites “Real URL”.  The “Real URL” is usually cryptic, and hard to type.

In the case of a Section Blog Layout, actually three Real URL’s are created for each article.  One for the Section Blog page with the article snippet and the “read more,” one for the full length article page after you click “read more,” and one for the edit page you use when you bring the page up in the article editor.

AceSEF automatically picks up these three menu items and allows you to give each a SEF friendly URL.  SEF programs, including sh404SEF, will allow you to designate one of these three pages as the main page to load, at the exclusion of the other two pages.

The answer to our riddle was in the SEF component.  The “Real URL” of the page with the module to load,  has a picture id included in the Real URL,  which identifies the picture to load into the module.  If the wrong “SEF URL” is assigned to the wrong “Real URL,” then the wrong page loads.  The article will still load in it entirety as it is stored as a blob in the database, but the module will not be able to load the picture, since no picture is identified, so no module will load.  You’ll end up with a blank space, while the other two articles will have the correct SEF link with the picture module and load correctly.

Bottom line, if you find a page where the module is not loading, while other pages with the same module work correctly.  Check your SEF component, and save yourself a lot of the time, we wasted, tracking this one down.

The older MySQL Administrator and the accompanying MySQL Query Browser were tools that were much beloved, that you kept going back to, and using over and over again,  like a nice fitting driving gloves, comfortable, useful, and empowering.  Since I started working with MySQL, I can’t remember not having them on my desktop, ready at a moments notice.

Because of that, I have looked upon MySQL Workbench with much suspicion and doubt. And indeed before this release, I would say the MySQL Workbench could not replace the previous Administrator and Query Browser. Now, I’m not too sure. With this release that has changed. Workbench includes the integration of MySQL Administrator, and MySQL Query Browser into an integrated environment, with much potential for growth through plug-ins, much like Eclipse, although don’t get me started on the integration of Eclipse plug-ins, another topic.

Workbench is like the French three-pronged fleur-de-lis, three separate tool areas open from a central core, Workbench Central.

Workbench Central

Workbench makes heavy use of “breadcrumb” like menus without tabs. Menus run horizontally across different windows in the Workbench, and clicking on the name brings you to the next screen. It took a second to get use to, but once I did, I liked the layout and the way workbench integrated.

You go back to Workbench Central by clicking “Home” in the upper left. If you click on any of your db connections, or menus across the top,  you enter into one of the three program areas: SQL Development with Query Browser, Data Modeling, and Server Administrator. It is obvious that each of these three sections is its own program, as they each take awhile to open at first.

Before MySQL Workbench folks were using DBDesigner to model their databases and do their EER diagrams. The Data Modeling section probably needs a little clean up and streamlining, as it opens rather “clunkily,” but once open works well.

Workbench Data Modeling

The administrator works well, but needs a little configuring as it checks your connections, and let’s you know if your missing an ini file or config setting.     You can configure multiple database connections to multiple servers, and reach each database with a click of the mouse.  The Administrator includes a series of graphs along the top of the window, which look nice, but I’m not sure are that useful.   The Administrator is laid out horizontally in keeping with the overall layout template of the Workbench, but I think I like the original Administrators vertical menus a little better.

Workbench Administrator

You can tell the Development Team has put some time into the Query Browser, and it shows.  You’ll find that the Query Browser is an improvement over the previous independent version. A red error x pops up as you type a query if you have the syntax wrong, this is immediate, instead of waiting until after you execute the query, very nice.  Query’s form a horizontal s menu along the top of the window as you make them, yes, the older version had this, but this is more automatic. Errors are reported when you execute the query, the same as the old version, with an obtuse error number.  My only gripe, which has nothing to do with the current Workbench, as the same was true of the previous version, is I wish the error messages were a tad more verbose.

Workbench Query Browser

MySQL Workbench is coming into its own and is starting to show the promise in its developer’s eyes.  The Developers Tools Team should be applauded for their dedication and persistence to get it right, and the outcome of this dedication is that MySQL Workbench is getting better and better.   I would look for the official release to follow closely after this RC 3 release.  I recommend you not wait for the official release,  go ahead, and get this release now, and start using it.  There is much to discover as you integrate Workbench into your databases, and begin working with it.  Enjoy.

I was not happy. However, since I commit my work often with git, I knew all my previous work was not lost. I just needed to recover that one file.

I was surprised to find that posts on recovering just a file in Git were a little harder to find on the Internet than I expected. Everyone was very helpful when it came to resetting all your files from a previous commit, but not just one file. And when this happens, I usually write a post about it. We’ll limit ourselves to recovering one file, and if you “grok” that, you’ll know by extrapolation how to get any files you want from previous commits in Git.

First, if your good file, that you committed previously, is still in your index (the files in your last commit), and you haven’t committed the new bad file yet, all you need to do overwrite the bad file in your working directory with the good file in your index using git checkout.  Like so:

git checkout  ( path/good file name )

For example, to recover a records_db.php file in my models subdirectory, I would type:

git checkout  models/records_db.php

Easy no. Your previously committed file will overwrite your bad new file in your working directory, and your all set.  Here’s an example using the file test.txt.

Backing up test.txt before committing the fifth revision change

Be careful, if you just do a “git checkout” without being specific about the file, you’ll get all the previously committed files back, which will overwrite your current work, that you haven’t committed yet, which you may not want to do.

Second, if you’ve committed the bad new file before you discovered your error, you need to tell git which committed file you want to retrieve, and its just a tad more complicated.  Git can’t guess which file you want from which commit.

What your trying to do is bring into your current working directory, an older file.  “git checkout” alone brings your last committed file, which is, after you committed, now the bad file.

We need to find the good file in your commits. There’s a couple of ways to do this. Let’s digress a bit, and talk about how Git labels commits. There’s the absolute method, and the relative method.

The absolute method is the SHA1 encryption number. You can see all your commits with the absolute SHA1 number by running:

git log

The number opposite the word commit is that commits absolute address. If you get a “:” after git log runs, you can quit out of git log by typing a “q”. The SHA1 numbers are long, but you only need the first three or four characters and Git will know which commit you mean.

Most folks, however, like to use the commit relative names. You can see the relative names by typing:

git show-branch –more=10

Now that we know how to label our commits, let’s get back to the subject at hand.  We need to find the good file.  By looking at the “git log” or the “git show-branch” you may not be able to determine which commit has the good file.  We may want to see the contents of the file.  For that, let’s use the gitk history gui, like so:

gitk –all

That’s with two dashes – -, as is, the more above in the show-branch command.

Using gitk to look at file four.txt contents in the fourth commit

This is a graphical record of all your commits, and the files that were committed.  If you click on the file in the lower right window, you’ll see the contents on the left.  This is the quick way to look at the file contents in each commit to find the commit you need.

OK, you know the commit you need. You can double check the relative name of the commit with the “git show-branch –more=10″ command and we’re all set.

Back to what we started with “git checkout.”  We will tell git to checkout the “four.txt” file from the “master~2″ commit, a previous commit, like so:

git checkout master~2 four.txt

Here’s an actual example of the command.

Recovering four.txt from the fourth commit labeled "master~2"

Now that wasn’t bad.  You should now feel confident you can recover any file you want in Git, that is, as long as you use Git the way it was designed to be used, commit your work often, and let Git take care of all the remembering.  Enjoy!

Pseudo elements are tags that CSS recognizes, that attach to HTML tags, but are not put directly into the HTML markup. We see this most often used with hyperlinks and anchor tags.

CSS uses four pseudo elements to style links:

:link The link pseudo tag is used for all links on the page that point to other locations that have NOT been visited. Here’s an example

a:link {
color: blue;
text-decoration: none;
}

Normally a link is underlined by your browser. If you don’t want your link underlined you can shut the underline off with the text-decoration: none;.

The next tag is “:visited.” These are sites that you have clicked on, visited, and then have returned to your page.

a:visited {
color: orchid;
}

Note the pseudo classes, ” a:visited” for example,  is attached directly to the html tag with a colon, no spaces.

“:hover” This styling will happen when your pointing device, or mouse, moves over the tag.  You do not have to actually click on the tag for hover to work.  This tags is used with the “img” tag to swap images when your mouse rolls over a picture. You can use this with other tags, like a table row.

tr:hover {
background-color: yellow;
}

Finally, we have “:active”   This styling is applied when an element has focus. Typically this is used with forms when you click in a form input box, or tab to it,  to type your name for example.

input:active { background-color: orange; }

Those are the basics, now let’s get a little more specific, pun intended, and why some people’s pseudo styling doesn’t work the way they thought they had styled their tags. It turns out that pseudo tags all have the same specificity in CSS. That means that:

 a:link {color: blue;}
 a:active {color: orange;}
 a:hover {color: yellow;}
 a:visited {color:orchid;}

All are equal in terms of specificity in CSS. And according to the Cascade Styling rules, if specificity is equal, the last styling gets the nod. In the above order, if any of your links become visited, then, from then on, your link will show only the orchid color. Not quite what you want, so visited needs to be listed higher up, first or second.

In order for your links to perform properly, like you expect, they need to be listed in the correct order which is:

 a:link {color: blue;}
 a:visited {color: orchid;}
 a:hover {color: yellow;}
 a:active {color: orange;}

Link and Visited are mutually exclusive, in terms of which applies, so they can be listed in either first or second order interchangeably. Again: visited, link, then hover, and finally active: vlha, or “Very Lean Hungry Apes” as a memory aid. Enjoy, and good CSSing to you.

The Problem
Search results that pertain to an image should show the user a thumbnail of the image. When selecting the search result link, the user should see the full image information, not an category page.

To demonstrate these concerns notice the search results when I search for “green normal” (the green normal image is from the earlier post):

Search result with no thumbnail image.

Now notice the resulting screen when I click on the search result link “fonts and colors: normal and green”. The page does not include the image for which I searched.

Resulting category display without target image.

The resulting page is always the first page of the category. In my example, this isn’t a major concern, as there are only 10 images. But it is still an issue, as a user could select an result item from a search and be taken to a page that does not include that target result. For a real site implementation, it is reasonable for a category to have 60, 80, or 100s of images. The image for which the user searched might be far enough away to steer them from your site entirely.

The Solution
Since these both require modifications to the same files, we will address them together. This issue must be resolved in two areas. The first area is the Phoca Gallery Search Plugin, specifically the JOOMLA_ROOT/plugins/search/phocagallery.php file (This is the same file we modified to update the exact/any/all words support.). In this file we need to modify the SQL queries to retrieve more data from the database, and then we need to be sure that the additional data is formatted appropriately and passed along with the search results.

The SQL query modification requires additional column values. Simply modify the following line under the “// Images” comment (the line is 161 in my file, which is modified to support exact, any, all searching per the earlier post):

. ' "2" AS browsernav, b.id as catid, b.alias as catalias'

Update the line so it includes the additional columns below:

. ' "2" AS browsernav, b.id as catid, b.alias as catalias, a.filename, a.alias AS photoalias, a.ordering AS photoordering'

We also want to construct a thumbnail path, and add a flag so that we can easily identify a result item as a phoca image. Update the foreach loop that traverse the $listImages. I am including the entire loop for reference (should be near line 175).

foreach($listImages as $key => $value) {
	$listImages[$key]->href = JRoute::_(PhocaGalleryRoute::getCategoryRoute($value->catid, $value->catalias));

	// Phoca Gallery Search Updates For Thumbnails -- BEGIN

        // Store the filename, so we can generate a path to the thumbnail
        $phoca_filename = $listImages[$key]->filename;

	// Scrub the filename, which is a relative path, if there are sub-directories,
        // we only want the final filename,
	// then append that to the thumbs directory and prefix.
	if(strrpos($phoca_filename,'/') === false){
             $path = 'thumbs/phoca_thumb_s_'.$phoca_filename;
        }else{
             $path = substr($phoca_filename, 0, (strrpos($phoca_filename, '/')+1)).'thumbs/phoca_thumb_s_'.substr($phoca_filename, (strrpos($phoca_filename, '/'))+1);
        }

	// Update the filename with the full path to the thumbnail
        $listImages[$key]->filename = 'images/phocagallery/'.$path;

	//Add ordering info to the URL
	$listImages[$key]->href.='&limitstart='.($listImages[$key]->photoordering-1);

	// Phoca Gallery Search Updates for Thumbnails -- END
}

Now we have access to the image alias and the ordering information. With this data, we can proceed to change the way that the Joomla! Search Component displays its results. This is controlled by the JOOMLA_ROOT/components/com_search/views/search/tmpl/default_results.php file.

It is worth noting that you should override this file within your template directory instead of editing the actual component tmpl file. I will not go over reasons for this in detail, because this is not a Joomla! best practices post. If you want more info on this, search for something to the effect of “Joomla 1.5 template layout override” and you should find more than enough information.

So, instead of editing the current file that controls this behavior, we are going to override it in our template directory. Create a JOOMLA_ROOT/templates/rhuk_milkyway/html/com_search/search/default_results.php file. Note that “rhuk_milkyway” is my active template, and the directory must reflect your active template. If this is your introduction to layout overrides in Joomla!, I would also note that the two paths (the overriding and the overridden) are not a directory for directory match.

In the new default_results.php file we need to make a check to see if the result is a Phoca Gallery Image result, this avoids searching for thumbnails when a user is returned an article result item. We then need to add some custom html to the page to rearrange the result layout, and add our image thumbnail.

[Note that the following two code sections have spaces after opening angle brackets to avoid parsing of html and php code. You can download the updated default_results.php, without the extra whitespace.]

Immediately after the first div tag (line 9), add the following:

< ?php //Phoca Gallery BEGIN ************************************ ?>
    				< ?php if (array_key_exists('phocaImage',$result)): ?>

              < span style='float: left;' class="small< ?php echo $this->escape($this->params->get('pageclass_sfx')); ?>">
  						  < ?php echo $this->pagination->limitstart + $result->count.'. ';?>
  					  < /span>

              < div id='phoca-image' style='float:left; padding:0px 4px;'>

                    < ?php echo ' alt="< ?php echo $result->title ?>"  /> 

              < /div>
              < ?php if ( $result->href ) :
                echo 'Visit this category: ';
    						if ($result->browsernav == 1 ) : ?>
    							
    						< ?php else : ?>
    							
    						< ?php endif;

    						echo $this->escape($result->title);

    						if ( $result->href ) : ?>
    							
    						< ?php endif;
    						if ( $result->section ) : ?>
    							< br />
    							< span class="small< ?php echo $this->escape($this->params->get('pageclass_sfx')); ?>">
    								(< ?php echo $this->escape($result->section); ?>)
    							< /span>
    						< ?php endif; ?>
    					< ?php endif; ?>
    				< /div>

    					< ?php echo $result->text; ?>
    				< /div>
    				< ?php
    					if ( $this->params->get( 'show_date' )) : ?>
    				< div class="small< ?php echo $this->escape($this->params->get('pageclass_sfx')); ?>">
    					< ?php echo $result->created; ?>
    				< /div>
    				< ?php endif; ?>

            < /div>
            < ?php else : ?>

            < ?php //Phoca Gallery BREAK ************************************ ?> 

And immediately before the fieldset closing tag (11-12 lines from the bottom of the file), insert:

  < ?php //Phoca Gallery RESUME ************************************ ?>
  < ?php endif; ?>
  < ?php //Phoca Gallery END *************************************** ?>

Now when we execute a search, the search results display with a thumbnail icon, and the thumbnail icon as well as the result title link to the correct page of images within the target category. Notice the search result with thumbnail (My thumbnail is merely green text, not that impressive.):

Search result with thumbnail.

And upon selecting either the thumbnail or the title of the result set item, I am taken to the correct page of the category display, as opposed to the previous links which always loaded the first page of the category:

Search result links directly to correct page within category.

A couple of caveats: This implementation requires additional updates to work properly with SEF URLs enabled, and the image paths are hardcoded as the Phoca Gallery/Joomla! defaults. There is a lot of information about the work-arounds necessary for handling SEF in the Phoca Gallery forums, I will note that you need to use the “photoalias” column that we added to the SQL query to build your SEF URL, and you will also need to make a non-displaying menu item to reference as an alias for your Phoca Gallery component.