Guten Morgen,
werden dir Änderungen, die du im Child-Theme machst im Frontend schon angezeigt, das ist erstmal wichtig um zu testen, ob bei der Einrichtung des Child-Themes alles funktioniert hat.
Das komplette Date müsste so aussehen: \views\storefront\component\product\listing.html.twig
{% sw_extends '@Storefront/storefront/component/product/listing.html.twig' %}
{% block element_product_listing_col %}
{% for product in searchResult %}
<div class="cms-listing-col col-6 {{ listingColumns }}">
{% block element_product_listing_box %}
{% sw_include '@Storefront/storefront/component/product/card/box.html.twig' with {
'layout': boxLayout,
'displayMode': displayMode
} %}
{% endblock %}
</div>
{% endfor %}
{% endblock %}
Die einzige Änderung, die ich gemacht habe, ist in Zeile 5. Da habe ich die Bootstrap-Klasse col-6 hinzugefügt. Damit werden die Spalten (Produkte) auf 6/12 eingestellt für den Smartphone Viewport.
Die Tablet und Desktop-Ansicht werden nicht überschrieben (durch die Variabel {{ listingColumns }} danach).
Mehr zum Boostrap Grid-System hier: Grid system · Bootstrap v5.0
Evtl musst du die Abstände noch etwas mit CSS anpassen, aber mit der o.g. Änderungen sollten auf jeden Fall schonmal 2 Artikel nebeneinander angezeigt werden.
Viele Grüße
Tom