Setting up Joomla! & Phoca Cart & Gantry5 template - a Phoca Premiere template example:

(1) Install Joomla! on your web server.

All following extensions should be installed in Joomla! administration - Extensions - Manage - Install.

(2) Install Gantry 5 framework.
(3) Install Phoca Premiere template.
(4) Install Phoca Cart component (default plugins will be installed together with this package).
(5) Install Phoca Cart modules - all in one package can be installed to install 10 default Phoca Cart modules at once - Phoca Cart - All modules package download website.

(6) Install, enable and set up Phoca Upgrade System plugin - this plugin tries to transform Bootstrap 2 output into Bootstrap 3 output on Joomla! website. This is needed when Joomla! renders Bootstrap 2 output but the template is based on Bootstrap 3. Enable this plugin in case that your Joomla! template does not override Joomla! output with Bootstrap 3 style - in case of Phoca Premiere template, this plugin should be enabled.

Parameter settings:

  • Template Style: All
  • Remove Obsolete Bootstrap Javascript: Yes

Gantry 5 templates include different outlines. Outlines can be assigned to menu links. You can have one menu link asigned to outline Home and second menu link assigned to outline Default. But it is not possible to assign different outlines to different component views within one menu link. Phoca Upgrade System plugin can do this. So for example, in case you need to create one menu link to Phoca Cart component but you want to have set outline Home for Categories view and outline Default for all other views, you can do this when you set following parameters:

  • Force Template (Component): com_phocacart
  • Force Template (View): categories
  • Force Template (Template): Phoca Premiere - Home

Phoca Premiere Default outline will be set as your default Joomla! template but when Phoca Cart component - Categories view will be displayed then Phoca Premiere Home outline will be forced as a template:

  • Categories View: Phoca Premiere Home outline
  • Category/Items/Item View: Phoca Premiere Default outline

You can see it live on following websites:

Phoca Premiere - Gantry 5 - OutlinesPhoca Premiere - Gantry 5 - Outlines

(7) Set Phoca Cart Search module

Phoca Cart Search modulePhoca Cart Search module

Parameter settings:

  • Publish, Module Assignment: All Pages
  • Show Title: No
  • Search Options: No
  • Hide Buttons: Yes
  • Display Inner Icon: Yes

Phoca Premiere template settings:

  • Base Outline - Layout - Header - Module Instance (12%) - Phoca Cart Search module

Phoca Premiere - Search module positionPhoca Premiere - Search module position

Phoca Premiere - select search modulePhoca Premiere - select search module

(8) Set Phoca Cart Currency module, Phoca Cart Cart module, Phoca Cart Compare module and Phoca Cart Wish List module

Phoca Premiere - Position 22Phoca Premiere - Position 22

Parameter settings:

  • Publish, Module Assignment: All Pages
  • Show Title: No
  • Position: position-22

Phoca Premiere template settings:

  • Base Outline - Navigation - Module Position (25%) - Key: position-22 - CSS ID: ph-top-modules - CSS Classes: ph-main-nav-top-box

Phoca Premiere - Cart, Compare, Currency and Wish List modulePhoca Premiere - Cart, Compare, Currency and Wish List module

Phoca Premiere - Position 22 CSS ClassPhoca Premiere - Position 22 CSS Class

(9) Set Phoca Cart Category module

Phoca Cart Category modulePhoca Cart Category module

Parameter settings:

  • Publish, Module Assignment: All Pages
  • Show Title: Yes
  • Position: position-7 (Position-7 is defined in Phoca Premiere Default outline)

(10) Set Phoca Cart Filter module

Phoca Cart Filter modulePhoca Cart Filter module

Parameter settings:

  • Publish, Module Assignment: All Pages
  • Show Title: Yes
  • Position: position-7 (Position-7 is defined in Phoca Premiere Default outline)

(11) Set Phoca Cart Brands module

Phoca Cart Brands modulePhoca Cart Brands module

Parameter settings:

  • Publish, Module Assignment: All Pages
  • Show Title: No

Phoca Premiere template settings:

  • Default outline - Feature - select Phoca Cart Brands module

Phoca Premiere - brands modulePhoca Premiere - brands module

Phoca Premiere - select brands modulePhoca Premiere - select brands module

If you use Gantry5 template which is not made by Phoca, you can extend it through Phoca Cart module overrides (Modules included: Phoca Cart Cart, Phoca Cart Wish List, Phoca Cart Compare, Phoca Cart Currency), see Phoca Cart Gantry5 overrides
Just unzip the ZIP file into your Joomla! server folder: templates/your_gantry5_template/html.

 

100+
GitHub Projects
Arctic Code
Vault Contributor
12 Million+
Downloads
70 000+
Answered Questions
2 100+
Planted Trees