- This topic has 8 replies, 2 voices, and was last updated 3 years, 11 months ago by Carsten.
-
AuthorPosts
-
April 24, 2020 at 12:07 pm #1254036Carsten
Hi there, now that my markup for the secondary-navigation is done, I need some styling advice.
I have been looking through all your styling suggestions, regarding buttons and Secondary Navigation, but they do not really fit to my site. I’m not sure about the button design yet, but I want the three links centered in one row, both on mobile and desktop.
1. Why do the links have button styling pr default, secondary nav customization color settings does not apply to these buttons?
2. How do I include the count in the button styling?
3. Is
grid-container sub-navigation grid-parent
the class I should use for styling?Here is my markup:
<div class="grid-container sub-navigation grid-parent"> <ul> <li id="messages-personal-li" > <a href="https://domain/members/me/messages/" id="user-messages" class="menu-item menu-item-type-post_type menu-item-object-post messages-personal-li button"> Beskeder <span class="count"></span> </a> <?php echo bp_get_total_unread_messages_count( bp_loggedin_user_id() );?> </li> <li id="visitors-personal-li"> <a href="https://domain/members/me/visitors/" id="user-visitors" class="menu-item menu-item-type-post_type menu-item-object-post messages-personal-li button" > Besøg <span class="count"></span> </a> <?php echo visitors_get_unique_visitors_count( bp_loggedin_user_id() ); ?> </li> <a class="button" href="https://domain/search">Søg</a> </ul> </div>
Thanks
April 24, 2020 at 4:43 pm #1254329TomLead DeveloperLead DeveloperHi there,
Where can I see that page? I’m not seeing it right now.
Let me know 🙂
April 24, 2020 at 5:00 pm #1254350CarstenSorry, a display rule was set, it should be possible to see it now.
otherwise try domain/start.One strange issue, only two of the three links are displayed on the frontpage and startpage, logged in or not, while all three are displayed on all other pages?
April 24, 2020 at 5:03 pm #1254353Carsten/* Passwords moved to admin */
April 25, 2020 at 9:11 am #1255240TomLead DeveloperLead DeveloperYou could do this:
.sub-navigation ul { display: flex; }
However, you’ll want to turn off the merged header or they won’t display.
For the counts to display in the button, move the code that generates the count into the
<span class="count"></span>
element like this:<span class="count"><?php echo bp_get_total_unread_messages_count( bp_loggedin_user_id() );?></span>
April 25, 2020 at 10:05 am #1255306Carstenwauw, thanks a lot we’re getting close now!
I haven’t decided yet for the secondary menu background color, or if it should have a color, the same with the buttons.
I like the gray color of the buttons, but instead of making the buttons full width, the right solution must be making the buttons background transparent and the nav menu background gray.
Apparently I can’t control these settings in the customizer, but will need som custom css ?
If yes, I can manage that.Next step is to reorder the header content.
This is the order I want:
Back button, widget added with shortcode in element (left),
Logo(center),
and Mobile Menu(right)
From what I remember, this is not done with a flex box?
Thanks
April 25, 2020 at 5:21 pm #1255721TomLead DeveloperLead DeveloperThe back button is inside the menu toggle, so it won’t work/can’t be moved around.
How are you adding it right now?
April 26, 2020 at 12:17 am #1255975CarstenRight now it is added by a shortcode inside a hook element.
I’m using Navigation as Header
April 26, 2020 at 1:53 am #1256042CarstenI skip the idea of having the back button in the navigation header, and place it in another place.
Thanks for looking into this
-
AuthorPosts
- You must be logged in to reply to this topic.