Use MageBridge with Advanced Module Manager - Yireo

Adding aheadWorks AJAX Cart Pro to MageBridge

Adding aheadWorks AJAX Cart Pro to Magento is well-documented by aheadWorks itself, but adding it to MageBridge takes a few extra steps. The main focus is to inspect the XML-layout file that AJAX Cart Pro ships with, and make sure that all cart-elements are integrated into Joomla!. This tutorial lies down the steps.

Overview of the MageBridge integration

First of all, follow all the steps laid down in the aheadWorks documentation to install and configure the cart-extension. Instead of focussing directly on Joomla! and MageBridge, make sure that the cart actually works as expected in the Magento-only frontend. After the extension is succesfully installed in Magento, you can take it up to the next level: Integrate it into Joomla!.

AJAX Cart Pro is a complex extension, adding things to various parts of the Magento architecture (PHTML-templates, XML-layout files, class-files, skin-files, etcetera). When integrating AJAX Cart Pro into MageBridge, the main focus lies with the XML-layout file, because it contains all the relevent changes on the frontend. In this case the XML-layout file is app/design/frontend/default/default/layout/ajaxcartpro.xml.

Studying the XML-layout file

If you open up this XML-file, you can see various XML-structures. First of all, the file shows that AJAX Cart Pro adds some things on all pages (<default>) but also on its own pages (<ajaxcartpro_cart>). The things that are added vary from JavaScript and CSS-files to Magento blocks. The challenge is that MageBridge does not bring the full Magento page to Joomla!, but it only brings specific elements. For instance, if you have disabled Magento CSS in the MageBridge configuration, the CSS of AJAX Cart Pro will not be displayed.

The following elements can be found in the XML-layout of AJAX Cart Pro:

• CSS stylesheets
• JavaScript scripts
• Magento blocks

CSS stylesheets

On all pages, the CSS-file ajaxcartpro/css/styles.css is added. If you have disabled the Magento CSS within your MageBridge Configuration, you either have to modify the MageBridge Configuration to allow this CSS-file specifically. Alternatively you can copy the CSS to your own Joomla! template - see the documentation of your Joomla! template for details on how to do this.

JavaScript files

Various JavaScript-files in the subfolder aw_ajaxcartpro are loaded, plus the generic Magento script varien/product.js. Because the AJAX Cart Pro extension is only functional on MageBridge pages (in other words, it is not functional on non-MageBridge pages like your blog or forum), and because Magento JavaScript is always enabled on those pages, there is normally no need to configure anything here.

Magento blocks

This is where the actual work lies: There are various Magento blocks added by AJAX Cart Pro, but not all Magento blocks are automatically forwarded to Joomla! by MageBridge. When navigating MageBridge pages, only the Magento block content is forwarded by default (see the guide MageBridge Combined Theming for details).

All other blocks need to be configured manually by using the MageBridge Custom Block module in the Joomla! Module Manager. For instance, AJAX Cart Pro adds various subblocks aw.ajaxcartpro.progress and aw.ajaxcartpro.confirm to the Magento block before_body_end, so it is recommended to add the block before_body_end through a Joomla! module to your site. See the guide Adding custom Magento scripts for details.

The XML-layout also mentions a block aw.ajaxcartpro.init, but this block can be disregarded. It is hidden inside the Magento theme, and does not need to be displayed on the Joomla! page.

Beware of JavaScript conflicts

As always, make sure that all Joomla! extensions are configured in such a way that JavaScript-errors are not occurring. See the MageBridge JavaScript tutorials for more details.

Disclaimer

This documentation was written focussed on AJAX Cart Pro 2.3. Newer updates bring newer page-elements, so make sure to double-check the XML-layout to see if everything is included.