# Custom Products: Boxen auch für Pflichtfelder anfangs zugeklappt darstellen

**URL:** https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223
**Category:** Themes & Design
**Created:** [2. Januar 2018 um 10:45 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223 "2018-01-02T10:45:12Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![Kahmoonb](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/kahmoonb/32/19231_2.png) [@Kahmoonb](https://forum.shopware.com/u/Kahmoonb)
#### Post date: [2. Januar 2018 um 10:45 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223/1 "2018-01-02T10:45:12Z")

</div>

Hallo zusammen,

wir haben das Plugin von Custom Products gekauft, bekommen aber nicht wirklich support von Shopware. Daher die Frage an die Community.

Die Felder vom Konfigurator sollen immer zugeklappt starten, auch bei Pflichtfeldern. Wir haben recht viele Optionen die Pflichtfelder sind und wenn das alles aufgeklappt ist, wird die Liste riesig.

&nbsp;

Das entsprechende Template habe ich bereits gefunden:

/custom/plugins/SwagCustomProducts/Resources/frontend/js/jquery.swag-custom-products-collapse-panel.js

&nbsp;

Wenn ich &nbsp;//$panel.show(); in Zeile 60 auskommentiere bleiben die Panels zugeklappt. Pflichtfelder müssen aber jetzt zwei mal angeklickt werde bevor sie sich öffnen. Das liegt sicher dran das hier der entsprechende Status am Anfang noch nicht zugewiesen ist.

Beispiellink (nicht verlinkt wegen google): [shop.hartl-racing.de/de/speichenraeder/ktm/alpina-tubeless-wheels-supermoto-ktm-smr-exc-sxf-45.html#63d3ce6d15ff3f804a68ffe2891d1d19](http://shop.hartl-racing.de/de/speichenraeder/ktm/alpina-tubeless-wheels-supermoto-ktm-smr-exc-sxf-45.html#63d3ce6d15ff3f804a68ffe2891d1d19)

&nbsp;

Hat jemand ne Idee was ich noch in dieser Datei anpassen muss und vor allem wie ich ein JS updatesicher anpasse?

Anbei der Code aus der JS

&nbsp;

VG Frank

&nbsp;

```
;(function($, window) {
    'use strict';

    /**
     * Small helper plugin which toggles panels.
     */
    $.plugin('swagCustomProductsCollapsePanel', {

        /** @object Default plugin configuration */
        defaults: {

            /** @string Parent container selector */
            parentWrapperSelector: '.custom-products--option',

            /** @string Panel selector */
            customProductWrapperSelector: '.custom-product--option-wrapper',

            /** @string Active class */
            activeCls: 'is--active',

            /** @string Sliding speed in milli seconds */
            slideToggleSpeed: 175
        },

        /**
         * Initializes the plugin and applies the necessary event listeners.
         *
         * @returns void
         */
        init: function() {
            var me = this;

            me._on(me.$el, 'click', $.proxy(me.onTogglePanel, me));

            me.displayRequiredPanels();
			

            $.publish('plugin/swagCustomProductsCollapsePanel/init', [me]);
        },

        /**
         * Searches for active panels and shows them on start up.
         *
         * We have to use jQuery to show / hide the boxes cause `display: block` would
         * destroy the panel animations.
         *
         * @returns void
         */
        displayRequiredPanels: function() {
            var me = this;

            me.$el.parents(me.opts.parentWrapperSelector).each(function(i, item) {
                var $parent = $(item),
                    $panel = $parent.find(me.opts.customProductWrapperSelector);

                if (!$parent.hasClass(me.opts.activeCls)) {
                    return;
                }

                //$panel.show();
            });

            $.publish('plugin/swagCustomProductsCollapsePanel/displayRequiredPanels', [me]);
        },

        /**
         * Event listener method which will be fired when the user clicks `me.$el`.
         *
         * The method selects the parent DOM node of the clicked element and toggles
         * panel DOM node.
         *
         * @param e {jQuery.Event}
         */
        onTogglePanel: function(e) {
            var me = this,
                $target = $(e.target),
                $parent = $target.parents(me.opts.parentWrapperSelector),
                $panel = $parent.find(me.opts.customProductWrapperSelector);

            e.preventDefault();

            if ($parent.hasClass(me.opts.activeCls)) {
                $parent.removeClass(me.opts.activeCls);
                $panel.stop().slideUp(me.opts.slideToggleSpeed);
            } else {
                $parent.addClass(me.opts.activeCls);
                $panel.stop().slideDown(me.opts.slideToggleSpeed);
            }

            $.publish('plugin/swagCustomProductsCollapsePanel/onTogglePanel', [me, $panel, $parent, $target]);
        }
    });

    $(function() {
        StateManager.addPlugin('*[data-custom-products-collapse-panel="true"]', 'swagCustomProductsCollapsePanel');
    });
})(jQuery, window);

```

&nbsp;

---

<div class="post-metadata">

### Author: ![Kahmoonb](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/kahmoonb/32/19231_2.png) [@Kahmoonb](https://forum.shopware.com/u/Kahmoonb)
#### Post date: [2. Januar 2018 um 11:02 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223/2 "2018-01-02T11:02:42Z")

</div>

Problem eins habe ich wohl gelöst. Man muss nicht nur die Funktion des Panel aufklappens auskommentieren sondern auch noch die CSS Klasse is–active entfernen.

```
$parent.removeClass(me.opts.activeCls);
				
//$panel.show();

```

&nbsp;

Bleibt noch die Frage wie ich ein JS File updatesicher anlege.

---

<div class="post-metadata">

### Author: ![jagdexperte](https://avatars.discourse-cdn.com/v4/letter/j/dbc845/32.png) [@jagdexperte](https://forum.shopware.com/u/jagdexperte)
#### Post date: [3. Dezember 2018 um 16:09 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223/3 "2018-12-03T16:09:24Z")

</div>

> [@Kahmoonb schrieb:](https://forum.shopware.com/profile/27926/Kahmoonb "Kahmoonb")
> 
> Problem eins habe ich wohl gelöst. Man muss nicht nur die Funktion des Panel aufklappens auskommentieren sondern auch noch die CSS Klasse is–active entfernen.
> 
> $parent.removeClass(me.opts.activeCls);
> 
> //$panel.show();
> 
> &nbsp;
> 
> Bleibt noch die Frage wie ich ein JS File updatesicher anlege.

Hast du bereits eine Lösung gefunden? Wäre auch sehr daran interessiert.

&nbsp;

MfG&nbsp;

---

<div class="post-metadata">

### Author: ![Kahmoonb](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/kahmoonb/32/19231_2.png) [@Kahmoonb](https://forum.shopware.com/u/Kahmoonb)
#### Post date: [3. Dezember 2018 um 16:11 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223/4 "2018-12-03T16:11:54Z")

</div>

Nein, ich ändere das nach jedem Update bzw. überschreibe die ganze JS 🙂

---

<div class="post-metadata">

### Author: ![jagdexperte](https://avatars.discourse-cdn.com/v4/letter/j/dbc845/32.png) [@jagdexperte](https://forum.shopware.com/u/jagdexperte)
#### Post date: [3. Dezember 2018 um 16:14 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223/5 "2018-12-03T16:14:33Z")

</div>

Alles klar, aber danke trotzdem schonmal wegen der Lösung oben 😉

---

<div class="post-metadata">

### Author: ![NacScha](https://avatars.discourse-cdn.com/v4/letter/n/3bc359/32.png) [@NacScha](https://forum.shopware.com/u/NacScha)
#### Post date: [31. August 2020 um 09:18 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223/6 "2020-08-31T09:18:07Z")

</div>

Es gibt ja einen Nachfolger des Custom Products Plugin, welches unter engine/Shopware/Plugins/Community/Frontend/ installiert ist. Gibt es hierfür bereits eine Lösung für die zweite Version des Custom Products Plugin ?&nbsp;

---

<div class="post-metadata">

### Author: ![NacScha](https://avatars.discourse-cdn.com/v4/letter/n/3bc359/32.png) [@NacScha](https://forum.shopware.com/u/NacScha)
#### Post date: [31. August 2020 um 09:44 UTC](https://forum.shopware.com/t/custom-products-boxen-auch-fur-pflichtfelder-anfangs-zugeklappt-darstellen/50223/7 "2020-08-31T09:44:11Z")

</div>

Ah habe die Entsprechende Datei gefunden:  
/engine/Shopware/Plugins/Community/Frontend/SwagCustomProducts/Views/frontend/swag\_custom\_products/detail/default/index.tpl

Hier muss in der Zeile 29 folgender if-Block gelöscht werden:&nbsp;

```
 {if $option['required']} is--active{/if}

```

&nbsp;

MfG Nac
