-
Posts
-
Hi guys,
I needed to add a phone number to the main nav so I added a widget area to the header on functions.php. It looks good but I have a shrinking header and i’d like the text to align with the shrinking header along with the rest of the elements. Could someone help with this? :)
why don’t you add the phone-number as custom-link to your menu-items.
Dashboard – Appearance – Menus.
Just add a custom-link to your menu and insert .
As Link you put in your: tel:+490654311234567
As Navigation Label what you like f.e. Telephone 06543 – 11234567I would but then the telephone number would appear inside of the burger nav.
I’d like for the number to appear in the header next to the search icon and the header widget allows me to achieve this. Now just tryign to figure out how to get it to move and adjust with the shrinking nav!
the burger nav is not identical to the main-nav. Look to your DOM with some Developer Tools of your browser:
click to enlarge:
this is what happens if you have the hamburger opended.
that hamburger icon and the search icons are part of the main-nav. (b) an are still visible.
the rest fo main-nav is set to display none and the hamburger-menu is now visible.
You see that the list-items are different and have different selectors.
so you can select specific your telefonnumber not to show here: f.e.#av-burger-menu-ul li.menu-item-30288 { display: none }if you look closely, you will see that with the new enfold (don’t know how long it is now) the main menu items have IDs and the analog hamburger menu items then have the appropriate class.
may i see your header now? A screenshot would be ok.
by the way there is a hook to the main navigation to insert different things – if you add another list item point.- with this in child-theme functions.php
add_filter( 'wp_nav_menu_items', 'avia_append_main_nav_item', 10, 2 ); function avia_append_main_nav_item ( $items, $args ) { if ((is_object($args) && $args->theme_location == 'avia') || (is_string($args) && $args = "fallback_menu")){ $items .= '<li id="telephone_number" class="noMobile menu-item menu-item-avia-special"> <a href="tel:+49221123456">0221 / 123456</a> </li>'; } return $items; }you will have a phone number which is visible on opend hamburger but on top next to search icon and hamburger icon.
if you insert it without the class: menu-item-avia-special then it is hidden on opend hamburger
- You must be logged in to reply to this topic.