5

My theme is built on blank theme

I don't know, why all my account links are missing in mobile menu. Can anyone help me on this? Here are overrided default.xml

<page layout="3columns" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<update handle="default_head_blocks"/>
<body htmlClass="page">
    <block name="require.js" class="Magento\Framework\View\Element\Template" template="Magento_Theme::page/js/require_js.phtml" />
    <referenceContainer name="after.body.start">
        <block class="Magento\RequireJs\Block\Html\Head\Config" name="requirejs-config"/>
        <block class="Magento\Translation\Block\Html\Head\Config" name="translate-config"/>
        <block class="Magento\Translation\Block\Js" name="translate" template="Magento_Translation::translate.phtml"/>
        <block class="Magento\Framework\View\Element\Js\Cookie" name="js_cookies" template="Magento_Theme::js/cookie.phtml"/>
        <block class="Magento\Theme\Block\Html\Notices" name="global_notices" template="html/notices.phtml"/>
    </referenceContainer>
    <referenceBlock name="top.links">
        <block class="Magento\Theme\Block\Html\Header" name="header" as="header" before="-">
            <arguments>
                <argument name="show_part" xsi:type="string">welcome</argument>
            </arguments>
        </block>
        <referenceBlock name="wish-list-link" remove="true" /> 
        <referenceBlock name="compare-products-link" remove="true" /> 
    </referenceBlock>
    <referenceContainer name="main.content">
        <block class="Magento\Framework\View\Element\Template" name="skip_to_content.target" before="-" template="Magento_Theme::html/skiptarget.phtml">
            <arguments>
                <argument name="target_id" xsi:type="string">contentarea</argument>
            </arguments>
        </block>
    </referenceContainer>
    <referenceContainer name="header.container" >
        <container name="header.panel.wrapper" htmlClass="panel wrapper" htmlTag="div" before="-">
            <container name="header.panel" label="Page Header Panel" htmlTag="div" htmlClass="panel header">
                <block class="Magento\Framework\View\Element\Template" name="skip_to_content" template="Magento_Theme::html/skip.phtml">
                    <arguments>
                        <argument name="target" xsi:type="string">contentarea</argument>
                        <argument name="label" translate="true" xsi:type="string">Skip to Content</argument>
                    </arguments>
                </block>
                <!-- <block class="Magento\Store\Block\Switcher" name="store_language" as="store_language" template="switch/languages.phtml"/> -->
                <block class="Magento\Framework\View\Element\Html\Links" name="top.links">
                    <arguments>
                        <argument name="css_class" xsi:type="string">header links</argument>
                    </arguments>
                </block>
            </container>
        </container>
        <container name="header-wrapper" label="Page Header" as="header-wrapper" htmlTag="div" htmlClass="header content site-header-wrapper">
            <block class="Magento\Theme\Block\Html\Header\Logo" name="logo">
                <arguments>
                    <argument name="logo_img_width" xsi:type="number">189</argument>
                    <argument name="logo_img_height" xsi:type="number">64</argument>
                </arguments>
            </block>
        </container>
    </referenceContainer>
    <referenceContainer name="page.top">
        <block class="Magento\Framework\View\Element\Template" name="navigation.sections" before="-" template="Magento_Theme::html/sections.phtml">
            <arguments>
                <argument name="group_name" xsi:type="string">navigation-sections</argument>
                <argument name="group_css" xsi:type="string">nav-sections</argument>
            </arguments>
            <block class="Magento\Framework\View\Element\Template" name="store.menu" group="navigation-sections" template="Magento_Theme::html/container.phtml">
                <arguments>
                    <argument name="title" translate="true" xsi:type="string">選單</argument>
                </arguments>
                <block class="Magento\Theme\Block\Html\Topmenu" name="catalog.topnav" template="html/topmenu.phtml" ttl="3600" before="-"/>
            </block>
            <block class="Magento\Framework\View\Element\Text" name="store.links" group="navigation-sections">
                <arguments>
                    <argument name="title" translate="true" xsi:type="string">Account</argument>
                    <argument name="use_force" xsi:type="boolean">true</argument>
                    <argument name="text" xsi:type="string"><![CDATA[<!-- Account links -->]]></argument>
                </arguments>
                <arguments>
                    <argument name="title" translate="true" xsi:type="string">Settings</argument>
                </arguments>
                <block class="Magento\Store\Block\Switcher" name="store.settings.language" template="switch/languages.phtml">
                    <arguments>
                        <argument name="id_modifier" xsi:type="string">nav</argument>
                    </arguments>
                </block>
            </block>                  

My extended default.xml

<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>
                 <referenceBlock name="wish-list-link" remove="true" /> 
                <referenceBlock name="compare-products-link" remove="true" /> 
                <referenceBlock name="register-link" remove="true"/> 
                </block>
            </referenceContainer>
            <!--         <move element="register-link" destination="header.links"/> -->
            <!--         <move element="top.links" destination="customer"/> -->
            <!--         <move element="authorization-link" destination="top.links" after="-"/>   --> 
   <referenceBlock name="top.links">
        <referenceBlock name="register-link" remove="true" />           <!--for Create Account Link-->
        <referenceBlock name="wish-list-link" remove="true" />          <!--for WishList Link-->
   </referenceBlock>
    <move element="navigation.sections" destination="header-wrapper" after="logo"/>
    <move element="header.links" destination="header-wrapper" after="logo"/>        
    <!--        <referenceBlock name="top.links" remove="true"/> -->
    <referenceBlock name="store_language" remove="true"/>
    <referenceBlock name="header.panel" remove="true"/>

</body>

1
  • The submenu for the user account is presented with the "header.links". You moved this element to the "header-wrapper" element. Do you see the user account submenu in the mobile, when you comment out the line <move element="header.links" destination="header-wrapper" after="logo"/> in your default.xml file?
    – knospe
    Commented Jun 14, 2017 at 13:11

2 Answers 2

10

This happened to me when I made a custom theme.

I created a theme.js file in app/design/fontend/<CUSTOM_THEME>/default/web/js/ to use some library I added.

But I forgot to copy the code that where already there in the theme.js of the blank theme (/vendor/magento/theme-frontend-blank/web/js/theme.js).

Here is the JavaScript line which clones the links to the mobile menu :

    $('.panel.header > .header.links').clone().appendTo('#store\\.links');

Check if you have your own theme.js that could overwrite the default one.

If it doesn't work, check the mobile menu with the luma theme, and blank theme to be sure it works with default themes.

Edit for Magento 2.2+ :

Since Magento 2.2.0 (see commit), the theme.js file has been moved to /vendor/magento/theme-frontend-blank/Magento_Theme/web/js/theme.js.

6
  • This works for me when user is not logged in. However this breaks again after log in. Anything I am missing?
    – Sejal Shah
    Commented Nov 1, 2017 at 6:07
  • Did you move some header elements in your theme ? If you translated the welcome message when logged in, it may also break your JS if there is a quote. What happens exactly when it "breaks" ?
    – Cladiuss
    Commented Nov 2, 2017 at 8:48
  • It started working now. Seems like magic ;)
    – Sejal Shah
    Commented Nov 2, 2017 at 9:34
  • Thank you so much @Cladiuss Commented Apr 27, 2020 at 8:16
  • 1
    Actually, the file is located in /vendor/magento/theme-frontend-blank/Magento_Theme/web/js/theme.js just in case if anybody is wondering where the file is
    – zlep
    Commented May 5, 2021 at 13:17
1

If it helps anyone, I had a similar issue but it was because I'd moved the .header.links ul out of the .panel.header div. So, the code referenced in the theme.js file that @Cladiuss references above $('.panel.header > .header.links').clone().appendTo('#store\\.links'); wasn't firing. I copied the theme.js file to my custom theme, then changed the $('.panel.header > .header.links') to $('.[newparentdiv] > .header.links') and the account links started showing up again.

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.