html, css, js and twig code element for the shopping experiences

The extension provides a cms block and a cms element for html, css, js and twig code under the block category HTML within a layout.

If required, the cms element can be used at any cms block as usual using the corresponding icon.

After enabling the twig compilation, you can also use twig variables and snippets in the fields.

This makes it possible to personalize content in the shopping experiences or to display customer, category or product data.

Display of the greeting from the sidebar of the customer account in a shopping experience

1. Place the cms block in the layout
2. Activate the switch enable twig compiling for all fields
3. Insert the following content into the field html code:

{% if context.customer %}
    <p class="welcome">
        {{ 'account.greetings'|trans|sw_sanitize }}
        {% if context.customer.salutation and context.customer.salutation.salutationKey != 'not_specified' %}
            {{ context.customer.salutation.translated.displayName }}
        {% endif %}
        {% if context.customer.title %}
            {{ context.customer.title }} 
        {% endif %}
        {{ context.customer.firstName }} {{ context.customer.lastName }}
    </p>
{% endif %}

How to install the extension

via zip and console (recommended)

1. Download the latest SschreierHtmlCssJsTwigCodeElementForShoppingExperiences-master.zip.
2. Unzip the zip file and rename the folder to SschreierHtmlCssJsTwigCodeElementForShoppingExperiences.
3. Move the folder to the project folder custom/plugins/ .
4. Connect to the console via ssh:

bin/console plugin:refresh
bin/console plugin:install --activate SschreierHtmlCssJsTwigCodeElementForShoppingExperiences

via composer

1. Add the repository URL to the composer.json of the project

"repositories": [
    ...,
    {
        "type": "vcs",
        "url": "https://github.com/sschreier/SschreierHtmlCssJsTwigCodeElementForShoppingExperiences"
    }
],

2. Connect to the console via ssh and install the plugin via the command

composer require sschreier/sschreierhtmlcssjstwigcodeelementforshoppingexperiences
bin/console plugin:refresh
bin/console plugin:install --activate SschreierHtmlCssJsTwigCodeElementForShoppingExperiences

via https://packagist.org

• Connect to the console via ssh and install the plugin via the command

composer require sschreier/sschreierhtmlcssjstwigcodeelementforshoppingexperiences
bin/console plugin:refresh
bin/console plugin:install --activate SschreierHtmlCssJsTwigCodeElementForShoppingExperiences

via zip upload

1. Download the latest SschreierHtmlCssJsTwigCodeElementForShoppingExperiences-master.zip.
2. Unzip the zip file and rename the folder to SschreierHtmlCssJsTwigCodeElementForShoppingExperiences.
3. Zip the folder to SschreierHtmlCssJsTwigCodeElementForShoppingExperiences.zip.
4. Upload the zip in the Shopware Administration.
5. Install & Activate the extension.

extension update (zip)

1. Download the latest SschreierHtmlCssJsTwigCodeElementForShoppingExperiences-master.zip.
2. Unzip the zip file and rename the folder to SschreierHtmlCssJsTwigCodeElementForShoppingExperiences.
3. Zip the folder to SschreierHtmlCssJsTwigCodeElementForShoppingExperiences.zip.
4. Upload the zip in the Shopware Administration.
5. Update the extension.

Images

additional cms blocks and cms element part 1

additional cms blocks and cms element part 2

additional cms blocks and cms element part 3

additional cms blocks and cms element part 4

additional cms blocks and cms element part 5

additional cms blocks and cms element part 6

additional cms blocks and cms element part 7