#61

Product support

Visit this product's website for support.

Categories

  • Marketing

Shopaholic is a great solution designed to showcase products in your online store provided for you free of charge. It’s a catalogue with built-in functionality and tools to provide customers with basic online shopping experience that can be extended through extra plugins. The additional plugins can be used to build a full-fledged marketplace, while the basic Shopaholic solution is not overcrowded with unnecessary components. This minimalistic approach coincides with October CMS’ philosophy. So you may add functionality to your online shop as you go.

Common Tasks

Shopaholic lets you implement the following eCommerce features:

  • Display the category hierarchy with interactive menus
  • Display the product catalogue
  • Apply filters by category or brand, sort products by price or new additions
  • Display the product, category and brand pages

With the help of Shopaholic’s standard functions, combining them together it’s also possible to solve many other nontrivial tasks, such as displaying blocks of random products, displaying the cheapest and most expensive products, etc.

Features:

Products & Product offers. Products have basic properties and standard description. Customers can preview the short or open the product’s full description, view single images or the full gallery for a certain product.

Products offers provide custom features and parameters for products which allow customers to choose a product with individual characteristics (like technical specifications). You don’t have to create separate components for products of the same type. Instead you can allow customers to configure the product’s parameters to their individual needs. The product’s features may also include the current price and the price before discount.

Shopaholic allows to display simple product descriptions without any customizable features, e.g. a certain vacuum cleaner model, as well as complex product offers, like smartphones with a choice of colors, RAM capacity, and other properties.

This feature can be extended by the Properties for Shopaholic plugin which allows to create specific product specifications for a certain industry.

Brands & Categories. Shopaholic allows to group products by brand, category and subcategory. Products can also be filtered and displayed accordingly.

Basic Filtering and sorting features. The plugin allows basic filtering by categories, subcategories or brands and sorting by new additions and price. This functionality can be extended by the Properties for Shopaholic plugin, allowing to filter and display products according to the special properties and specifications created using the plugin.

Integration with RainLab Translate plugin. The Translate plugin allows Shopaholic to be multilingual. So you can build your online store and display your content in various languages.

Extra Plugins

The functionality of your online catalogue built using our plugin may be further extended by our additional plugins. We ensure the high quality of our plugins and provide you with full support. All of our plugins have extensive documentation. The quality of our plugins goes through vigorous testing and we have launched automated testing for all of our plugins. Our code conforms with the best writing and structuring practises. All this guarantees the stable work of our plugins after they are updated with new functionality and ensures their smooth integration.

Orders for Shopaholic plugin

Adds a shopping cart with functionalities to: add and remove products, move to checkout, choose the delivery and payment methods.

Properties for Shopaholic plugin

Allows to create custom product properties specifically for the stores specialization (whether it’s a hardware store or clothing retail shop).

Filter for Shopaholic plugin

Introduces complex filtering features where you can create filters by brand, category and other properties, including the special properties provided by the Properties plugin.

Buddies plugin

Provides basic authorization and authentication features, abilities to display error messages and create custom user profile settings (like sex, company, email, job position, phone number and others)

Omnipay for Shopaholic plugin

Plugin adds integration with package laravel-omnipay to your online store.

Tags for Shopaholic plugin

Binding products by tags and displaying groups of products.

Popularity for Shopaholic plugin

Calculating product popularity. Add sorting products by popularity.

Plugins that are coming soon:

  • Accessories for Shopaholic – additional functionality to bind accessories to products
  • Compare for Shopaholic – functionality to add or remove products for comparison
  • Reviews for Shopaholic – functionality that allows users to comment on products, display lists of comments. A comment may contain a grade from 1 to 5. The plugin allows to display and average grade for the product.
  • Stickers for Shopaholic – functionality to add stickers to products (new, hot price, sale).
  • Stores for Shopaholic – Allows to bind products offers to a retail store, group stores by region.
  • Gifts for Shopaholic – functionality to bind gifts to products.
  • Multicurrency for Shopaholic – functionality to set the product price in different currencies.

Get involved and contribute to the project

If you're interested in improving this project you can help in the following ways:

  • Reporting bugs and recommending new features on our plugin GitHub issues page; Contributing to the project following these instructions;

Shopaholic – no drinking, just shopping :)

License

© 2017, LOVATA Group, LLC under GNU GPL v3.

Developed by Andrey Kharanenka.

These plugin(s) are required for the plugin:

Product settings

First steps

Let's start getting acquainted with plugin and take the first steps with quick start guide:

  • Step 1: It works!
  • Step 2: Create product page.
  • Step 3: Render the catalog menu using the category tree.
  • Step 4: Create category page with render list of child categories.
  • Step 5: Create catalog page with render list of products.

The full plugin documentation is abailable here.

ProductList component

The component allows to work with ProductCollection class objects.

Method list

make($arElementIDList = null)

Example: render of product list

Get collection of product, apply sorting, filter by flag "active" and category ID.

{% set obCategory = CategoryPage.get() %}

{% set obProductList = ProductList.make().sort(ProductList.getSorting()).active().category(obCategory.id) %}
{% if obProductList.isNotEmpty() %}
    <div class="product-list-wrapper">
        {% for obProduct in obProductList %}
            <div data-id="{{ obProduct.id }}">
                <h1>{{ obProduct.name }}</h1>
                {% if obProduct.preview_image is not empty %}
                    <img src="{{ obProduct.preview_image.path }}" title="{{ obProduct.preview_image.title }}" alt="{{ obProduct.preview_image.description }}">
                {% endif %}
                <div>{{ obProduct.preview_text }}</div>
            </div>
        {% endfor %}
    </div>
{% endif %}

Get collection of products, apply filter by flag "active" and category ID + Pagination component.

{% set obCategory = CategoryPage.get() %}

{# Get product collection #}
{% set obProductList = ProductList.make().sort(ProductList.getSorting()).active().category(obCategory.id) %}

{# Get array with pagination buttons #}
{% set iPage = Pagination.getPageFromRequest() %}
{% set arPaginationList = Pagination.get(iPage, obProductList.count()) %}

{# Apply pagination to product collection and get array with product items #}
{% set arProductList = obProductList.page(iPage, Pagination.getCountPerPage()) %}

{% if arProductList is not empty %}

    {# Render product list #}
    <div class="product-list-wrapper">
        {% for obProduct in obProductList %}
            <div data-id="{{ obProduct.id }}">
                <h1>{{ obProduct.name }}</h1>
                {% if obProduct.preview_image is not empty %}
                    <img src="{{ obProduct.preview_image.path }}" title="{{ obProduct.preview_image.title }}" alt="{{ obProduct.preview_image.description }}">
                {% endif %}
                <div>{{ obProduct.preview_text }}</div>
            </div>
        {% endfor %}
    </div>

    {# Render pagination buttons #}
    {% if arPaginationList is not empty %}
        {% for arPagination in arPaginationList %}
            <a href="?page={{ arPagination.value }}" class="{{ arPagination.class }}">{{ arPagination.name }}</a>
        {% endfor %}
    {% endif %}
{% endif %}
getAvailableSorting()

Get array with available sorting keys (see).

getSorting()

Get active sorting key value.

onAjaxRequest()

Empty method for ajax request.

ProductPage/ProductData component

The component allows to work with ProductItem class objects.

Usage example:

[ProductPage]
slug = "{{ :slug }}"
==

{# Get product item #}
{% set obProduct = ProductPage.get() %}
<div data-id="{{ obProduct.id }}">
    <h1>{{ obProduct.name }}</h1>
    {% if obProduct.preview_image is not empty %}
        <img src="{{ obProduct.preview_image.path }}" title="{{ obProduct.preview_image.title }}" alt="{{ obProduct.preview_image.description }}">
    {% endif %}
    <span>Category: {{ obProduct.category.name }}</span>
    <span>Brand: {{ obProduct.brand.name }}</span>
    <span>Brand: {{ obProduct.brand.name }}</span>
    {% set obOffer = obProduct.offer.first() %}
    {% if obOffer.isNotEmpty()%}  
        <span>Price: {{ obOffer.price }} {{ obOffer.currency }}</span>
    {% endif %}
    <div>{{ obProduct.description|raw }}</div>
</div>

CategoryList component

The component allows to work with CategoryCollection class objects.

Method list

make($arElementIDList = null)

Example: render of category list

Get tree of categories. Example is used in render of category menu.

{% set obCategoryList = CategoryList.make().tree() %}
{% if obCategoryList.isNotEmpty() %}
    <ul class="category-menu-wrapper">
        {% for obCategory in obCategoryList if obCategory.product_count > 0 %}
            <li data-id="{{ obCategory.id }}">{{ obCategory.name }}
                {% if obCategory.children.isNotEmpty() %}
                    <ul class="category-child-menu-wrapper">
                        {% for obChildCategory in obCategory.children if obChildCategory.product_count > 0 %}
                            <li>{{ obChildCategory.name }}</li>
                        {% endfor %}
                    </ul>
                {% endif %}
            </li>
        {% endfor %}
    </ul>
{% endif %}

CategoryPage/CategoryData component

The component allows to work with CategoryItem class objects.

Usage example:

[CategoryPage]
slug = "{{ :slug }}"
==

{# Get category item #}
{% set obCategory = CategoryPage.get() %}
<div data-id="{{ obCategory.id }}">
    <h1>{{ obCategory.name }}</h1>
    {% if obCategory.preview_image is not empty %}
        <img src="{{ obCategory.preview_image.path }}" title="{{ obCategory.preview_image.title }}" alt="{{ obCategory.preview_image.description }}">
    {% endif %}
    <div>{{ obCategory.description|raw }}</div>
    {% if obCategory.children.isNotEmpty() %}
        <ul>
            {% for obChildCategory in obCategory.children %}
                <li>{{ obChildCategory.name }}</li>
            {% endfor %}
        </ul>
    {% endif %}
</div>

BrandList component

The component allows to work with BrandCollection class objects.

Method list

make($arElementIDList = null)

Example: render brand list

Get collection of brands, apply sorting + filter by flag "active"

{% set obBrandList = BrandList.make().sort().active() %}
{% if obBrandList.isNotEmpty() %}
    <div class="brand-list-wrapper">
        {% for obBrand in obBrandList %}
            <div data-id="{{ obBrand.id }}">
                <h1>{{ obBrand.name }}</h1>
                {% if obBrand.preview_image is not empty %}
                    <img src="{{ obBrand.preview_image.path }}" title="{{ obBrand.preview_image.title }}" alt="{{ obBrand.preview_image.description }}">
                {% endif %}
                <div>{{ obBrand.preview_text }}</div>
            </div>
        {% endfor %}
    </div>
{% endif %}

Get brand collection, apply sorting + filter by flag "active" + Pagination component

{# Get brand collection #}
{% set obBrandList = BrandList.make().sort().active() %}

{# Get array with pagination buttons #}
{% set iPage = Pagination.getPageFromRequest() %}
{% set arPaginationList = Pagination.get(iPage, obBrandList.count()) %}

{# Apply pagination to brand collection and get array with brand items #}
{% set arBrandList = obBrandList.page(iPage, Pagination.getCountPerPage()) %}

{% if arBrandList is not empty %}

    {# Render brand list #}
    <div class="brand-list-wrapper">
        {% for obBrand in obBrandList %}
            <div data-id="{{ obBrand.id }}">
                <h1>{{ obBrand.name }}</h1>
                {% if obBrand.preview_image is not empty %}
                    <img src="{{ obBrand.preview_image.path }}" title="{{ obBrand.preview_image.title }}" alt="{{ obBrand.preview_image.description }}">
                {% endif %}
                <div>{{ obBrand.preview_text }}</div>
            </div>
        {% endfor %}
    </div>

    {# Render pagination buttons #}
    {% if arPaginationList is not empty %}
        {% for arPagination in arPaginationList %}
            <a href="/{{ arPagination.value }}" class="{{ arPagination.class }}">{{ arPagination.name }}</a>
        {% endfor %}
    {% endif %}
{% endif %}

BrandPage/BrandData component

The component allows to work with BrandItem class objects.

Usage example:

[BrandPage]
slug = "{{ :slug }}"
==

{# Get brand item #}
{% set obBrand = BrandPage.get() %}
<div data-id="{{ obBrand.id }}">
    <h1>{{ obBrand.name }}</h1>
    {% if obBrand.preview_image is not empty %}
        <img src="{{ obBrand.preview_image.path }}" title="{{ obBrand.preview_image.title }}" alt="{{ obBrand.preview_image.description }}">
    {% endif %}
    <div>{{ obBrand.description|raw }}</div>
</div>

Breadcrumbs component

The component helps to render catalog breadcrumbs.

Method list

getByCategoryID($iCategoryID)

Example: render ob breadcrumbs for category page

The method helps to render breadcrumbs list of category page. The method returns with breadcrumbs items (field list: id, name, slug, active).

[CatalogBreadcrumbs]

[CategoryPage]
==

{% set obCategory = CategoryPage.get() %}
{% set arBreadcrumbs = CatalogBreadcrumbs.getByCategoryID(obCategory.id) %}
{% if arBreadcrumbs is not empty %}
    <ul>
        {% for arItem in arBreadcrumbs %}
            <li data-id="{{ arItem.id }}" class="{% if arItem.active %} _active {% endif %}">
                {{ arItem.name }}
            </li>
        {% endfor %}
    </ul>
{% endif %}
getByProductID($iProductID)

Example: render ob breadcrumbs for product page

The method helps to render breadcrumbs list of product page. The method returns array with breadcrumbs items (field list: id, name, slug, active). Result array has product data and category list.

[CatalogBreadcrumbs]

[ProductPage]
==

{% set obProduct = ProductPage.get() %}
{% set arBreadcrumbs = CatalogBreadcrumbs.getByProductID(obProduct.id) %}
{% if arBreadcrumbs is not empty %}
    <ul>
        {% for arItem in arBreadcrumbs %}
            <li data-id="{{ arItem.id }}" class="{% if arItem.active %} _active {% endif %}">
                {{ arItem.name }}
            </li>
        {% endfor %}
    </ul>
{% endif %}
  • Found the plugin useful on 8 Dec, 2017

    I have insert the code for displaying product list but it doesn't display my products is there any configuration I need to setup? I also set to active all my products.

  • author

    Replied on 10 Dec, 2017

    Hi!

    Thank you for using Shopaholic! We've answered your question at your Github issue.

    Have a nice experience with Shopaholic! ;)

1.3.1

Fix: processing of the "nesting" flag for the menu type "catalog"

Jan 15, 2018

1.3.0

!!! Add menu types for integration with the StaticPage plugin. Add getPageUrl() method to the CategoryItem class. Requires Toolbox plugin version 1.4.0 and later. Thanks for contribution Alvaro Cánepa.

Jan 14, 2018

1.2.3

!!! Adding additional cache cleaning for the sorted list of brands, after the creation of a new brand. Requires Toolbox plugin version 1.3.0 and later.

Jan 08, 2018

1.2.2

Add additional cache cleaning after category reordering

Dec 15, 2017

1.2.1

Remove php short tags from offers/update.htm

Dec 15, 2017

1.2.0

preview_image, images fields in item classes returns \System\Models\File class objects. Add integration with "Reviews for Shopaholic" plugin

Dec 13, 2017

1.1.0

Add integration with "Popularity for Shopaholic" and "Tags for Shopaholic" plugins

Dec 08, 2017

1.0.0

Initialize plugin.

Dec 06, 2017