Enforce Coding Standards with PHP_CodeSniffer and Eclipse IDE on Ubuntu Linux
ENUMs, User Preferences, and the MySQL SET Datatype
G3D on Ubuntu Linux
Changing Mailman Python Scripts for Virtual Host Support
Using PHP pspell Spell Check Functions with a Custom Dictionary
Using Multi-Byte Character Sets in PHP (Unicode, UTF-8, etc)
Microsoft Office Open XML

Customising Joomla

Monday, 20 November 06, 10:23 am
compton
My first task is to investigate how we can create a single consistent look & feel for the admin GUI. I'll need to get a good understanding of how the admin GUI works and is organised.

When the admin first logs in, you have a grid of square buttons on the left, and some stats on the right. The page shows as index2.php in the address bar.

index2.php has the following structure:
  • includes
  • start session
  • get option and task request params
  • create mainframe object as new mosMainFrame
  • get act, section, no_html and id request params
  • use selected template's index.php
  • show SQL queries if in debug mode
  • if task param is 'save' or 'apply' redo session check
1 2 3    Leave Comment

compton

6:16 pm, Monday, 20 November 06

Another customisation is the breadcrumb trail. This shows the current module, as defined by the $option variable, which takes its value from the option request parameter.

The breadcrumb trail is defined in the mod_pathway.php file. I changed the central if statement to the following:

if ($option != '') {
   $html .= " / ";
   $option_text = ucwords(substr($option, 0, 4) == 'com_'? substr($option, 4) : $option);
   if ($option_text == 'Virtuemart')
      $option_text = 'Online Store';
   // try to miss edit functions
   if ($task != '' && !eregi( 'edit', $task )) {
      $html .= "<a href=\"index2.php?option=$option\">$option_text</a>";
   } else {
      $html .= $option_text;
   }
}


This means that instead of showing, for example, (shop name) | com_admin as the trail, it will show (shop name) | Admin. Looks a whole lot better. Also, it displays (shop name) | Online Store, instead of (shop name) | com_virtuemart.

There is a little problem with modules with 'compound names', such as com_menumanager, as they are displayed as (shop name) | Menumanager. Special case logic could replace these with more aesthetic text if needed.
 
 

compton

4:48 pm, Tuesday, 21 November 06

We also want to remove any reference to 3rd party products, such as Joomla and VirtueMart. These references could take the form of images, links, text, tool-tips, etc. All the public-facing references can be removed by setting the configuration files accordingly: with the exception of the VirtueMart logo at the bottom of the checkout pages. This can be disabled by unchecking the Show Footer option at the bottom of the /administrator/index2.php?pshop_mode=admin&page=admin.show_cfg&option=com_virtuemart page.

The title of the warning message that pops up when you hover over the yellow warning triangle at the top of the search stats page (/administrator/index2.php?option=com_statistics&task=searches) also contains 'Joomla!'.

Many admin pages have a help button in the top toolbar. It is context sensitive, and is powered by a page titled index2.php on help.joomla.org. The plan is to replace this with a help system running on the same server as the Joomla installation. To do this, all the help text for all pages will be copied and stored in a database.

The help links have a single dynamic parameter, keyref, which determines the page for which help is required. So, our database table will need an id column, a keyref column, and a helptext column.

The help URL is specified in the configuration file. The menubar.html.php page creates the help button, in the help() function. There is also a similar help() function in the admin.admin.html.php file.
 
 

compton

11:50 am, Monday, 27 November 06

Another necessary thing is to reformat how categories are displayed. The administrator\components\com_virtuemart\html\shop.browse.php
file is the workhorse of the virtuemart shop.

Editing this allows me to remove the useless 'Browse' heading, shift the 'Order By' drop-down to a less cumbersome place (to the right of the section title in this case), and position the description after the heading (by default it appears before it, which is a little odd). After the changes, category pages look as in the screen shot below:

 
 

compton

12:21 pm, Monday, 27 November 06

So the next thing to do is work on the formatting of the Top Sellers box. This is the Top-10 VM module, and has a very text-based look at the moment. The configuration options available to back-end admins are limited. Crucially, you cannot get it to show product snap-shots.

The file /modules/mod_virtuemart_topten.php appears to handle the rendering of this module.

VM has a function called show_snapshot($db->f("product_sku"), $show_price, $show_addtocart), defined on the ps_product class, which outputs a product snap-shot for the specified product. It is used in a very similar context in modules/mod_virtuemart_featureprod.php.

It's simple enough to change /modules/mod_virtuemart_topten.php to use the show_snapshot() function - the file already declares an instance of the class, so all that's needed is to get whether to show price. Copying the code which does this from modules/mod_virtuemart_featureprod.php works - presumably the settings configured in the control panel for featured product will then apply.

The snap-shot for the featured product should be different to the one used in the top sellers list. A new parameter could be used to specify which type of display to use - either vertical (= larger pic, show text underneath) or horizontal (= smaller pic, show text on right).

The function is defined in the administrator\components\com_virtuemart\classes\ps_product.php file. It simply echos the return value of the product_snapshot() function, defined in the same class.

This latter function builds the HTML for the snapshot as a PHP string, which is the function's return value. The html consists of spans containing the product details - there is no wrapper element, such as a table.

I'll add a table wrapper element, and use the new parameter to determine whether to show two rows, or just two cells in one row.

I also need to display larger pictures for vertically aligned snap-shots. The image rendering is handled by the ps_product::image_tag() function. This function has an optional third parameter which determines whether or not the product image should be resized. For vertical alignment, just setting this to zero will have the desired effect.
 
 
1 2 3  Leave Comment
About This Page