Setting Up Phoca Cart and Gantry 5 Template

Category: Phoca Cart Component
 
Setting up Joomla! & Phoca Cart & Gantry 5 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.
3) Install Phoca Cart component (default plugins will be installed together with this package).
4) 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.


5) 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 Joomla! & Gantry 5 - Phoca Premiere template & Phoca Cart demo website.

 

Phoca Premiere - Gantry 5 - Outlines

 



6) Set Phoca Cart Search module

 

Phoca 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 position

 

Phoca Premiere - select search module

 



7) Set Phoca Cart Currency, Phoca Cart Cart, Phoca Cart Compare and Phoca Cart Wish List module

 

Phoca 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 Classes: ph-main-nav-top-box
     

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

 

Phoca Premiere - Position 22 CSS Class

 

8) Set Phoca Cart Category module

 

Phoca 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)

 


 
9) Set Phoca Cart Filter module

 

Phoca 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)

 


 
10) Set Phoca Cart Brands module

 

Phoca 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 module

Phoca Premiere - select brands module