Mobile Navbar Appearance

This topic contains 9 replies, has 3 voices, and was last updated by  Manathan 2 months, 1 week ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #12534

    sercan
    Participant
    • 8 Posts
    @sercancs

    Hi,
    I want to customize the menu in the mobile view. In my theme the menu looks like the white picture: the whole menu items are seperately listed. I would like to make it look like on the black picture:
    1. I want the demo part to have a seperate opening menu (when the user clicks on the demo it should open profile menu items like friends, create a group etc., when demo item is not clicked the menu should collapse back )
    2. I want the 4 buddypress icons (my friends, notifications, messages etc.) to be centralized like in the black menu
    3. Also like in the black picture I want only the menu items to be seen in the first place (their child menus should only open if the parent menu is clicked)

    I am using the menu apperence shown on the third picture with the blue arrow, I dont want it to change to the menu shown with the red circle. I just want the menu on the mobile version to look like the menu on the black picture.
    If there is a custom css for this I would like to learn it.

    Thank you,
    Sercan Cosar

    #12542

    Olivier
    Moderator
    • 1758 Posts
    @themosaurusrex
    Themosaurus Support

    Hi @sercancs,

    It’s best if we take a quick look at this so we see what exactly can be achieve with our theme without extra customization.

    Could you create a new website user for us please? If possible with administrator capabilities so we can make a quick check of your settings.
    You can post the user name and password in your next reply and mark it as private to keep this between us.

    Thank you.

    #12549

    sercan
    Participant
    • 8 Posts
    @sercancs
    This reply has been marked as private.
    #12551

    sercan
    Participant
    • 8 Posts
    @sercancs
    This reply has been marked as private.
    #12557

    Olivier
    Moderator
    • 1758 Posts
    @themosaurusrex
    Themosaurus Support

    @sercancs, thank you for bring these issues to our attention. We’re glad to answer any question related with the setup of our theme.

    However, it very difficult for us to provide the best support possible and to keep track of issues and their resolution if you so many questions in the same topic.
    Moreover, it’s easier for us to share the resolution for a single issue with other members of our community facing the same problem.

    So, could you move your other questions into different topics?
    By doing this, you will be making a great contribution to this forum, and we thank you very much for that! 🙂

    #12558

    Olivier
    Moderator
    • 1758 Posts
    @themosaurusrex
    Themosaurus Support

    After a closer look to your menus and our demos, it appears to be standard design with our theme, I’m afraid.

    As this is not breaking the website in any way, editing new code for this is considered customization work.

    We only share snippet only to solve issues with our theme. Any further request for CSS snippets will have to be part of a defect that needs to be fixed urgently. No snippets will be shared otherwise.

    If you want to go further with the customization of your website, we advise that you require customization work.

    If you’re on a tight budget, we recommend you to require the services from Envato Studio freelancers (https://studio.envato.com/explore/websites-programming). This web platform gives you access to developers who have already experience with theme customizations, and for very competitive prices.

    However, I do understand that this feature seems more natural to you and we could bring some improvements to it. 🙂

    In consequence, I took the liberty to move this topic to our Feature Requests forum. As your idea could be a nice addition to our theme, we will implement this feature if other community members upvote your request.

    We’ll keep you informed. Thank you very much for contributing to this theme!

    Best,

    #13558

    sercan
    Participant
    • 8 Posts
    @sercancs

    hello,
    i thought for a while and i am thinking of coding what i want. the only problem is that the header.php file takes the sections I need, takes from your plugins.
    for example this code;

    <?php
    		/**
    		 * Functions hooked into gwangi_header action
    		 *
    		 * @hooked gwangi_header                  - 10
    		 * @hooked gwangi_grimlock_header         - 10
    		 * @hooked gwangi_grimlock_before_content - 20
    		 */
    		do_action( 'gwangi_header' ); ?>

    I want to know which plugin file has this code down below. so I can edit the after you tell me.

    <nav id="navigation" class="navbar-expand-lg grimlock-navigation site-navigation main-navigation grimlock-navbar navbar navbar--classic-center navbar--container-classic">
    			<div class="navbar__container">
    				<div class="navbar__header">
    					        <button class="navbar-toggler collapsed" type="button" data-toggle="collapse" data-target="#navigation-collapse" aria-controls="navigation-collapse" aria-expanded="false" aria-label="Toggle navigation">
                <span></span>
            </button>

    Thank you

    #13615

    Olivier
    Moderator
    • 1758 Posts
    @themosaurusrex
    Themosaurus Support

    @sercancs The component responsible for handling the Navigation is a PHP class called Grimlock_Navbar_Component. It can be found in wp-content/plugins/grimlock/inc/component/class-grimlock-navbar-component.php. You can extend this class in your custom plugin or your child theme to only override the methods that are generating the markups needing some changes.

    This class might also contain hooks used by template functions that you might simply remove to add your custom functions. You can find all our grimlock template hooks and functions in the following files:
    wp-content/plugins/grimlock/inc/grimlock-template-hooks.php
    wp-content/plugins/grimlock/inc/grimlock-template-functions.php

    Please also note that Grimlock_Navbar_Component is hooked by Grimlock_BuddyPress to add a new instance of Grimlock_BuddyPress_Navbar_Nav_Menu_Component, which controls the BuddyPress icons and can be found in wp-content/plugins/grimlock-buddypress/inc/component/class-grimlock-navbar-component.php.

    We have no tutorial on how to override a Grimlock component but you might be interested in giving a look to wp-content/themes/gwangi/inc/component/class-gwangi-grimlock.php to find out how the Grimlock_Post_Component class is removed from grimlock_post action while still being extended by Gwangi_Grimlock_Post_Component to change the printed post markups in Gwangi.

    I hope all these tips will help you achieve what you’re looking for. 🙂

    #13618

    sercan
    Participant
    • 8 Posts
    @sercancs

    thanks for your help Oliver 🙂

    #13633

    Manathan
    Keymaster
    • 415 Posts
    @themodactyl
    Themosaurus Support

    Hi @sercancs,

    I’m glad to read that @themosaurusrex has been able to help you!

    Cheers,

Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Mobile Navbar Appearance’ is closed to new replies.