feat: Enhance navigation by adding button styling to Contact menu item

This commit is contained in:
Matt Batchelder
2026-02-22 14:12:07 -05:00
parent c509444cd1
commit 2702ab41b5
3 changed files with 47 additions and 1 deletions

View File

@@ -364,6 +364,13 @@ p:last-child { margin-bottom: 0; }
.nav-menu a:hover::after,
.nav-menu .current-menu-item > a::after { width: 100%; }
/* Contact button in nav */
.nav-contact a.btn {
padding: .6rem 1.4rem;
font-size: .85rem;
}
.nav-contact a.btn::after { display: none; } /* Remove underline animation from button */
/* ── Dropdown sub-menu ─────────────────────────────────────── */
.nav-menu > li {
position: relative;

View File

@@ -705,7 +705,7 @@ function oribi_fallback_menu() {
echo '<li><a href="' . esc_url( home_url( '/pricing' ) ) . '">Pricing</a></li>';
echo '<li><a href="' . esc_url( home_url( '/partners' ) ) . '">Partners</a></li>';
echo '<li><a href="' . esc_url( home_url( '/about' ) ) . '">About</a></li>';
echo '<li><a href="' . esc_url( home_url( '/contact' ) ) . '">Contact</a></li>';
echo '<li class="nav-contact"><a href="' . esc_url( home_url( '/contact' ) ) . '" class="btn btn-primary">Contact</a></li>';
echo '</ul>';
}

View File

@@ -61,3 +61,42 @@ add_action( 'init', function () {
add_action( 'after_setup_theme', function () {
remove_theme_support( 'core-block-patterns' );
} );
/* ── Nav menu filters ──────────────────────────────────────── */
/**
* Add button class to Contact menu item for styling as an orange button.
*/
add_filter( 'nav_menu_link_attributes', function ( $atts, $item, $args ) {
// Only apply to the primary menu
if ( $args->theme_location !== 'primary' ) {
return $atts;
}
// Check if this is the Contact menu item (by URL or title)
$contact_url = home_url( '/contact' );
if ( strpos( $item->url, 'contact' ) !== false || $item->title === 'Contact' ) {
// Add button classes
$atts['class'] = isset( $atts['class'] ) ? $atts['class'] . ' btn btn-primary' : 'btn btn-primary';
}
return $atts;
}, 10, 3 );
/**
* Add nav-contact class to Contact menu item's list element.
*/
add_filter( 'nav_menu_li_attributes', function ( $atts, $item, $args, $depth ) {
// Only apply to the primary menu
if ( $args->theme_location !== 'primary' ) {
return $atts;
}
// Check if this is the Contact menu item (by URL or title)
if ( strpos( $item->url, 'contact' ) !== false || $item->title === 'Contact' ) {
// Add nav-contact class
$atts['class'] = isset( $atts['class'] ) ? $atts['class'] . ' nav-contact' : 'nav-contact';
}
return $atts;
}, 10, 4 );