Site logo

Archived topic

Hook a Menu

9 replies · Started by Rafael on February 2, 2021

Viewing posts 1–10 of 10

Hi,

I created a Menu, that I can display in the footer using the Footer Bar widget.

But I only want to display it on a specific page.

What would be the PHP code to Hook to (generate_after_footer_content) a specific Menu?

Hi Rafael,

Are you using a hook element to add the menu into the footer?

If so you won't need php, you could set the specific page you want it to be displayed in Location tab of the hook element.

Let me know :)

Ying,

I do not know the code to add to the hook to display a menu.

Do you know the code?

You can use wp_nav_menu().
https://developer.wordpress.org/reference/functions/wp_nav_menu/

Example:

add_action('generate_after_footer_content',function(){
wp_nav_menu( array(
    'menu' => 'Your Menu Name'
) );
});

Alternatively, as Ying mentioned, you can use this code on a Hook Element:

<?php wp_nav_menu( array(
    'menu' => 'Your Menu Name'
) ); ?>

You then set the hook element's hook to generate_after_footer_content, check "Execute PHP" and set the display rule location to the pages you want this code to run.

I wrapped the php code in a DIV for styling.

/* Footer Menu */
.bottomMenu ul { display:inline; float:center;}
.bottomMenu li { list-style-type: none; display: inline; font-size: 16px; }
.bottomMenu li a {
	color:#fff;
	line-height:15px;
	text-decoration:none;
	font-weight:normal;
	border-right: thin solid #fff;
	padding: 0 7px 0 3px;
}
.bottomMenu li a:hover { color:#ccc; text-decoration:underline;}
.bottomMenu li:last-child > a {border-right: none;}
/* END- Footer Menu */

How do I Center the Nav Menu and add some top and bottom padding?

How do I Center the Nav Menu and add some top and bottom padding?

Add this CSS:

.bottomMenu {
    text-align: center;
    padding: 20px 0;
}

Nice. Close Ticket

Thank you

I've rechecked the site and I don't see the CSS being applied to it. Perhaps it wasn't saved?

Here's what the site's footer menu would look when the CSS is applied:
https://share.getcloudapp.com/wbu9JO5d

Elvin,

It was a closing tag, I added one and it worked.

Close Ticket and THANKS

Nice catch! Glad you got it to work. No problem. :)

This archived topic is closed to new replies.