BuddyBoss Home – Web Support Forums Themes OneSocial theme Change Sidebar Styling

Tagged: , ,

Viewing 15 posts - 1 through 15 (of 16 total)
  • Question

    #66365
    @costyclan

    I would like to change colors / styling of sidebar menu mobile?
    Also, how can I change the menu items for profile on mobile menu? I want to simplify it without the headings/subheadings.
    Thank you

    Answers

    #66416
    @anve

    Hi @costyclan ,

    Please specify the changes that you are looking for in sidebar. Also please attach a screenshot of how you want to change the menu items on mobile.

    Regards
    Anve

    #67111
    @conscious-crafties

    Following this one 🙂

    #67161
    @costyclan

    I would like the sidebar menu on mob to just be black background with white text and only the first level menu items (wall, profile, notifications, messages, my contacts, follow, settings, media)
    screenshot attached shows it as it is now.

    Also, when using desktop version and minimising down so that mobile layout activates, the menu's do not open. They work on mobile but not desktop when screen size is reduced.

    #67177
    @anve

    HI @costyclan,

    Try adding following css in child theme custom css option.

    
    @media screen and (max-width:480px){
    #wpadminbar .ab-submenu > .menupop > a.ab-item {
      color: #fff !important;
    }
    div#wpadminbar ul,#mobile-right-panel {
      background-color: black !important;
    }
    #mobile-right-panel #menu-main li a {
      color: #fff!important;
    }
    }
    

    Regards
    Anve

    #67178
    @anve

    Hi @costyclan,

    I check on mozilla by resizing your website , at 480px , mobile layout activates . The left and right panels are working on click . Please see attached screenshot.

    Regards
    Anve

    #67567
    @costyclan

    perfect @anve, looks great and working for me now too.
    How can I change menu items in profile? I only want the main items (but don't want them highlighted in grey) just menu items as per desktop version (as per attached screenshot).

    #67665
    @anve

    Hi @costyclan,

    Please explain what changes you need to make in profile dropdown , it's not clear to me.

    Regards
    Anve

    #67786
    @costyclan

    Hi @anve, it's not the profile dropdown on desktop I'm trying to change but the profile menu on mobile. I want the same main items that show in desktop (screenshot 1) to show in mobile (screenshot 2) I don't want to see all the 2nd level menu items as I feel it's a little overwhelming.
    So mobile profile menu will be all black with white text and just these menu items;
    Wall
    Profile
    Notifications
    Messages
    My contacts
    Follow
    Settings
    Media

    Does that help explain it better?

    #67797
    @anve

    Hi @costyclan,

    Try adding following css in child theme custom css option.

    
    @media screen and (max-width:480px){
    #wpadminbar #wp-admin-bar-my-account-buddypress li .ab-sub-wrapper {
        display: none;
    }
    #wpadminbar #wp-admin-bar-my-account-buddypress li a {
        background-color: #000!important;
        color: #fff;
        cursor: pointer;
    }
    }
    

    Regards
    Anve

    #67798
    @costyclan

    thanks @anve, that has worked however there is just one more 2nd level menu item showing (Media>Photos). I use Rtmedia plugin. I just want to remove the ‘Photos' 2nd level menu and just have ‘Media”.

    #67815
    @anve

    Hi @costyclan,

    Try adding following css in child theme custom css option.

    
    @media screen and (max-width:480px){
    #wpadminbar #wp-admin-bar-my-account-default li .ab-sub-wrapper {
        display: none;
    }
    #wpadminbar #wp-admin-bar-my-account-default li a {
        background-color: #000;
        cursor: pointer;
    }
    }
    

    Regards
    Anve

    #69018
    @costyclan

    Hi @anve

    I'm still struggling to get the sidebar styled. Am I supposed to add all three lots of code you provided or just the final one? The final one on its own didn't change anything and returned the menu to default.
    I've attached a screenshot of exactly what else needs to be changed and this is the code I have added:

    @media screen and (max-width:480px){
    #wpadminbar #wp-admin-bar-my-account-buddypress li .ab-sub-wrapper {
    display: none;
    }
    #wpadminbar #wp-admin-bar-my-account-buddypress li a {
    background-color: #000;
    cursor: pointer;
    }
    }

    #69068
    @anve

    Hi @costyclan,

    Please check the styling again , changes have been made.

    Regards
    Anve

    #69080
    @costyclan

    Beautiful, thank you so much @anve.

Viewing 15 posts - 1 through 15 (of 16 total)
  • The question ‘Change Sidebar Styling’ is closed to new replies.