In the ever-evolving world of Joomla content management system (CMS), having a robust and versatile ecommerce solution is imperative to cater to the diverse needs of website owners. Phoca Cart, a modern ecommerce suite deeply ingrained in the Joomla CMS framework, emerges as a powerful and feature-rich option for online stores. On the other side of the spectrum, YOOtheme, renowned for its Joomla support, is a highly regarded theme and template provider that seamlessly integrates with Joomla, empowering users to create visually stunning websites. The recent integration of Phoca Cart with YOOtheme has brought about a synergy that further enhances ecommerce capabilities within the Joomla environment.
Understanding Phoca Cart
Phoca Cart is an innovative and feature-packed ecommerce extension designed for Joomla. It stands out by aligning itself with the Joomla CMS framework, ensuring a seamless and intuitive user experience. This modern ecommerce suite boasts a comprehensive array of features, making it an ideal choice for online businesses looking for a powerful ecommerce solution within the Joomla ecosystem.
YOOtheme: Enhancing Joomla with Style and Functionality
YOOtheme, a leading theme and template provider, offers exceptional support for Joomla. With a focus on both style and functionality, YOOtheme provides beautifully designed templates that cater to the aesthetic demands of modern websites. Its unique approach to design and intuitive user interface have garnered a significant user base within the Joomla community. YOOtheme’s templates are built on the foundation of UIkit, a lightweight and modular front-end framework, aligning perfectly with modern web development practices.
Phoca Cart and YOOtheme: A Perfect Match
The integration of Phoca Cart with YOOtheme paves the way for a seamless and harmonious ecommerce experience. Phoca Cart is designed to generate output in either Bootstrap or UIkit, making it inherently compatible with YOOtheme, which is based on the UIkit framework.
1) Basic Support with UIkit Rendering
Phoca Cart seamlessly integrates with YOOtheme by rendering its output in UIkit. This foundational level of support ensures that the ecommerce functionalities of Phoca Cart align with the design aesthetics of YOOtheme.
2) Tailored CSS Display
Phoca Cart offers users the ability to configure additional CSS options that specifically cater to YOOtheme templates. This customization allows for a more cohesive and integrated look when integrating Phoca Cart with YOOtheme-based websites.
3) Flexible Icon Display
Icons within Phoca Cart can be customized to match the design preferences of YOOtheme-based websites. Users have the option to choose between font or SVG icons, providing flexibility in design and visual representation. SVG icon set can be easily changed by template override. See: Changing SVG icons using template override.
Extensions for Seamless Integration:
Phoca Cart extends its capabilities for YOOtheme integration through two dedicated extensions:
4) PCuikit Extension
PCuikit is an extension tailored for Phoca Cart in Joomla. It is designed to seamlessly integrate with Phoca Cart, aligning with the UIkit framework and ensuring a flawless ecommerce experience.
PCuikit integrates the powerful Phoca Cart ecommerce platform for Joomla with the versatile YOOtheme Pro framework. With this integration, web designers and agencies can now leverage YOOtheme Builder's full potential to create visually stunning templates for various Phoca Cart views.
PCuikit supports templating for the following Phoca Cart views:
- Categories view
- Category view
- Product view.
This integration is a game-changer for businesses looking to elevate their online stores' appearance and functionality.
See: PCuikit
5) Yootheme PhocaCart Bridge
Yootheme PhocaCart Bridge is a bridge that links YOOtheme Pro Page Builder with PhocaCart. This integration offers a front-end, 'drag and drop' layout builder for PhocaCart entities, facilitating a dynamic and customizable ecommerce experience within the YOOtheme Pro environment.
See: Yootheme PhocaCart Bridge
6) Template Overrides for Enhanced Display
Phoca Cart includes template overrides for various modules, such as:
- Phoca Cart Cart module
- Phoca Cart Currency module
- Phoca Cart Wishlist module
- Phoca Cart Compare module
- Phoca Cart Search module.
These overrides ensure seamless integration and optimal display, enhancing user experience and functionality. These modules' content can be displayed in dropdown or offcanvas menus, providing versatile options for showcasing ecommerce elements.
See: Phoca Cart template overrides
See: Phoca Cart template overrides documentation
The seamless integration of Phoca Cart with YOOtheme underscores the commitment to providing users with a cohesive ecommerce solution within the Joomla CMS. By aligning design elements and functionality, this integration aims to enhance the ecommerce experience, enabling website owners to create visually appealing online stores while leveraging the extensive features of Phoca Cart. With the combined power of Phoca Cart and YOOtheme, Joomla users can now elevate their online businesses to new heights, achieving a perfect harmony of aesthetics and ecommerce capabilities.
See: YOOtheme Pro
Quick instructions
1) Install Joomla CMS
2) Install Phoca Cart (component, module package, etc.)
3) Install Phoca Cart template overrides - e.g. Overrides - YOOtheme OffCanvas
4) Install YOOtheme PRO
5) Set YOOtheme as the default template
6) In Phoca Cart options, set the parameters Theme: UIkit, Icon Type: SVG, Load Specific CSS: YOOtheme
7) Set the position of Phoca Cart modules (Cart, Search, Compare, Wishlist, Currency) e.g. to "header" position
8) Create categories, products, etc. in Phoca Cart
9) Create a menu link to Phoca Cart (preferably to Categories view).
If you are not sure about something or need more detailed information, check the documentation pages or ask in the Phoca forum.
Phoca Cart - YOOtheme - categories view:
Phoca Cart - YOOtheme - category view:
Phoca Cart - YOOtheme - product view (mobile)
Phoca Cart - YOOtheme - checkout view:
