Magento2: Ubah urutan Tab pada Halaman Produk


15

Saya mencoba mengubah urutan tab pada halaman produk di Magento 2. Default-nya adalah Details|More Information|Reviews.

Saya mencoba:

Penjual / tema / Magento_Catalog / tata letak / catalog_product_view.xml

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="product.info.description" destination="product.info.details" after="-" />
    </body>
</page>

Tapi itu tidak berhasil, dan itulah cara yang disarankan untuk memindahkan elemen. Saya dapat memindahkan tab keluar dari area tab dan ke area lain, serta menambahkan tab baru, tetapi saya tidak dapat mengontrol urutan tab.

Dugaan saya adalah bahwa itu ada hubungannya dengan group="detailed_info"; Sepertinya Magento mengambil elemen tata letak dengan atribut ini di XML dan melewatinya untuk membuat tab.

Apakah ada cara untuk mengubah urutan tab tanpa menulis ulang modul?


Apakah Anda menemukan jawaban untuk ini? Saya mempunyai masalah yang sama.
Alex

Saya belum punya jawaban, maaf.
andyjv

Saya mencoba menggunakan elemen bergerak dan sampai pada kesimpulan yang sama seperti Anda, mereka dapat dipindahkan di luar tab tetapi tidak dipesan di dalamnya.
Ben Crook

Itu bisa dilakukan dengan tata letak hanya dengan sedikit trik. Ditampilkan di sini: magento.stackexchange.com/questions/106412/...
skymeissner

@andyjv silakan temukan solusinya di sini, ini mungkin membantu Anda untuk mencapai output yang Anda inginkan. magento.stackexchange.com/a/242709/52244
Kanhaiya lal

Jawaban:


22

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.phtmldapat 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.phtmldi masa depan lagi.


Bagaimana cara kami menampilkan konten tab "Detail" di bagian bawah bagian bawah "Info selengkapnya"?
Jai

pertanyaan Anda tidak mengacu pada pertanyaan awal. Anda harus membuka tiket baru. Pokoknya: Anda bisa merujuk ke file phtml baru di catalog_product_view.xml tema Anda (misalnya deskripsi-atribut-gabungan.phtml) dan menempelkan konten dari descrption.phtml asli dan atribut.phtml.
juhanix

Saya menempelkan konten kedua file dalam satu dan memanggil file xml sebagai: <referenceBlock name = "product.info.details"> <blok kelas = "Magento \ Katalog \ Blok \ Produk \ Lihat \ Deskripsi" name = "product.info .description.attributes "template =" produk / tampilan / deskripsi-atribut-gabungan.phtml "grup =" terperinci_info "> <arguments> <argumen translate =" true "name =" title "xsi: type =" string "> Lebih banyak Informasi </argument> </argument> </block> </referenceBlock> Tapi kosongkan situs dan hanya tampilkan konten tab. Apa yang hilang
Jai

Saya menambahkan pertanyaan di sini: magento.stackexchange.com/q/157376/29175
Jai

@juhanix Ini mengharuskan Anda untuk menarik templat yang dapat dimodifikasi di tambalan Magento nanti. Lihat jawaban saya yang tidak mengubah file inti apa pun. Semoga ini adalah masalah inti yang bisa ditambal.
LordZardeck

14

Untuk Ubah posisi Tabbing di halaman detail, Menggunakan file konfigurasi XML setelah atau sebelum atribut tidak membantu dalam kasus ini.

Anda harus mengubah dari file templat.

Salin file details.phtml dari inti ke tema Anda,

app/design/frontend/Packagename/themename/Magento_Catalog/templates/product/view/details.phtml

Di dalam file ini, Anda dapat mengambil semua nama tab menggunakan, print_r ($ DetailedInfoGroup) Anda harus mendapatkan nilai seperti,

Array
(
    [0] => product.info.description
    [1] => product.attributes
    [2] => reviews.tab
)

Anda harus mengatur sesuai dengan kebutuhan Anda dalam array baru sebelum foreach dalam file,

<?php $newOrderTabbing = array('product.info.description',,'reviews.tab','product.attributes'); //custom add ?>,

tambahkan <?php foreach ($newOrderTab as $name):?>,

Kode lengkap di details.phtml seperti di bawah ini,

<?php
/**
 * Copyright © 2016 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */

// @codingStandardsIgnoreFile

?>
<?php if ($detailedInfoGroup = $block->getGroupChildNames('detailed_info', 'getChildHtml')):?>
    <?php $newOrderTabbing = array('product.info.description','reviews.tab','product.attributes'); //custom added position ?>
    <div class="product info detailed">
        <?php $layout = $block->getLayout(); ?>
        <div class="product data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
            <?php foreach ($newOrderTabbing as $name): //custom arrayname?>
                <?php
                    $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; ?>

Terima kasih Rakesh Jesadiya, Ini berfungsi seperti pesona ...!
Sarfaraj Sipai

13

Di Magento 2.3.1 atau Di Atas, kita bisa menggunakan sort_orderargumen di " app/design/frontend/Packagename/themename/Magento_Catalog/layout/catalog_product_view.xml" konfigurasi xml

<referenceBlock name="product.info.description">
    <arguments>
        <argument name="title" translate="true" xsi:type="string">Description</argument>
        <argument name="sort_order" xsi:type="string">20</argument>
    </arguments>
</referenceBlock>

Pastikan juga untuk memperbarui metode " getGroupChildNames" dengan " getGroupSortedChildNames" dalam file templat ( Jika Anda menimpanya ) " app/design/frontend/Packagename/themename/Magento_Catalog/templates/product/view/details.phtml".

Metode lama

<?php if ($detailedInfoGroup = $block->getGroupChildNames('detailed_info', 'getChildHtml')):?>

Metode yang Diperbarui

<?php if ($detailedInfoGroup = $block->getGroupSortedChildNames('detailed_info', 'getChildHtml')):?>

Jika Anda mengganti Magento\Catalog\Block\Product\View\Details.phpkelas blok maka kelas blok Anda harus memiliki metode yang " getGroupSortedChildNames" diperbarui juga.


1
Ini jelas jawaban yang tepat dari 2.3.1 dan seterusnya.
Geat

Ini bekerja untuk saya di 2.3.2, terima kasih banyak!
Jared Chu

3

Cara lain menggunakan argumen urutan sortir.

Jalur File - app\design\frontend\<companyNAme>\<ThemeName>\Magento_Catalog\layout\catalog_product_view.xml

Tambahkan argumen urutan pengurutan di dalam wadah blok referensi product.info.detail.

Kode contoh

<block class="Magento\Catalog\Block\Product\View" name="shipping_tab" template="Magento_Catalog::product/view/shipping.phtml" group="detailed_info" >
    <arguments>
    <argument translate="true" name="title" xsi:type="string">Shipping</argument>
    <argument name="sort_order" xsi:type="string">10</argument>
    </arguments>
</block>

Ubah nilai argumen urutan sortir menjadi 10, 20, 30 sesuai pesanan Anda.


1
jawaban sempurna dengan contoh sort_orderpenting bagi saya, +1 membuat hari saya :)
SagarPPanchal

2

Saya tahu bahwa ada jawaban lain untuk pertanyaan ini, tetapi semuanya terlalu invasif untuk selera saya. Melihat masalah ini, Magento menambahkan atribut "grup" terpisah ke sebuah elemen dan menambahkan anak-anak ke atribut itu dalam urutan yang dimuat dalam tata letak, benar-benar terpisah dari array anak-anak yang berisi array elemen yang diurutkan. Untuk memperbaikinya, saya menulis sebuah plugin sederhana yang memperbaiki penyortiran ketika mengambil anak-anak kelompok:

class Structure
{
    /**
     * Re-orders the array of group children based on the sort order defined on the parent's children
     *
     * @param \Magento\Framework\Data\Structure $subject
     * @param callable $proceed
     * @param $parentId
     * @param $groupName
     * @return array
     */
    function aroundGetGroupChildNames( \Magento\Framework\Data\Structure $subject, callable $proceed, $parentId, $groupName )
    {
        $sortedList = [];

        // Go ahead and get all the children
        $groupChildNames = $proceed( $parentId, $groupName );

        // If there was no group children, just leave early
        if (empty( $groupChildNames ))
        {
            return $groupChildNames;
        }

        // Go through the order of the parent's children and if it's in the list of group children aggregated above,
        // add it to our own list
        foreach ($subject->getElement( $parentId )['children'] as $childId => $childAlias)
        {
            if (!in_array( $childId, $groupChildNames ))
            {
                continue;
            }

            array_push( $sortedList, $childId );
        }

        return $sortedList;
    }
}

Ini sekarang akan memungkinkan Anda untuk memesan tab menggunakan standar beforedan afteratribut dalam tata letak XML seperti yang Anda harapkan, dan mungkin tidak perlu dimodifikasi pada tambalan Magento masa depan.


LordZardeck yang perkasa dan terhormat telah memberikan jawaban yang benar. Menambahkan begitu banyak logika ke templat, seperti yang dilakukan sebagian besar jawaban di atas, hanya meminta masalah saat memperbarui ke versi magento yang lebih baru.
Nathan Toombs

2

Saya pikir Anda hanya perlu menambahkannya sesuai urutan pilihan Anda. Bagi saya, saya menggunakan 4 tab dalam urutan ini:

  1. Detail
  2. Label Produk
  3. Tab Khusus 1
  4. Tab Ubahsuaian 2

Dalam modul khusus saya, saya membuat file tata letak ini: catalog_product_view.xml dengan konten ini:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="product.info.details">
            <block class="Magento\Catalog\Block\Product\View" name="tab.tags" template="Godogi_Utilities::catalog/product/tab_tags.phtml" group="detailed_info" >
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Product Tags</argument>
                </arguments>
            </block>
            <block class="Magento\Catalog\Block\Product\View" name="tab.custom.tab.one" template="Godogi_Utilities::catalog/product/custom_tab_1.phtml" group="detailed_info" >
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Custom Tab 1</argument>
                </arguments>
            </block>
            <block class="Magento\Catalog\Block\Product\View" name="tab.custom.tab.n" template="Godogi_Utilities::catalog/product/custom_tab_n.phtml" group="detailed_info" >
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Custom Tab N</argument>
                </arguments>
            </block>
        </referenceBlock>
    </body>
</page>

Anda dapat melihat bahwa saya telah menambahkan hanya 3 tab karena rincian tab sudah ada. Sebagai hasilnya, saya telah mendapatkan tab dalam urutan ini:

  1. Label Produk
  2. Tab Khusus 1
  3. Tab Ubahsuaian 2
  4. Detail

Yang bukan itu yang saya inginkan, sekarang solusi saya adalah menambahkan juga tab Details lagi, jadi file layout saya akan seperti ini:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="product.info.details">
            <block class="Magento\Catalog\Block\Product\View\Description" name="product.info.description" template="product/view/attribute.phtml" group="detailed_info">
                <arguments>
                    <argument name="at_call" xsi:type="string">getDescription</argument>
                    <argument name="at_code" xsi:type="string">description</argument>
                    <argument name="css_class" xsi:type="string">description</argument>
                    <argument name="at_label" xsi:type="string">none</argument>
                    <argument name="title" translate="true" xsi:type="string">Details</argument>
                </arguments>
            </block>
            <block class="Magento\Catalog\Block\Product\View" name="tab.tags" template="Godogi_Utilities::catalog/product/tab_tags.phtml" group="detailed_info" >
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Product Tags</argument>
                </arguments>
            </block>
            <block class="Magento\Catalog\Block\Product\View" name="tab.custom.tab.one" template="Godogi_Utilities::catalog/product/custom_tab_1.phtml" group="detailed_info" >
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Custom Tab 1</argument>
                </arguments>
            </block>
            <block class="Magento\Catalog\Block\Product\View" name="tab.custom.tab.n" template="Godogi_Utilities::catalog/product/custom_tab_n.phtml" group="detailed_info" >
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Custom Tab N</argument>
                </arguments>
            </block>
        </referenceBlock>
    </body>
</page>

Sekarang saya memiliki pesanan yang saya inginkan :) masukkan deskripsi gambar di sini


1

Cara termudah dan terbaik menurut saya adalah solusi LordZardeck dengan sebuah plugin. Setelah memperbarui vendor / module / etc / frontend / di.xml

    <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
            xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">

    ...

        <type name="Magento\Framework\Data\Structure">
            <plugin name="vendor_sort_tabs" type="Vendor\Module\Plugins\Structure" sortOrder="0"/>
        </type>

   ...

    </config>

semuanya bekerja seperti yang diinginkan.

Terima kasih @LordZardeck untuk kode bersihnya!


0

Inilah solusi yang saya gunakan. Ini akan menukar tab uraian dan atribut jika keduanya tersedia. Ini menggunakan tema Ultimo. Tapi Anda akan mengerti intinya. CIUMAN.

<?php 
$detailedInfoGroup = $block->getGroupChildNames('detailed_info', 'getChildHtml');

if ($detailedInfoGroup[0] == 'product.info.description' && $detailedInfoGroup[1] == 'product.attributes') {
    $detailedInfoGroup[0] = 'product.attributes';
    $detailedInfoGroup[1] = 'product.info.description';
}

// rest of the code to look through $detailedInfoGroup
?>

0

Solusi saya untuk masalah ini adalah dengan memodifikasi templat details.phtml sehingga mendapatkan blok anak-anak dari tata letak.

$blocks = $layout->getChildBlocks($block->getNameInLayout());

Dengan melakukannya dengan cara ini, ia menghormati perintah yang diberikan oleh pengubah setelah dan sebelum .

<?php
/**
 * Copyright © Magento, Inc. 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 $blocks = $layout->getChildBlocks($block->getNameInLayout());?>
        <div class="product data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
            <?php foreach($blocks as $alias=>$child_block):?>
                <?php if(in_array($child_block->getNameInLayout(),$detailedInfoGroup)):?>
                    <?php
                        $html = $child_block->toHtml();
                        if (!trim($html)) {
                            continue;
                        }       
                        $label = $child_block->getData('title');
                    ?>
                    <div class="data item title"
                         aria-labeledby="tab-label-<?= /* @escapeNotVerified */ $alias ?>-title"
                         data-role="collapsible" id="tab-label-<?= /* @escapeNotVerified */ $alias ?>">
                        <a class="data switch"
                           tabindex="-1"
                           data-toggle="switch"
                           href="#<?= /* @escapeNotVerified */ $alias ?>"
                           id="tab-label-<?= /* @escapeNotVerified */ $alias ?>-title">
                            <?= /* @escapeNotVerified */ $label ?>
                        </a>
                    </div>
                    <div class="data item content" id="<?= /* @escapeNotVerified */ $alias ?>" data-role="content">
                        <?= /* @escapeNotVerified */ $html ?>
                    </div>
                <?php endif; ?>
            <?php endforeach;?>
        </div>
    </div>
<?php endif; ?>

Saya masih menggunakan array yang disediakan oleh getGroupChildNames untuk memvalidasi jika blok milik grup.

if(in_array($child_block->getNameInLayout(),$detailedInfoGroup))


0

Saya tidak ingin mengerjakan tema, saya ingin memodifikasi perilaku metode 'getGroupChildNames'. Pendekatan ini harus bekerja bahkan jika templat dimodifikasi.

Saya menambahkan ini ke catalog_product_view.xml:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column"
  xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
  <body>
    <!-- CODE TO REORDER PRODUCT TABS -->
    <block class="Dsy\Ton\Block\Product\View\Description" name="product.info.details.new" template="Magento_Catalog::product/view/details.phtml">
        <!-- ADD MORE BOCKS IF NEEDED -->
    </block>
    <move element="product.info.details.new" destination="content" after="product.info.details"/> 

    <move element="product.info.description" destination="product.info.details.new" after="-"/>
    <move element="product.attributes" destination="product.info.details.new" after="-"/> 

    <referenceBlock name="product.info.details" remove="true"/>
    <!-- CODE TO REORDER PRODUCT TABS -->
  </body>

Lalu, buat blok untuk mengubah perilaku 'getGroupChildNames':

<?php

namespace My\Module\Block\Product\View;

use Magento\Catalog\Model\Product;

class Description extends \Magento\Catalog\Block\Product\View\Description
{
    public function getGroupChildNames($groupName)
    {
        if ('detailed_info' === $groupName) {
            return [
                // here you can change the order
                'product.attributes',
                'product.info.description',
            ];
        }

        return parent::getGroupChildNames($groupName);
    }
}

Itu saja.


0

LordZardeck memiliki jawaban terbaik, tetapi ini pada dasarnya adalah bug dan harus diperbaiki pada intinya.

Solusi paling sederhana untuk masalah yang saya temukan adalah sebagai berikut: Override the Magento_Catalog :: product / view / details.phtml template dan setelah kondisi php pertama pada baris 10:

if ($detailedInfoGroup = $block->getGroupChildNames(...

tambahkan kode berikut untuk mengubah urutan:

$_prepend = array_reverse(['product.overview.description']);
foreach ($_prepend as $_name) {
    $k = array_search($_name,$detailedInfoGroup);
    if ( $k !== false) {
        unset($detailedInfoGroup[$k]);
        array_unshift($detailedInfoGroup,$_name);
    }
}

ini akan mengubah urutan dan mendorong semua tab yang terdaftar dalam $ _tergantung pada awal array dalam urutan yang ditentukan.


0

Sepertinya semua hal di atas sudah tidak relevan lagi. Pada Magento 2.3.1 kita bisa menggunakan sort_orderargumen dalam konfigurasi xml.


0

Plugin adalah solusi yang bagus. Tetapi Anda masih bisa meningkatkannya. Anda tidak ingin menulis plugin yang berbeda setiap kali Anda perlu mengatur ulang tab. Yang ingin Anda lakukan adalah mengatur urutan dalam xml. Seperti ini:

<referenceBlock name="product.info.details">
        <referenceBlock name="product.info.description">
            <arguments>
                <argument name="priority" xsi:type="number">1</argument>
            </arguments>
        </referenceBlock>
        <referenceBlock name="product.attributes">
            <arguments>
                <argument name="priority" xsi:type="number">3</argument>
            </arguments>
        </referenceBlock>
        <referenceBlock name="reviews.tab">
            <arguments>
                <argument name="priority" xsi:type="number">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="number">2</argument>
            </arguments>
        </block>
        <!-- MY OWN CUSTOM BLOCK ENDS HERE -->
    </referenceBlock>

dan kemudian, alih-alih memodifikasi templat, buat sebuah plugin yang akan membuat Magento memahami priorityargumen yang digunakan dalam konfigurasi xml:

class TabOrder
{
    const TABS_BLOCK_NAME = 'product.info.details';
    const ORDER_ARGUMENT_NAME = 'priority';

    public function afterGetGroupChildNames(
        \Magento\Catalog\Block\Product\View\Description $subject,
        array $result
    ) {
        if ($subject->getNameInLayout() === self::TABS_BLOCK_NAME) {
            foreach ($result as $blockName) {
                // get priority for each block and include it in modifiedResult
                $alias = $subject->getLayout()->getElementAlias($blockName);

                // 100 default value guarantees the tab without priority argument goes last
                $blockPosition =
                    $subject->getChildData($alias, self::ORDER_ARGUMENT_NAME) ?? 100;
                $modifiedResult[] = array(
                    $blockName,
                    $blockPosition);
            }

            // order elements from $modifiedResult by priority
            usort($modifiedResult, function ($a, $b) {
                return $a[1] <=> $b[1];
            });

            // remove priority and leave original values only
            array_walk($modifiedResult, function (&$value, $key) {
                $value = $value[0];
            });

            return $modifiedResult;
        }

        return $result;
    }
}

Dan akhirnya plugin harus diterapkan ke Magento\Catalog\Block\Product\View\Descriptionkelas dalam file di.xml.


0

Untuk Magento 2 ubah urutan tab pada halaman produk.

Anda dapat dengan mudah menyesuaikan urutan tab dengan cara sederhana.

  1. Buat file details.phtml di

aplikasi / desain / antarmuka / vendor / tema / Magento_Catalog / template / produk / tampilan /

Jika file details.phtml sudah ada maka perbarui.

  1. Tambahkan kode ini sebelum foreach loop. Tentukan array "$ DetailedInfoGroup".

Kode asli:

<?php if ($detailedInfoGroup = $block->getGroupChildNames('detailed_info', 'getChildHtml')):?>
    <div class="product info detailed">
        <?php $layout = $block->getLayout(); ?>
        <div class="product data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
            <?php foreach ($detailedInfoGroup as $name):?>
                <?php
                    $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-<?= /* @escapeNotVerified */ $alias ?>-title"
                     data-role="collapsible" id="tab-label-<?= /* @escapeNotVerified */ $alias ?>">
                    <a class="data switch"
                       tabindex="-1"
                       data-toggle="switch"
                       href="#<?= /* @escapeNotVerified */ $alias ?>"
                       id="tab-label-<?= /* @escapeNotVerified */ $alias ?>-title">
                        <?= /* @escapeNotVerified */ $label ?>
                    </a>
                </div>
                <div class="data item content" id="<?= /* @escapeNotVerified */ $alias ?>" data-role="content">
                    <?= /* @escapeNotVerified */ $html ?>
                </div>
            <?php endforeach;?>
        </div>
    </div>
<?php endif; ?> 

Setelah menambahkan kode:

<?php if ($detailedInfoGroup = $block->getGroupChildNames('detailed_info', 'getChildHtml')):?>
    <div class="product info detailed">
        <?php $layout = $block->getLayout(); ?>
        <div class="product data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
            <?php $detailedInfoGroup = ["product.info.description", "product.attributes", "reviews.tab"]; ?>
            <?php foreach ($detailedInfoGroup as $name):?>
                <?php
                    $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-<?= /* @escapeNotVerified */ $alias ?>-title"
                     data-role="collapsible" id="tab-label-<?= /* @escapeNotVerified */ $alias ?>">
                    <a class="data switch"
                       tabindex="-1"
                       data-toggle="switch"
                       href="#<?= /* @escapeNotVerified */ $alias ?>"
                       id="tab-label-<?= /* @escapeNotVerified */ $alias ?>-title">
                        <?= /* @escapeNotVerified */ $label ?>
                    </a>
                </div>
                <div class="data item content" id="<?= /* @escapeNotVerified */ $alias ?>" data-role="content">
                    <?= /* @escapeNotVerified */ $html ?>
                </div>
            <?php endforeach;?>
        </div>
    </div>
<?php endif; ?>

Dan tambahkan tab kustom di halaman produk, periksa tautan ini

Magento 2 - Buat tab produk yang menampilkan atribut khusus

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.