- This topic has 13 replies, 3 voices, and was last updated 3 years, 8 months ago by David.
-
AuthorPosts
-
July 26, 2020 at 11:01 am #1377131Dong
Hi guys,
I follow this:
https://generatepress.com/forums/topic/add-date-on-navigation-bar/
and was able to put a date line on my Nav bar. How can I make the live share the same level as other menu items?
Specifically, I’d like to have the social icons to be on the right side of the text, on the same line.
Thanks,
-Dong.
July 26, 2020 at 12:33 pm #1377189TomLead DeveloperLead DeveloperHi there,
Instead of using the Secondary Navigation there, you may want to use the Top Bar widget area.
That way it will all be inline by default.
Let us know π
July 26, 2020 at 2:11 pm #1377255DongThanks, Tom. But I already use the Topbar for something else. Anyway to level the two within the Nav?
-Dong.
July 26, 2020 at 8:44 pm #1377416DongOK, Tom. I think I got that done with these CSS codes:
.main-nav {
list-style:none;
display:inline;}
.secondary-navigation ul {
display: inline;
}Hope that won’t break anything. π
July 27, 2020 at 8:57 am #1378203TomLead DeveloperLead DeveloperI don’t see any issue with that.
You could also do this:
.secondary-navigation .inside-navigation { display: flex; justify-content: center; align-items: center; }
July 27, 2020 at 9:50 am #1378260DongThanks, Tom. Your code is way better, I use that.
A bit off-topic but since I have you here: I was able to customize the research results using filters, but any way to make the post headlines of search result archives, too? I can do that with CSS or Layout Customization but affect the entire site.
Here’s an example of the search page, you’ll note the headlines are the same as those of all other archive pages:
https://dongknows.com/?s=aimesh
Thanks,
-Dong.
July 27, 2020 at 1:42 pm #1378507DongNevermind, Tom. I figure that out. π
July 27, 2020 at 3:23 pm #1378573TomLead DeveloperLead DeveloperGlad you got it sorted π
July 29, 2020 at 11:22 pm #1381375DongOne more question, Tom. It seems each time I move from one tab of the Man Nav to another (like from Home to Review, or How To etc), the secondary Nav changes its size briefly (where font awesome icons line up vertically) before it gets back to the expected size. That doesn’t happen consistently but most of the time. Is there any way to prevent that from happening?
Thanks,
-Dong
July 30, 2020 at 8:48 am #1382047TomLead DeveloperLead DeveloperThat’s just font icons loading, unfortunately. Try using SVG images instead π
July 30, 2020 at 10:35 am #1382135DongGot it! How do I add SVG so that the icon’s color will change according to the value of the menu item, the way the fonts do now?
July 30, 2020 at 2:01 pm #1382336TomLead DeveloperLead DeveloperThey should do it by default. If not, you can give the SVG elements this attribute:
style="color: currentColor;"
July 30, 2020 at 2:19 pm #1382350DongDo I treat them the way I normal images in regard to putting them on the menu? Or there’s a way to do that similar to Font Awesome?
July 31, 2020 at 1:23 am #1382663DavidStaffCustomer SupportHi there,
you can add them either using
<img>
HTML – but it won’t allow you to change the colors using CSS for example on hoverThe alternative is to open the SVG in a text editor / IDE or an app like this:
https://jakearchibald.github.io/svgomg/
And copy and paste the
<svg>
markup directly into the Menu Label. -
AuthorPosts
- You must be logged in to reply to this topic.