Pendekatan saya sedikit berbeda tetapi mungkin lebih banyak bukti di masa depan, jika menambahkan tab baru di kemudian hari dan mengubah prioritas / urutan tab ini.
Saya memberikan argumen untuk setiap tab melalui File XML di file XML tema saya
...
<arguments>
<argument name="priority" xsi:type="string">REPLACE WITH SOME NUMBER</argument>
</arguments>
...
Jadi file XML tema saya terlihat seperti ini:
<referenceBlock name="product.info.details">
<referenceBlock name="product.info.description">
<arguments>
<argument name="priority" xsi:type="string">1</argument>
</arguments>
</referenceBlock>
<referenceBlock name="product.attributes">
<arguments>
<argument name="priority" xsi:type="string">3</argument>
</arguments>
</referenceBlock>
<referenceBlock name="reviews.tab">
<arguments>
<argument name="priority" xsi:type="string">4</argument>
</arguments>
</referenceBlock>
<!-- MY OWN CUSTOM BLOCK ON THE SECOND POSITION -->
<block class="Magento\Catalog\Block\Product\View\Description" name="product.features" as="features" template="product/view/features.phtml" group="detailed_info">
<arguments>
<argument translate="true" name="title" xsi:type="string">Features</argument>
<argument name="priority" xsi:type="string">2</argument>
</arguments>
</block>
<!-- MY OWN CUSTOM BLOCK ENDS HERE -->
</referenceBlock>
Lebih jauh lagi kita harus menyesuaikan details.phtml
, jadi salin dari
<magento_root>/vendor/magento-catalog-view/frontend/templates/product/view/details.phtml
untuk
<magento_root>/app/design/frontend/<Vendor>/<theme>/Magento_Catalog/templates/product/view/details.phtml
Harap diingat bahwa Magento sendiri details.phtml
dapat diubah di versi atau tambalan Magento yang akan datang. Perubahan ini juga harus diterapkan pada tema Andadetails.phtml
Kita sekarang perlu mendapatkan prioritas yang kami sampaikan melalui file XML.
<?php
/**
* Copyright © 2016 Magento. All rights reserved.
* See COPYING.txt for license details.
*/
// @codingStandardsIgnoreFile
?>
<?php if ($detailedInfoGroup = $block->getGroupChildNames('detailed_info', 'getChildHtml')):?>
<div class="product info detailed">
<?php $layout = $block->getLayout(); ?>
<?php
# We create a new array;
$newPriority = array();
# forEach the original $detailedInfoGroup Array;
foreach ($detailedInfoGroup as $name){
$alias = $layout->getElementAlias($name);
# Get the priority which we applied via xml file
# If no priority is applied via xml file then just set it to 10
$priority = $block->getChildData($alias,'priority') ? $block->getChildData($alias,'priority') : '10';
# variables pushed into new two-dimensional array
array_push($newPriority, array($name, $priority));
}
# Sort array by priority
usort($newPriority, function($a, $b) {
return $a['1'] <=> $b['1'];
});
?>
<div class="product data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
<?php
# Delete the original forEach statement
#foreach ($detailedInfoGroup as $name)
foreach ($newPriority as $name):?>
<?php
# rename $name[0] to $name because it's a two-dimensional array
# No further changes to this file, it works as explained
$name = $name[0];
$html = $layout->renderElement($name);
if (!trim($html)) {
continue;
}
$alias = $layout->getElementAlias($name);
$label = $block->getChildData($alias, 'title');
?>
<div class="data item title"
aria-labeledby="tab-label-<?php /* @escapeNotVerified */ echo $alias;?>-title"
data-role="collapsible" id="tab-label-<?php /* @escapeNotVerified */ echo $alias;?>">
<a class="data switch"
tabindex="-1"
data-toggle="switch"
href="#<?php /* @escapeNotVerified */ echo $alias; ?>"
id="tab-label-<?php /* @escapeNotVerified */ echo $alias;?>-title">
<?php /* @escapeNotVerified */ echo $label; ?>
</a>
</div>
<div class="data item content" id="<?php /* @escapeNotVerified */ echo $alias; ?>" data-role="content">
<?php /* @escapeNotVerified */ echo $html; ?>
</div>
<?php endforeach;?>
</div>
</div>
<?php endif; ?>
Jadi Anda lihat: Anda hanya perlu menambahkan beberapa baris dan selalu dapat mengubah prioritas / urutan tab melalui file xml, Anda tidak perlu mengubah details.phtml
di masa depan lagi.