W dzisiejszej erze cyfrowej zakupy online stają się coraz bardziej popularne, a klienci oczekują łatwego porównywania produktów przed dokonaniem zakupu. Stworzenie narzędzia do porównywania produktów może znacznie poprawić doświadczenia użytkownika sklepu internetowego, otwierając orzed nim nowe możliwości porównywania i wybierania produktów. W tym przewodniku przedstawimy kroki tworzenia własnego narzędzia do porównywania produktów w Sylius, dla platform, które potrzebują niestandardowych rozwiązań.


Sylius – zaawansowana platforma e-commerce typu open source dla tych, którzy potrzebują niestandardowych rozwiązań

Sylius to elastyczna platforma e-commerce typu open source oparta na frameworku Symfony, stworzona z myślą o średnich i dużych przedsiębiorstwach, które potrzebują niestandardowych rozwiązań i chcą mieć pełną kontrolę nad rozwojem swojego sklepu internetowego. Dzięki modułowej budowie, Sylius idealnie sprawdza się zarówno w przypadku małych i średnich sklepów internetowych, jak i dużych firm, które potrzebują skalowalności i możliwości dalszej rozbudowy.

Platforma Sylius umożliwia tworzenie dedykowanych funkcjonalności takich jak porównywarka produktów, zaawansowane zarządzanie katalogiem, integracje z zewnętrznymi narzędziami oraz zewnętrznymi systemami, a także oferuje łatwą integrację dzięki REST API. Dzięki otwartemu dostępowi do kodu źródłowego, programiści mogą w pełni dostosować sklep do indywidualnych wymagań biznesowych, implementując nowe funkcje, optymalizując funkcjonalności sklepu oraz dostosowując wygląd i działanie podstron sklepu.

Sylius pozwala na elastyczne zarządzanie procesami sprzedażowymi, wspiera multi source inventory oraz umożliwia ekspansję na nowe rynki. System jest przygotowany na integrację z różnymi systemami płatności, ERP, CRM i narzędziami marketingowymi, co czyni go odpowiednim wyborem dla firm poszukujących rozwiązania open source o wysokiej wartości biznesowej.

Dla firm potrzebujących jeszcze więcej, dostępna jest również wersja komercyjna – Sylius Plus, oferująca dodatkowe moduły i wsparcie techniczne, co czyni ją idealnym wyborem dla rozbudowanych projektów i bardziej wymagających klientów.


Krok 1: Dodaj i skonfiguruj atrybuty produktu

  1. Korzystając z panelu administracyjnego Syliusa, dodaj wymagane atrybuty dla swoich produktów w zakładce Atrybuty.

  1. Przejdź do strony edycji produktu i znajdź zakładkę „Atrybuty”. Tutaj możesz wybrać utworzone atrybuty i ustawić ich wartości zgodnie z produktem.

Więcej informacji o atrybutach Syliusa znajdziesz tutaj i tutaj.

Przedstawię dwa podejścia do tworzenia porównywarki produktów. Pierwsze z nich będzie polegało na budowaniu tej funkcjonalności od podstaw, podczas gdy w drugim podejściu wykorzystamy popularne rozwiązanie Wishlist, aby rozszerzyć i dodać porównywarkę.

Pierwsze podejście (od podstaw)

Krok 1: Utwórz jednostkę porównującą (Comparer Entity)

Jednostka Comparer reprezentuje rzeczywisty zestaw porównań utworzony przez użytkownika. Ta jednostka będzie przechowywać informacje o porównaniu, takie jak użytkownik, który je utworzył, oraz listę porównywanych produktów.

Comparer.php

<?php

declare(strict_types=1);

namespace App\Entity;

use Sylius\Component\Resource\Model\ResourceInterface;
use Sylius\Component\Resource\Model\ResourceTrait;
use Sylius\Component\Customer\Model\CustomerInterface;
use Doctrine\ORM\Mapping as ORM;
use Doctrine\Common\Collections\ArrayCollection;
use Doctrine\Common\Collections\Collection;

/**
 * @ORM\Entity
 * @ORM\Table(name="app_comparer")
 */
class Comparer implements ResourceInterface
{
    /**
     * @ORM\ManyToOne(targetEntity="Sylius\Component\Customer\Model\CustomerInterface")
     * @ORM\JoinColumn(name="customer_id", referencedColumnName="id", nullable=true)
     */
    protected $customer;

    /**
     * @ORM\OneToMany(targetEntity="ComparerProduct", mappedBy="comparer", cascade={"persist", "remove"})
     */
    protected $comparerProducts;

    public function __construct()
    {
        $this->comparerProducts = new ArrayCollection();
    }
    
    public function getComparerAttributes(string $locale, string $defaultLocale, Collection $products): Collection
    {
        $attributes = new ArrayCollection();
        /** @var ProductInterface $product */
        foreach ($products as $product) {
            foreach ($product->getAttributesByLocale(
                $locale,
                $defaultLocale
            ) as $attribute) {
                if ($attributes->contains($attribute->getName())) {
                    continue;
                }
                
                $attributes->add($attribute->getName());
            }
        }

        return $attributes;
    }

    // ... other getters and setters
}

Krok 2: Utwórz jednostkę ComparerProduct

Jednostka ComparerProduct reprezentuje produkt w określonym zestawie porównawczym. Będzie przechowywać informacje o produkcie, takie jak jego atrybuty i wszelkie dodatkowe dane potrzebne do porównania.

ComparerProduct.php

<?php

declare(strict_types=1);

namespace App\Entity;

use Sylius\Component\Core\Model\ProductInterface;
use Sylius\Component\Resource\Model\ResourceInterface;
use Sylius\Component\Resource\Model\ResourceTrait;
use Doctrine\ORM\Mapping as ORM;

/**
 * @ORM\Entity
 * @ORM\Table(name="app_comparer_product")
 */
class ComparerProduct implements ResourceInterface
{
    /**
     * @ORM\ManyToOne(targetEntity="Comparer", inversedBy="comparerProducts")
     * @ORM\JoinColumn(name="comparer_id", referencedColumnName="id", nullable=false)
     */
    protected $comparer;

    /**
     * @ORM\ManyToOne(targetEntity="Sylius\Component\Core\Model\ProductInterface")
     * @ORM\JoinColumn(name="product_id", referencedColumnName="id", nullable=true)
     */
    protected $product;

// ... getters/setters
}

Krok 3: Aktualizacja schematu bazy danych 

Po utworzeniu encji z adnotacjami Doctrine musisz zaktualizować schemat bazy danych, aby odzwierciedlić zmiany. Uruchom następujące polecenia:

bin/console doctrine:migrations:diff
bin/console doctrine:migrations:migrate

Polecenia te wygenerują i wykonają niezbędne migracje bazy danych.

Krok 4: Logika kodu dodawania produktów do porównywarki i wyświetlania wyników

W tym kroku nie przedstawiamy konkretnego podejścia, ponieważ jest to indywidualna sprawa każdego systemu eCommerce. Dodawanie do porównywarki może być implementowane na liście produktów lub na każdej stronie produktu. Sama porównywarka może istnieć jako osobna strona lub na przykład jako pływający widget.

Drugie podejście – rozszerzamy wtyczkę Sylius Wishlist autorstwa BitBaga

1. SyliusWishlistPlugin

Jeśli używasz naszego SyliusWishlistPlugin, możesz użyć jego klas jako fundamentu i dodać porównywarkę produktów jako dodatkową funkcję. Na przykład możesz wprowadzić nową akcję zbiorczą, aby porównać wybrane produkty.

Sylius - Lista życzeń  
Sylius – Lista życzeń  

2. Pobierz atrybuty produktu z jednostki Lista życzeń

 public function getProductsAttributes(string $locale, string $defaultLocale, Collection $products): Collection
  {
      $attributes = new ArrayCollection();

      /** @var ProductInterface $product */
      foreach ($products as $product) {
          foreach ($product->getAttributesByLocale(
              $locale,
              $defaultLocale
          ) as $attribute) {
              if ($attributes->contains($attribute->getName())) {
                  continue;
              }
                
              $attributes->add($attribute->getName());
          }
      }

      return $attributes;
  }

3. Dodaj przykładową logikę do wyświetlania pobranych danych

$products = $wishlist->getProductsByIds($productsIds);
$attributes = $wishlist->getProductsAttributes($request->getLocale(), $request->getDefaultLocale(), $products);

return new Response(
    $this->twigEnvironment->render('App/Compare/compare.html.twig', [
        'products' => $products,
        'attributes' => $attributes,
    ])
);

4. Przykład porównania produktów

Tworzymy i dostosowujemy wtyczki dla Syliusa

Podsumowanie

Tworzenie narzędzia do porównywania produktów w Syliusie może znacznie poprawić doświadczenia użytkownika na platformie eCommerce. Niezależnie od tego, czy zdecydujesz się na drobiazgowe podejście polegające na tworzeniu go od podstaw, czy wykorzystasz SyliusWishlistPlugin w celu uzyskania dodatkowej funkcjonalności, kluczem jest zrozumienie Twoich konkretnych wymagań.