main.js
file. It has to be placed into a <plugin root>/src/Resources/app/administration/src
directory in order to be found by Shopware 6. So please use the file accordingly and refer to the plugin base guide for more details.sw_product_detail_content_tabs
, which seems to contain all available tabs. It starts by creating a new <sw-tabs>
element to contain all the tabs available. Here you can see excerpt of this block:<sw-tabs>
element. Instead, you can choose the last available block inside the element, which is sw_product_detail_content_tabs_reviews
at this moment.sw_product_detail_content_tabs_reviews
.<plugin root>/src/Resources/app/administration/src/page/sw-product-detail
index.js
, which then contains the following code:sw-product-detail
component with a new template. The new template does not exist yet though, so create a new file sw-product-detail.html.twig
in the same directory as your index.js
file. It then has to use the block we figured out earlier and override it by adding a new tab element:sw-tabs-item
element, which, as the name suggests, represents a new tab item. We want this tab to have a custom route, so we're also adding this route directly. Don't worry, we'll explain this custom route in a bit. The product detail page's route contain the product's ID, which you also want to have in your custom tab: So make sure to also pass the ID in, like shown in the example above.sw.product.detail.custom
, this will become important again later on.main.js
file. And that's also the file you need to adjust now, so it loads your sw-product-detail
override.main.js
should look like in order to load your override:main.js
.routeMiddleware
of a module. It gets called for each and every route that is called in the administration. Once the sw.product.detail
route is called, you want to add your new child route to it.main.js
file, which could then look like this:routeMiddleware
method. In there, you're listening for the current route, that got called. If the current route matches sw.product.detail
, you want to add your new child route to it, and that's what's done here./sw/product/detail/:id/base
Just replace the base
here with custom
or anything you like.view/sw-product-detail-custom
view/sw-product-detail-custom
, so create this directory in your plugin now. The directory structure inside of your administration directory should then look like this:index.js
, create such a new file in the sw-product-detail-custom
directory:sw-product-detail-custom.html.twig
next to your index.js
file.