-
Posts
-
Hello,
We would like to add this custom link to the top menu rather than standard menu links:
<p><span style=”color: #ff6600;”><span style=”color: #ff6600;”>CALL OUR STORE (859) 887-2552</span></span></p>Is there a way to do this within the themes menu admin or CSS?
Website = WildcatMattress.com
Thank you for your assistance.
Hey!
Try adding this at the very end of your theme functions.php file:
add_filter( 'wp_nav_menu_items', 'append_callus_func', 10, 2 ); function append_callus_func ( $items, $args ) { if ((is_object($args) && $args->theme_location == 'avia') || (is_string($args) && $args = "fallback_menu")) { $items .= '<li id="menu-item-callus"><p><span style=”color: #ff6600;”><span style=”color: #ff6600;”>CALL OUR STORE (859) 887-2552</span></span></p></li>'; } return $items; }Cheers!
JosueThank you for your reply. I placed the suggested code into functions.php as suggested. The item appeared above the Main menu and pushed the main menu into the logo.
We were hoping to add the Call Us… link into the top header, justified right side in full screen and below social links in mobile view.
I appreciate your efforts and any suggestions on how to achieve this is also greatly appreciated.
Kind Regards,
DannyHey Josue,
If you take a look at the top (sub-menu) at WildcatMattress.com, this is what we would like to achieve aesthetically full screen and mobile(when resized). The only difference is that instead of a menu item linking to a page we would like it to dial a phone number when a mobile user clicks on Call Us… using this href=”tel:8598872552″ .This is the html we used to achieve the same goal under the google map, also seen on the home page.
<p><span style=”color: #ff6600;”><span style=”color: #ff6600;”>CALL OUR STORE (859) 887-2552</span></span></p>
Thank you
Hey Josue,
Thank you. I displays the link and function, but doesn’t center the text under the social buttons on the mobile. On the full screen, it pushes the divider line between top bar and header area. Is there a way to resolve this spacing/padding/centering?
Thank you
Hey!
Try adding this code to the Quick CSS:
@media only screen and (max-width: 767px) { .phone-info { text-align: center !important; float: none !important; clear: both; } }Cheers!
JosueThanks Josue,
I tried this and the information did not center under the social links when checked from the mobile. Also the full screen version still pushes down the line just below the two between the top bar and header.Thank you very much for your help.
Hey!
Try with this code instead:
.phone-info p { margin: 0; } @media only screen and (max-width: 767px) { .phone-info { float: none !important; } .phone-info span{ margin: 0 auto !important; width: 200px !important; display: block !important; } }Regards,
JosueJosue,
Thank you. That fixed the issue with the line between the top bar and the phone number centers under the social icons when I resize the screen on my computer to the size of a phone’s screen. It doesn’t center on the phone, for some reason. I tried clearing the cache, browser and history. Any ideasComing along great.
Thank you very much for your help.
Hi!
The problem is that the dynamic stylesheet is getting cached by the browser, we fixed this in the latest version (2.9.1) of the theme. Try updating.
Cheers!
JosueThank you for your help. I need to review any changes that may be adversely affected by an update. But I will get back to you as soon as we give it a go.
Thanks.
-Danny
- You must be logged in to reply to this topic.