0

I'm following these steps but it's not working. Could you help me? What I need is a dropdown of my account when the person starts the session

when I place this code my session icon disappears, try to change the header.panel to my icon class but it doesn't work for me please help.

enter image description here enter image description here

enter image description here

I have to get close to this from my custom header

Step 1 - Add in my file <Magento_luma_theme_dir>/Magento_Theme/layout/default.xml

<referenceContainer name="header.panel">
    <block class="Magento\Framework\View\Element\Html\Links" name="header.links">
        <arguments>
            <argument name="css_class" xsi:type="string">header links</argument>
        </arguments>
    </block>
</referenceContainer>

Step 2 - <Magento_Customer_module_dir>/view/frontend/templates/account/customer.phtml

<?php if($block->customerLoggedIn()): ?>
    <li class="customer-welcome">
        <span class="customer-name"
              role="link"
              tabindex="0"
              data-mage-init='{"dropdown":{}}'
              data-toggle="dropdown"
              data-trigger-keypress-button="true"
              data-bind="scope: 'customer'">
            <span data-bind="text: customer().fullname"></span>
            <button type="button"
                    class="action switch"
                    tabindex="-1"
                    data-action="customer-menu-toggle">
                <span><?php /* @escapeNotVerified */ echo __('Change')?></span>
            </button>
        </span>
        <script type="text/x-magento-init">
        {
            "*": {
                "Magento_Ui/js/core/app": {
                    "components": {
                        "customer": {
                            "component": "Magento_Customer/js/view/customer"
                        }
                    }
                }
            }
        }
            </script>
            <?php if($block->getChildHtml()):?>
            <div class="customer-menu" data-target="dropdown">
                <?php echo $block->getChildHtml();?>
            </div>
            <?php endif; ?>
        </li>
    <?php endif; ?>

Step 3 app/design/frontend/Bss/default/Magento_Theme/layout/default.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>
        <referenceContainer name="header.panel">
            <block class="Magento\Framework\View\Element\Html\Links" name="header.links">
                <arguments>
                    <argument name="css_class" xsi:type="string">header links</argument>
                </arguments>
            </block>
        </referenceContainer>
    </body>
</page>

<?xml version="1.0"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="header.links">
            <block class="Magento\Customer\Block\Account\Customer" name="customer" template="Magento_Customer::account/customer.phtml" before="-"/>
            <block class="Magento\Customer\Block\Account\AuthorizationLink" name="authorization-link-login" template="Magento_Customer::account/link/authorization.phtml">
                <arguments>
                    <argument name="sortOrder" xsi:type="number">10</argument>
                </arguments>
            </block>
        </referenceBlock>
        <move element="header" destination="header.links" before="-"/>
        <move element="register-link" destination="header.links"/>
        <move element="top.links" destination="customer"/>
        <move element="authorization-link" destination="top.links" after="-"/>
    </body>
</page>

1 Answer 1

0

Hello,

Please do follow these steps to create the Drop-Down menu.

Create the template file: Phtml

<div class="customer-menu">
 <span class="action toggle"  data-mage-init='{"dropdown":{}}' data-toggle="dropdown" aria-haspopup="true">
     <span class="title"><?= __("Customer Menu"); ?></span>
 </span>
 <ul class="dropdown">
     <?= $block->getChildHtml() ?>
 </ul>
</div>

Calls the blockn in XML where you want to show:

 <block class="Magento\Framework\View\Element\Template" name="header-dropdown" template="Custom_Module::header-dropdown.phtml"/>

Add design if you need, into less file.

.customer-menu {
.lib-dropdown();

}

Move your links into dropdown with xml (example: my account link)

 <move element="my-account-link" destination="header-dropdown" />

Thanks, this will help you out:)

2
  • thank you, but I don't understand where to place those files. please help :/
    – MediEle
    Commented Jan 12, 2021 at 18:00
  • you can add this on you theme dir: where you want to add the dropdown menu, like where you want to add this dropdown you can just add this code on related module or theme dir: of the module! Commented Jan 12, 2021 at 18:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.