README

Asdoria Pictogram Bundle

A plugin to create, group and associate pictograms with products

Features

• Create groups of pictograms using your own images
• Easily customize which pictograms to display from the product configuration page
• Images are automatically displayed on the product's store page

Toggling the pictograms to display for a product

Installation

1. run composer require asdoria/sylius-pictogram-plugin

2. Go into config/bundles.php. You must put the Pictogram plugin line ABOVE SyliusGridBundle

Asdoria\SyliusPictogramPlugin\AsdoriaSyliusPictogramPlugin::class => ['all' => true],
[...]
Sylius\Bundle\GridBundle\SyliusGridBundle::class => ['all' => true],

1. Import routes in config/routes.yaml

asdoria_pictogram:
    resource: "@AsdoriaSyliusPictogramPlugin/Resources/config/routing.yaml"
    prefix: /admin

1. Import config in config/packages/_sylius.yaml

imports:
    - { resource: "@AsdoriaSyliusPictogramPlugin/Resources/config/config.yaml"}

1. In src/Entity/Product/Product.php. Import Asdoria\SyliusPictogramPlugin\Traits\PictogramsTrait and initialize a pictogram collection in the constructor

// ...

use Asdoria\SyliusPictogramPlugin\Traits\PictogramsTrait;

/**
 * @ORM\Entity
 * @ORM\Table(name="sylius_product")
 */
class Product extends BaseProduct
{
    use PictogramsTrait;

    public function __construct()
    {
        parent::__construct();
        $this->initializePictogramsCollection();
    }
    
    // ...
}

1. run php bin/console do:mi:mi to update the database schema

Demo

You can see the result for the user here with a cap: here.
If you want to try to create pictograms, go on the admin authentication page and connect with:

Login: asdoria
Password: asdoria

Then go on "Pictograms Groups" in the back office and follow usage lines below.

Note that we have developed several other open source plugins for Sylius, whose demos and documentation are listed on the following page.

Usage

1. In the back office, under Catalog, enter Pictogram Groups. Create a group using a unique code
2. In Pictogram Groups, click Managing Pictograms to create/delete images for this group
3. Go to a product's edit page, then click the Pictograms tab in the sidebar. Here you can toggle which pictograms you wish to display