Show Shopware Custom Products under variant selection
A big problem with the Shopware Custom Products plugin is that it does not allow you to set whether the variant selection should appear above or below the custom products options.
It often makes more sense for the user flow to first select a product variant and then make the extras or customizations. The necessary adjustments are also very limited, so we would like to give you a brief guide here:
Reading time 3 min
CUSTOMIZATION IN THE THEME
In your theme you have to overwrite two template files: frontend/detail/data.tpl
and frontend/detail/content/buy_container.tpl
If the files do not yet 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 business: Add the following block to data.tpl:
{* Custom products frontend hook *} {block name="frontend_detail_data_swagcustomproducts"} {* Custom products will be rendered elsewhere -- see detail/content/buy_container *} {/block}
As already mentioned in the comment, we overwrite a block from the Custom Products plugin here to prevent the custom products options from being rendered where it actually happens - namely above the variants.
Next, we need to put them in the right place. To do this, insert the following block in 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 the 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 first need a Shopware store and a server with Shopware 5 (or even Shopware 6) installed. If you want to work on your theme locally first, get the MAMP server environment. Shopware 5 already has a bare theme, which contains important files that are used as the basis for every theme - this can be found in the themes folder. If you want to create a new theme, go to the Theme Manager in the Shopware backend. Now go to Create theme and fill in all fields such as name, short description, license and author and save the whole thing. You can assign the theme to a store using the Assign command.
This completes the first step in creating your theme. 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, as a professional Shopware agency, are of course at your side and offer you support from online store creation to monthly support & monitoring. Feel free to contact us!
What is your project? If you want to tell us about it, we'll call you back!
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.
Our CSS hack with which you can map texts of any length on Shopware and avoid the problems of the plugin.
Would you like to carry out a Shopware 6 migration? We'll show you what to look out for and how to make the move a success.
Our solution to the problem - what you can do if the JTL Connector causes problems with Shopware.