- This topic has 15 replies, 5 voices, and was last updated 6 months ago by
Tom.
-
AuthorPosts
-
September 3, 2020 at 4:01 pm #1430014
makaouif
Hello
Please i want to move the logo to the corner as in the image attached screenshot (1) and i want to aline the menu as in image attached (2).https://drive.google.com/file/d/1TjvuuRLx6iScNJP2KEYsEZ94y1rlp8kX/view?usp=sharing
https://drive.google.com/file/d/1G1ZRzFIivSUCW7iByxorVKcTla5r514H/view?usp=sharingSeptember 3, 2020 at 5:33 pm #1430054Leo
StaffCustomer SupportHi there,
Can you start by setting the navigation location to float right?
https://docs.generatepress.com/article/navigation-location/Let me know π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 3, 2020 at 5:37 pm #1430059makaouif
done
but it move to the extreme right, you can checkSeptember 3, 2020 at 5:45 pm #1430065Leo
StaffCustomer SupportLooks like you’ve set the alignment to right.
Can you try location float right first?
Also I’m seeing a merged header element. Is that necessary?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 4, 2020 at 7:14 pm #1431374makaouif
Thank you for you answer Leo
i don’t think that i do it correctly (i dont know how to use filter) , but thats what i put in Customizing > Additional CSS
—————–
add_filter( ‘generate_navigation_location’,’tu_move_navigation’ );
function nav-float-right( $location )
{
return $location;
}
———————-
please adviceSeptember 4, 2020 at 7:23 pm #1431380Elvin
StaffCustomer SupportHi,
WordPress filters are PHP codes.
For them to work, you have to add them as such.
Here’s how to add PHP codes to your site.
How to add PHPLet us know how it goes.
A wise man once said:
"Have you cleared your cache?"September 5, 2020 at 3:02 am #1431632makaouif
Thank you Elvin
I already using a child theme, and i add the filter in functions.php.add_filter( 'generate_navigation_location','tu_move_navigation' ); function tu_move_navigation( $location ) { return $location; }
Where should i put nav-float-right
September 5, 2020 at 5:09 am #1431733David
StaffCustomer SupportHi there
you should not need that PHP Snippet.
1. Go to Customizer > Site Identity and display the Logo.
2. Go to Customizer > Layout > Header and select Navigation as Header.
3. Go to customizer > layout > Priamry Navigation and set the Alignment to Center.Let me know.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 5, 2020 at 6:27 am #1431800makaouif
Thank you David
The logo appear very small becouse it’s in the menu barwhat i want is to put it the zone as it appear in the photos attached.
https://drive.google.com/file/d/1TjvuuRLx6iScNJP2KEYsEZ94y1rlp8kX/view?usp=sharing
https://drive.google.com/file/d/11cNrKnDjcCWY8yYDY_D2FKs1fcxjSoc1/view?usp=sharingSeptember 5, 2020 at 7:10 am #1431846David
StaffCustomer SupportThe size of the logo inside a Navigation is controlled by the Menu Item Height in Customizer > Layout > Primary Navigation. Increase that size to 60px to see the difference.
If you want to increase the size of logo independent of the menu item height then add this CSS:
.navigation-branding img { height: 60px; }
But i recommend you do increase the Menu Item height as currently 27px is very small and Google will complain about Clickable Elements being too close together. We recommend 60px.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 5, 2020 at 11:28 am #1432232makaouif
Thank you David for your assistance and help
1) When i put to increase the size of logo independent of the menu item the height it drive the bottom line of the menu with the logo as in the image attached.navigation-branding img { height: 90px; }
2) and what i expected and i want is to increase the size of logo independent of the menu item height as in image here
3) iβm asking if the is possibility to put the margin-right & and padding of the logo (0) as in the image here
https://drive.google.com/file/d/1F4edt-LkVRpntkvlcwraMNufLAxKKAzW/view?usp=sharing
https://drive.google.com/file/d/1OYH_ejCtATM8z-a7r3zY4luW9HrfjuNK/view?usp=sharing
https://drive.google.com/file/d/1aL83x2EaAOik1hxMhv01IJF_X00QhSR-/view?usp=sharing
Regards
September 6, 2020 at 6:22 am #1432760David
StaffCustomer SupportTry adding this CSS to make the logo overlap the Nav and the header element:
.main-navigation .inside-navigation { max-width: 500px; position: relative; } .main-navigation .inside-navigation .navigation-branding img { position: absolute; left: 0; top: 0; height: 160px }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 6, 2020 at 8:54 am #1433004makaouif
Really Amazing WoW β€π
Thank you very much David
one last thing if possible? Can i put the logo (overlap the Nav RTL) because when i switch to Arabic it appear on the menu button as in this imagehttps://drive.google.com/file/d/1E5WW0c4hvN6UPEecczEwtqheZdOS7dxs/view?usp=sharing
September 6, 2020 at 1:39 pm #1433180Tom
Lead DeveloperLead DeveloperHi there,
Give this a shot:
.rtl .main-navigation .inside-navigation .navigation-branding img { left: auto; right: 10px; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentSeptember 6, 2020 at 5:24 pm #1433289makaouif
Thank you very much Tom
it function very well π π§‘ -
AuthorPosts
- You must be logged in to reply to this topic.