"Customizations" part 1 chapter

docs/getting-started-with-sylius/custom-business-logic.rst

@@ -0,0 +1,2 @@
+Custom business logic
+=====================

docs/getting-started-with-sylius/customizations.rst

@@ -1,3 +0,0 @@
-Customizations
-==============
-

docs/getting-started-with-sylius/index.rst

@@ -12,7 +12,8 @@ to the first results ("I can sell some stuff online!").
     basic-configuration
     shipping-and-payment
     first-product
-    customizations
+    shop-customizations
+    custom-business-logic
     plugin-installation
     deployment
     summary

docs/getting-started-with-sylius/map.rst.inc

@@ -2,7 +2,8 @@
 * :doc:`/getting-started-with-sylius/basic-configuration`
 * :doc:`/getting-started-with-sylius/shipping-and-payment`
 * :doc:`/getting-started-with-sylius/first-product`
-* :doc:`/getting-started-with-sylius/customizations`
+* :doc:`/getting-started-with-sylius/shop-customizations`
+* :doc:`/getting-started-with-sylius/custom-business-logic`
 * :doc:`/getting-started-with-sylius/plugin-installation`
 * :doc:`/getting-started-with-sylius/deployment`
 * :doc:`/getting-started-with-sylius/summary`

docs/getting-started-with-sylius/shop-customizations.rst

@@ -0,0 +1,60 @@
+Shop Customizations
+===================
+
+What makes Sylius unique from other e-commerce systems is not only its high developer community or clean code base. The developer
+experience has always been a great advantage of this platform - and it includes easiness of customization and great extendability.
+
+Let's get the benefit from these features and make some simple customization, to make your store even much suitable for your
+business needs.
+
+Logo
+----
+
+You can start with the shop panel. The default templates are elegant and straightforward, but for sure you would like
+to make them unique for your online store. Maybe some colors should be different? Or even the whole product page does
+not look like you want? Fortunately, twig templates are easy to override or customize (take a look at
+:doc:`Customizing Templates cookbook </book/orders/checkout>` for more info).
+
+In the beginning, try a very simple, but also one of the most crucial change - displaying your shop logo instead of the Sylius' one.
+
+Default logo in shop panel:
+
+.. image:: /_images/getting-started-with-sylius/logo-before.png
+
+The first step is to detect which template is responsible for displaying the logo and therefore which should be overridden
+to customize a logo image.
+
+It's placed in **SyliusShopBundle**, at ``Resources/views/_header.html.twig.path``, so to override it,
+you should create a ``templates/bundles/SyliusShopBundle/_header.html.twig`` file and copy the original file content. Next, replace the
+``img`` element source with a link to the logo or properly imported asset image (take a look at
+`Symfony assets documentation <https://symfony.com/doc/current/best_practices/web-assets.html>`_ for more info).
+
+.. hint::
+
+    Psst! To speed up your learning path you can just put a logo file into the ``public/assets/`` directory. Just remember,
+    it should not be committed into the repository or throw on the server, it's just for the testing reasons!
+
+At the end of customization, the overridden file would look similar to this:
+
+.. code-block:: twig
+
+    <div class="ui basic segment">
+        <div class="ui three column stackable grid">
+            <div class="column">
+                <a href="{{ path('sylius_shop_homepage') }}"><img src="{{ asset('assets/logo.png') }}" alt="Logo" class="ui small image" /></a>
+            </div>
+            <div class="column">
+                {{ sonata_block_render_event('sylius.shop.layout.header') }}
+            </div>
+            <div class="right aligned column">
+                {{ render(url('sylius_shop_partial_cart_summary', {'template': '@SyliusShop/Cart/_widget.html.twig'})) }}
+            </div>
+        </div>
+    </div>
+
+A custom logo should now be displayed on the Shop panel header:
+
+.. image:: /_images/getting-started-with-sylius/logo-after.png
+
+Great! You've managed to customize a template in Sylius! Let's move to something a little bit more complicated but also much
+more satisfying - introducing your own business logic into the system.