Magento2 : 제품 페이지에서 탭 순서 변경

16

Magento 2의 제품 페이지에서 탭 순서를 변경하려고합니다. 기본값은 Details|More Information|Reviews입니다.

나는 시도했다 :

공급 업체 / 테마 /Magento_Catalog/layout/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>

그러나 그것은 효과가 없으며 요소를 움직이는 데 권장되는 방법입니다. 탭을 탭 영역에서 다른 영역으로 이동하고 새 탭을 추가 할 수 있었지만 탭 순서를 제어 할 수 없습니다.

내 생각 엔 그것이 그것과 관련이 있다는 것입니다 group="detailed_info"; Magento는 XML에서이 속성을 사용하여 레이아웃 요소를 가져 와서 반복하여 탭을 만듭니다.

모듈을 다시 쓰지 않고 탭 순서를 변경하는 방법이 있습니까?

magento2  layout  template 
— 앤디
소스
이것에 대한 답을 찾았습니까? 같은 문제가 있습니다.
— Alex
아직 답변이 없습니다. 죄송합니다.
— andyjv
나는 move 요소를 사용해 보았고 당신과 같은 결론에 도달했습니다. 탭 바깥으로 이동할 수는 있지만 탭 내에서 주문할 수는 없습니다.
— 벤 크룩
약간의 트릭으로 만 레이아웃으로 수행 할 수 있습니다. 여기에 표시 : magento.stackexchange.com/questions/106412/…
— skymeissner
@andyjv 여기에서 해결책을 찾으십시오. 이것은 원하는 출력을 얻는 데 도움이 될 수 있습니다. magento.stackexchange.com/a/242709/52244
— Kanhaiya lal

답변:

22

나중에 새 탭을 추가하고 이러한 탭의 우선 순위 / 순서를 변경하는 경우 내 접근 방식은 조금 다르지만 향후 더 확실한 증거입니다.

테마 XML 파일에서 XML 파일을 통해 각 탭에 대한 인수를 전달했습니다.

...
<arguments>
    <argument name="priority" xsi:type="string">REPLACE WITH SOME NUMBER</argument>
</arguments>
...

내 테마 XML 파일은 다음과 같습니다.

<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>

더 많은 것을 조정해야 details.phtml하므로에서 복사하십시오.

<magento_root>/vendor/magento-catalog-view/frontend/templates/product/view/details.phtml

에

<magento_root>/app/design/frontend/<Vendor>/<theme>/Magento_Catalog/templates/product/view/details.phtml

마 젠토 자신의 것을 명심하십시오 details.phtmlMagento 는 향후 Magento 버전 또는 패치에서 변경 될 수 있습니다. 이러한 변경 사항은 테마의 주제에도 적용되어야합니다.details.phtml

이제 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; ?>

따라서 몇 줄만 추가하면 xml 파일을 통해 탭의 우선 순위 / 순서를 항상 변경할 수 있으므로 details.phtml나중에 더 이상 변경할 필요가 없습니다 .

— 주하 닉스
소스
'추가 정보'탭 하단에 '세부 정보'탭의 콘텐츠를 어떻게 표시 할 수 있습니까?
— Jai
귀하의 질문은 원래 질문을 언급하지 않습니다. 새 티켓을 열어야합니다. 어쨌든 : 테마의 catalog_product_view.xml (예 : description-attributes-combined.phtml)에서 새 phtml 파일을 참조하고 원래 descrption.phtml 및 attributes.phtml의 내용을 붙여 넣을 수 있습니다.
— juhanix
<referenceBlock name = "product.info.details"> <block class = "Magento \ Catalog \ Block \ Product \ View \ Description"name = "product.info와 같이 두 파일의 내용을 하나로 붙여넣고 xml 파일에서 호출했습니다. .description.attributes "template ="product / view / description-attributes-combined.phtml "group ="detailed_info "> <arguments> <argument translate ="true "name ="title "xsi : type ="string "> 더보기 정보 </ argument> </ arguments> </ block> </ referenceBlock> 그러나 빈 사이트이며 탭의 내용 만 표시합니다. 무엇이 빠졌습니까?
— Jai
여기에 질문을 추가했습니다 : magento.stackexchange.com/q/157376/29175
— Jai
@juhanix 이후 Magento 패치에서 수정 될 수있는 템플릿을 가져와야합니다. 핵심 파일을 수정하지 않는 내 대답을 참조하십시오. 다행스럽게도 이는 패치 될 수있는 핵심 문제입니다.
— LordZardeck
14

세부 사항 페이지에서 탭 위치 변경의 경우 속성 뒤 또는 앞에 XML 구성 파일 사용 이 도움이되지 않습니다.

템플릿 파일에서 변경해야합니다.

코어에서 테마로 details.phtml 파일을 복사하십시오.

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

이 파일 내에서 print_r ($ detailedInfoGroup) 을 사용하여 모든 탭 이름을 가져올 수 있습니다 .

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

파일에서 foreach하기 전에 새 배열에서 요구 사항에 따라 설정해야합니다.

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

더하다 <?php foreach ($newOrderTab as $name):?> ,

details.phtml의 전체 코드는 다음과 같습니다.

<?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; ?>
— 라 케시 예사 디야
소스
감사합니다 Rakesh Jesadiya, 그것은 매력처럼 작동합니다 ...!
— Sarfaraj Sipai
13

Magento 2.3.1 이상 sort_order에서는 " app/design/frontend/Packagename/themename/Magento_Catalog/layout/catalog_product_view.xml"xml config 에서 argument를 사용할 수 있습니다

<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>

또한 템플릿 파일에서 " getGroupChildNames"를 사용하여 " getGroupSortedChildNames" 메소드를 업데이트 하십시오 ( 재정의하는 경우 ) " app/design/frontend/Packagename/themename/Magento_Catalog/templates/product/view/details.phtml".

오래된 방법

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

업데이트 된 방법

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

Magento\Catalog\Block\Product\View\Details.php블록 클래스를 재정의하는 경우 블록 클래스에는 업데이트 된 메서드 " getGroupSortedChildNames"도 있어야 합니다.

— 나뎀
소스
1
이것은 2.3.1부터 정답입니다.
— Geat
그것은 2.3.2에서 저에게 효과적입니다. 많은 감사합니다!
— Jared Chu
3

나는이 질문에 대한 다른 대답들이 있었음을 알고 있지만 그것들 모두는 내 취향에 비해 너무 침략적이었다. 문제를 살펴보면 Magento는 요소에 별도의 "그룹"속성을 추가하고 정렬 된 요소 배열이 포함 된 자식 배열과 완전히 분리 된 레이아웃에로드 된 순서대로 해당 속성에 자식을 추가합니다. 이 문제를 해결하기 위해 그룹 어린이를 검색 할 때 정렬을 수정하는 간단한 around plugin을 작성했습니다.

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;
    }
}

이제 레이아웃 XML 의 표준 before및 after속성을 사용하여 탭을 주문할 수 있으며 향후 Magento 패치에서 수정하지 않아도됩니다.

— 로드 자덱
소스
강력하고 영광스러운 LordZardeck이 정답을주었습니다. 위의 답변 대부분이하는 것처럼 템플릿에 너무 많은 로직을 추가하면 최신 마 젠토 버전으로 업데이트 할 때 문제가 발생합니다.
— Nathan Toombs
내 Magento 2.2.4 상점에 이것을 사용했습니다.! 마술처럼 일했다!
— ishu
3

정렬 순서 인수를 사용하는 다른 방법.

파일 경로 - app\design\frontend\<companyNAme>\<ThemeName>\Magento_Catalog\layout\catalog_product_view.xml

product.info.details 참조 블록 컨테이너 안에 정렬 순서 인수를 추가하십시오.

예제 코드

<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>

주문에 따라 정렬 순서 인수 값을 10, 20, 30으로 변경하십시오.

— 라트 나
소스
1
예를 들어 완벽한 대답 sort_order은 나에게 중요했습니다. +1은 제 하루를 만들었습니다 :)
— SagarPPanchal
2

원하는 순서대로 추가해야한다고 생각합니다. 나를 위해 다음 순서로 4 개의 탭을 사용하고 있습니다.

  1. 세부
  2. 제품 태그
  3. 맞춤 탭 1
  4. 맞춤 탭 2

내 사용자 정의 모듈에서 다음 내용으로 다음 레이아웃 파일 catalog_product_view.xml을 작성했습니다.

<?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>

세부 정보 탭이 이미 있기 때문에 3 개의 탭만 추가 한 것을 알 수 있습니다. 결과적으로 다음 순서로 탭을 얻었습니다.

  1. 제품 태그
  2. 맞춤 탭 1
  3. 맞춤 탭 2
  4. 세부

내가 원하는 것이 아닌 것은 이제 이것에 대한 해결책은 세부 정보 탭을 다시 추가하는 것이므로 레이아웃 파일은 다음과 같습니다.

<?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>

이제 내가 원하는 순서가 있습니다 :) 여기에 이미지 설명을 입력하십시오

— 압델 케 비르 엘 할라 팔리
소스
1

가장 쉽고 가장 좋은 방법은 플러그인이있는 LordZardeck 의 솔루션입니다 . 공급 업체 / 모듈 /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>

모든 것이 원하는대로 작동했습니다.

깨끗한 코드에 대해 @LordZardeck에게 감사드립니다!

— GeorgeGos
소스
0

여기 내가 사용한 솔루션이 있습니다. 설명과 속성 탭이 모두 사용 가능한 경우 스왑됩니다. 이것은 Ultimo 테마를 사용하고 있습니다. 그러나 당신은 요점을 얻을 것입니다. 키스.

<?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
?>
— craigtadlock
소스
0

이 문제에 대한 나의 해결책은 템플릿 details.phtml 을 수정 하여 레이아웃에서 자식 블록을 얻는 것입니다.

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

이런 식으로 일을함으로써, 주어진 순서 존중 이후 와 이전 modificators을.

<?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; ?>

블록이 그룹에 속하는지 확인하기 위해 getGroupChildNames 에서 제공하는 배열을 계속 사용합니다 .

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

— 안토니오 알론소
소스
0

테마 작업을 원하지 않고 'getGroupChildNames'메서드 동작을 수정하고 싶었습니다. 이 방법은 템플릿이 수정 된 경우에도 작동합니다.

이것을 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>

그런 다음 '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);
    }
}

그게 다야.

— Amcastror
소스
0

LordZardeck이 최상의 답변을 제공하지만 이것은 기본적으로 버그이며 핵심에서 수정해야합니다.

내가 찾은 문제에 대한 가장 간단한 해결책은 다음과 같습니다. Magento_Catalog :: product / view / details.phtml 템플릿을 재정의하고 10 번째 줄의 첫 번째 PHP 조건 후에

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

순서를 수정하려면 다음 코드를 추가하십시오.

$_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);
    }
}

그러면 순서가 변경되고 $ _prepend 에 나열된 모든 탭이 정의 된 순서대로 배열의 시작 부분으로 푸시 됩니다.

— 수
소스
0

플러그인은 훌륭한 솔루션입니다. 그러나 여전히 향상시킬 수 있습니다. 탭을 다시 정렬해야 할 때마다 다른 플러그인을 작성하고 싶지 않습니다. 당신이하고 싶은 것은 XML로 순서를 설정하는 것입니다. 이처럼 :

<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>

그런 다음 템플릿을 수정하는 대신 Magento priority가 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;
    }
}

마지막으로 플러그인은 Magento\Catalog\Block\Product\View\Descriptiondi.xml 파일 의 클래스에 적용되어야 합니다.

— 크 르지 스토 프 워 코프 스키
소스
0

Magento 2의 경우 제품 페이지에서 탭 순서를 변경하십시오.

간단한 방법으로 탭 순서를 쉽게 사용자 지정할 수 있습니다.

  1. 에 details.phtml 파일 만들기

app / design / frontend / vendor / theme / Magento_Catalog / templates / product / view /

details.phtml 파일이 이미 존재하면 업데이트하십시오.

  1. foreach 루프 전에이 코드를 추가하십시오. "$ detailedInfoGroup"배열을 정의하십시오.

원본 코드 :

<?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; ?>

코드를 추가 한 후 :

<?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; ?>

제품 페이지에 맞춤 탭을 추가하십시오.이 링크를 확인하십시오.

마 젠토 2-사용자 정의 속성을 표시하는 제품 생성 탭

— 소헬 칸
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.