Show Shopware Custom Products under Variant Selection

17.01.2020
by Meike Müller
Shopware
Banner
Wondering how to display custom products under variant selection in Shopware? Below you will find a short tutorial - have fun with it!

A big problem with Shopware's Custom Products plugin is that it doesn't allow you to set whether the variant selection should appear above or below the Custom Products options.

Often it makes more sense from the user flow to select a product variant first and then do the extras or customizations. The necessary adjustments are also very limited, so we want to give you a short guide here:

CUSTOMIZATION IN THE THEME

In your theme you have to overwrite two template files: frontend/detail/data.tpland frontend/detail/content/buy_container.tpl

If these files do not exist in your theme, please create them.

Then make sure that the appropriate template file is extended at the very beginning (e.g. {extends file='parent:frontend/detail/data.tpl'}).

Now it's time to get down to the nitty gritty: In the data.tpl you add the following block:

{* Custom products frontend hook *}
{block name="frontend_detail_data_swagcustomproducts"}
    {* Custom products will be rendered elsewhere -- see detail/content/buy_container *}
{/block}

As mentioned in the comment, we override a block from the Custom Products plugin here to prevent the Custom Products options from being rendered where it actually happens -- above the variants.

Next, we need to put them in the right place. To do this, add the following block to buy_container.tpl:

{* Show custom products after variants but before quantity box *}
{block name="frontend_detail_index_buybox"}
    {if !$customProductsIsEmotionAdvancedQuickView}
            {include file="frontend/swag_custom_products/detail/wrapper.tpl"}
    {/if}

    {$smarty.block.parent}
{/block}

Now just save everything, clear template cache and you should see the desired result on the corresponding product pages!


Basics for creating a Shopware Theme

To create a Shopware Theme you need a Shopware Shop and a server with Shopware 5 (or even Shopware 6) installation. If you want to work on your theme locally first, get the server environment MAMP. With Shopware 5 there is already a bare theme, which contains important files that are used as the basis of each theme - this can be found in the folder themes . If you want to create a new theme, go to the backend of Shopware on the Theme Manager. Now go to Create Theme and fill in all fields like name, short description, license and author and save the whole thing. With the command Assign you can assign the theme to a store.

The first step to create your theme is done. If you need more information about creating an online store with Shopware, please visit our website. If you have any further questions, we at EXWE will be happy to assist you as a professional Shopware agency and offer you support from the creation of your online store to monthly support and monitoring. Feel free to contact us!

 

Was ist dein Projekt? Wenn du uns darüber erzählen möchtest, rufen wir dich zurück!

 
Meike
Meike
from 17.01.2020

Hello, my name is Meike. I take care of the EXWE back office and am responsible for our social media channels. All of our articles are meant to make your life easier and help you make decisions. Nevertheless, it can happen that something remains unclear, so: If you have questions about this article you can easily reach me at +49 231 93149827.

Du möchtest immer am Zenit der Technik bleiben? Keine News und Blogbeiträge mehr verpassen.
We also have the following interesting posts from our tech blog for you on this topic
This is what has changed in Shopware 6 since the last update!

Learn about the improvements and new features from Shopware 6.0 to Shopware 6.4.1.0 and stay up to date on the topic of online store creation.

How to create invoice corrections for shopware 5 without overwrites!

Our tip for Shopware invoices: Create an invoice correction without overwriting! Optimize processes in your online store quickly and easily.

Our HubSpot plugin - hand in hand with Shopware - bundle the data of your store

Use our Shopware plugin between Shopware and the Hubspot universe now and benefit from easy and bundled data collection!