Menu Close
    Searching for an experienced eCommerce & Marketplace Development Company ?

    How to add a filter in the administration at the Shopware

    In this blog, you are going to learn “How to add a filter in the administration at Shopware.”
    I hope you know the directory structure of Shopware 6 plugin, if you don’t know, see here-

    The main entry point to extend the administration via plugin is the main.js file. You have to be placed into a /src/Resources/app/administration/src directory in order to be found by Shopware 6.

    If you don’t know how to create a module, you can look here.

    {% block test_list %}
            {% block test_list_sidebar %}
                <template #sidebar>
                        {% block test_list_sidebar_filter %}
                            <sw-sidebar-item icon="default-action-filter"
                                {% block test_list_sidebar_filter_items %}
                                    <sw-field type="text"
                                            :label="product name"
                                            :placeholder="Enter the product name"
                                {% endblock %}
                        {% endblock %}
            {% endblock %}
    {% endblock %}

    In the above code, we are using the sidebar component you can look here. Under the sidebar component, you have to create a sidebar item component and add the component through which you can search the data, in my case I am using sw-field of type text and sw-button component to call the function.

    import template from './test.html.twig';
    const { Component, Mixin } = Shopware;
    const { Criteria } = Shopware.Data;
    Component.register('test-list', {
        inject: ['repositoryFactory'],
        mixins: [
        data() {
            return {
                isLoading: false,
                list: null,
                productName: null
        metaInfo() {
            return {
                title: this.$createTitle()
        created() {
        computed: {
            testRespository() {
                return this.repositoryFactory.create('test');
            criteria() {
                if (this.productName) {
                    const criteria = new Criteria();
                    criteria.addFilter(Criteria.equalsAny('productName', this.productName));
                    return criteria;
                } else {
                    const criteria = new Criteria();
                    return criteria;
        methods: {
            getList() {
                this.isLoading = true;
      , Shopware.Context.api).then((result) => {
                    this.list = result;
                    this.isLoading = false;
            filter() {
                this.isLoading = true;

    In this file, there is an entity named `test`. There is a simple logic to search the data from the entity you can build your logic according to need. If the product name is available then criteria search data according to them.

    The typed global search needs an instance of the JavaScript class ApiService with the key of the entity in the camel case suffixed with Service. The service key is the best service when requesting service for a test. Secondly, entity definition gets automatically an instance in the injection container but can override so there is no additional work needed.

    You can add the filter on any page like listing page, detail page according to your need. Secondly, add the single select or multi-select to filter the data from the entity and show them because it is not possible to add the repository in the administration search. It makes the website very complex. We recommend you that add filter on the page.

    I hope it will help you. Thanks for reading. Happy Coding 🙂
    Thank You.

    . . .
    Discuss on Helpdesk

    Leave a Comment

    Your email address will not be published. Required fields are marked*


  • pedram
    hi .thank you .i have a question about how i can choose default Value for this.
    • Diwakar Rana (Moderator)
      Hello, Thanks for your valuable comment. Glad to know that it helps you. You can use the select field instead of the text field and then pass the id of the product to the criteria. For any other queries, please mail us at [email protected]
  • Back to Top