- This topic has 7 replies, 2 voices, and was last updated 3 years ago by Leo.
-
AuthorPosts
-
February 26, 2021 at 6:16 pm #1674472Randy
Nice to see several new names in the support expert staff! Welcome.
I have a perplexing problem. I have a number of sites under the umbrella of a flagship. The smaller sites have, in the Primary menu, a selection to move to the main web site.
Example: https://StellaAwards.com
On the right side of the primary menu bar, there’s a “a This is True project” selection.
The key is, it’s on the right side. I can’t remember if I learned that trick here or elsewhere, but it’s done with a little CSS: use Inspect to find the element number of that particular menu item, and then add to the stylesheet,
li#menu-item-1648 { float: right; }
But that’s not working on my latest site: https://what-its-like-to.com (still not launched, but “live”). It won’t move to the right. Even looking at Inspect it’s “calculated” to be flush-right, but as you can see it’s not. It uses the same method as the other sites, so I don’t understand why, especially when it works on every other site.
You’ll note this site uses Dispatch from the GP Site Library, but that’s not the difference: it was the same way in vanilla GP for this site also (i.e., before I applied Dispatch to the site). I even tried the hammer “!important”, but that didn’t do it either. I’d love to fix this before I launch. Thanks!
February 26, 2021 at 6:19 pm #1674473LeoStaffCustomer SupportHi there,
This one is using Float structure: https://stellaawards.com/
And this one is using Flexbox structure: https://what-its-like-to.com/
You can check under Customizer > General.
With Flexbox, try this method instead:
https://docs.generatepress.com/article/generate_menu_bar_items/February 26, 2021 at 6:37 pm #1674481Randy1) Dang you’re quick, Leo!
2) Huh. I didn’t set that purposefully. I’ll have to research that and see what it does. Resetting to Float doesn’t seem to have changed the layout or function — but it did of course fix the issue here. Glad to know I’m not crazy. Well, about that at least!
Thanks much.
February 26, 2021 at 9:33 pm #1674555LeoStaffCustomer SupportFlexbox is the default for new installs – it’s better π
The better solution would be to switch both sites to Flex and use the hook I mentioned above.
Or at least do that for the new site π
February 27, 2021 at 12:26 pm #1675378RandyAh, default: that’s why it was a “sudden” change (for me — my last new install was before v3).
Now that I’ve read about flexbox, I agree it’s better! I’ll convert the rest of the sites over the next few weeks. Tom had me at “lighter.” π
That said, I’m unclear specifically how to use the Hook element for this menu tweak:
<span class="menu-bar-item"> <a href="#">Your icon HTML</a> </span>
What exactly would I put in there for that specific menu item that’s currently correct (pre-flexbox) on the subject site?
February 27, 2021 at 1:22 pm #1675431LeoStaffCustomer SupportYou would replace
#
with the link for the button.And replace
Your icon HTML
with the actual text you want for the button.I would recommend taking a look at the video on the doc page.
February 27, 2021 at 6:10 pm #1675551RandyThanks, Leo, all set.
February 28, 2021 at 11:07 am #1676353LeoStaffCustomer SupportNo problem π
-
AuthorPosts
- You must be logged in to reply to this topic.