Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1353765

    Hello,

    I was talking to you in another thread and raised this issue. You replied with a solution and said if I had any other questions to raise a new thread.

    I want to alter the sub-menu with the categories below the slider in 3 ways:

    1) Can you tell me how I can rename it from “Menu” in mobile mode to say “Categories”?
    2) Also, I would like to left-align it when in mobile mode, but keep it centred in desktop mode?
    3) Lastly, can I change it to switch to mobile mode at 885px rather than what it lets me set it to? (trying to maximise the proper menu until it starts wrapping to two lines at 885px wide).

    You replied asking me to add the following to the functions.php:
    // additional custom scripts
    function ava_custom_script_mod() {
    ?>
    <script>
    (function($)
    {
    // replace fullwidth sub menu placeholder text
    $(".av-current-placeholder").text("Categories");
    })(jQuery);
    </script>
    <?php
    }
    add_action('wp_footer', 'ava_custom_script_mod');

    ===================================================================

    By functions.php I presume you mean: wp-content/themes/enfold/functions.php

    So I added it directly at the bottom and went to clear the wp-rocket cache but cannot login to the admin area with this code added. I just get an error at the admin area saying:
    There has been a critical error on this website. Please check your site admin email inbox for instructions.

    Learn more about troubleshooting WordPress.

    Logs indicate:
    [Wed Jun 01 13:52:09.363904 2022] [lsapi:error] [pid 1706026:tid 140660832917248] [client 81.xxx.xxx:0] [host http://www.mydomain.uk] Backend fatal error: PHP Parse error: syntax error, unexpected token “?” in /home/blah/domains/mydomain.uk/public_html/wp-content/themes/enfold/functions.php on line 851\n, referer: https://www.mydomain.uk/wp-admin/

    Thanks

    • This topic was modified 2 years, 6 months ago by Paul.
    • This topic was modified 2 years, 6 months ago by Paul.
    • This topic was modified 2 years, 6 months ago by Paul.
    #1353809

    Hi,

    Please ignore the script above, I copied it from the email and it was malformed. I found the post had the correct code:

    // additional custom scripts
    function ava_custom_script_mod() { 
    ?>
        <script>
        (function($)
        {
            // replace fullwidth sub menu placeholder text
            $(".av-current-placeholder").text("Categories");
        })(jQuery);
        </script>
    <?php
    }
    add_action('wp_footer', 'ava_custom_script_mod');

    ==================================================
    However, it’s still not left-aligned for the Mobile mode only?
    Also, it’s not changing the menu to mobile mode at 885px as I requested?

    Thanks.

    • This reply was modified 2 years, 6 months ago by Paul.
    • This reply was modified 2 years, 6 months ago by Paul.
    #1353872

    Hi,

    Thank you for the inquiry.

    2-3.) Try to use this css code to move the toggle to the left on mobile view and adjust its breakpoint to 885px.

    @media only screen and (max-width: 885px) {
        .responsive #top .av-switch-768 .av-menu-mobile-active .mobile_menu_toggle {
            display: block;
            float: left;
        }
    
        .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu {
            display: none;
        }
    }
    

    Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css, then purge the cache.

    Best regards,
    Ismael

    #1353917

    Hi,

    Thank you for that. It’s nearly all there but there is a slight issue…

    When clicking on the menu/categories link, one of the categories is appearing to the right of the menu button rather than below like the rest of the categories.

    I thought it might be because it didn’t all fit on screen but when scrolling up to give it enough space it still occurs.

    Also, please ignore that is says “menu” not “categories” until you click it, i think that’s a WP-Rocket issue so am checking with them on that.

    #1354087

    Hello? Is there any update please? Thanks.

    #1354096

    Hi,

    When clicking on the menu/categories link, one of the categories is appearing to the right of the menu button rather than below like the rest of the categories.

    Sorry about that. Please look for this code..

    
    .responsive #top .av-switch-768 .av-menu-mobile-active .mobile_menu_toggle {
        display: block;
        float: left;
    }
    

    .., then replace it with:

    .responsive #top .av-switch-768 .av-menu-mobile-active .mobile_menu_toggle {
        display: block;
        text-align: left;
    }

    This should prevent the first menu item from floating beside the menu toggle.

    Best regards,
    Ismael

    #1354102

    Hi,

    Okay, that’s fixed but there’s still an issue with the menu button.

    When you click it on the mobile you have to click it 3 times before the menu opens. When clicking it in the browser (re-sizing the browser width below the 768 pixels) the menu doesn’t work at all no matter the amount of times you click it.

    I removed the custom code from the functions.php file in case it was causing it but it’s still happening so something else is causing the menu not to open.

    Thanks.

    #1354104

    Hi,

    Actually scrap the above…. It’s WP-Rocket causing some issues so I’ll take it up with them.

    However, I have 2 last questions…

    1) It’s left-aligned on all pages but the “Blog” page, do I need additional CSS for that page?
    2) Do I need to re-add the code to the functions.php file each time I upgrade the theme? If so, is there a custom file I can put it in that will not be overridden?

    Thanks.

    #1354141

    Hi,
    I assume that you are not using a child theme, if you use a child theme then your child theme functions.php customizations will not be overwritten with each update. Read about using a Child Theme

    For your blog page please try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:

    @media only screen and (max-width: 885px) {
        .responsive #top .av-switch-990 .av-menu-mobile-active .mobile_menu_toggle {
            display: block;
            float: left;
        }
    
        .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu {
            display: none;
        }
    }

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    #1354217

    Hello,

    Okay this is still not working. I’ve done a lot of testing and this is where I’m up to:

    1) The Child theme is now installed and the text to change it from “Menu” to “Categories” is working, I have removed it whilst we get the other things worked out though to ensure it’s not that code causing any of the other issues I’m still facing. I would like to ask if the Child theme ever needs updating though or just the main theme now? Will it still alert me in the “Enfold > Theme Update” section and update the main theme or Child theme as that’s the active one?

    2) The original code to move the menu left is still not working on the Blog page and the code you gave me is almost identical to the original code for the other pages. I have tried both the original code and the latest code in both areas you advised and it’s just not working.

    3) The original code has an issue with the menu opening when you click it. It’s more obvious when you re-size a computer browser window down so it changes to the mobile menu and try clicking it with the mouse, it doesn’t do anything.

    This is not cache or my browsers as I have completely disabled WP-Rocket and put Cloudflare into development mode to bypass any caching. The browser is Firefox and a testing browser is set to delete all cookies, cache, history and everything each time I close the browser. I’ve tried all this and it’s still not working in the Blog section or clickable as described.

    Rather than going back and forth trying different code every 24 hours would it be possible for you to test the code you give me before giving it to me then we know it works?

    Thank you.

    #1354218

    Hi,

    Please accept my apologies, everything is working now. There is something majorly going wrong with WP-Rocket and/or Cloudflare as it was still caching even though these were disabled. I’ve managed to get it working now.

    Could you just tell me if the Child theme ever needs updating though or just the main theme?

    Also, will it still alert me in the “Enfold > Theme Update” about updates?

    Lastly, which theme will be updated when it does update? The main theme or the “Child theme” as that’s now the active one?

    Thanks for your help.

    #1354223

    Hi,
    Glad to hear that you have this sorted out, the child theme doesn’t update, only the parent theme.
    A notice will display in Enfold > Theme Update when an update is available.
    You can also use the Envato Market Plugin to receive alerts about updates, but it is not nessery.
    The child theme should be your activate theme, you should add your customizations to the child theme, the child theme uses the parent theme for the core files and functions in the background and applies it’s customizations over the parent theme. When the parent theme is updated, the updated core files and functions are available for the child theme to use with preference to the customizations.
    Unless there is anything else we can assist with on this issue, shall we close this then?

    Best regards,
    Mike

    #1354233

    Hi Mike,

    Yes this can be closed now, thanks for the help.

    #1354240

    Hi,
    Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Alter Sub Categories Menu’ is closed to new replies.