Customize "Enable extras on right side"

[lauraM]

I would like to display a phone number ONLY using "enable extras on right side"
But there are only 4 choices currently to choose from.
Pls help
Thank you

[Susan]

Laura - can you please post a link to your site (or let us know what theme you are using). Thanks!

[Jen Baumann]

This is a little more involved than you might think, but Bill Erickson has a nice tutorial on customizing this area.

[lauraM]

Sorry about that

http://dev.waileaspa.com/

I am using the Manhattan Theme

[lauraM]

I read the tutorial but not sure I understand what I just read.

Can you tell me what code I need to have the code render a phone number?

I no issue editing the code in the functions.php

[wpsmith]

Hello lauraM,

Try this in functions.php:


add_filter( 'genesis_nav_items', 'be_follow_icons', 25, 2 );
add_filter( 'wp_nav_menu_items', 'be_follow_icons', 25, 2 );
/**
* Follow Icons in Menu
* @author Travis Smith
* @author Bill Erickson
* @link http://www.billerickson.net/genesis-wordpress-nav-menu-content/
*
* @param string $menu HTML menu output.
* @param array $args Array of nav menu arguments.
* @return string HTML menu output.
*/
function be_follow_icons($menu, $args) {
$args = (array)$args;
if ( 'primary' !== $args['theme_location'] ) // Change this to the nav menu location
return $menu;
// Change this below. In case you do not know the text is written for translation.
// If you don't need translation, you can use this: $phone = '<li id="phone">Call us: 999-999-9999</li>';
$phone = '<li id="phone">' . __( 'Call us', 'child-domain' ) . ': 999-999-9999</li>';
return $menu . $phone;
}


---

Travis Smith | Recommended StudioPress Developer & Contributor
WP Smith | @wp_smith | GitHub

Due to the forums, please paste code using Pastebin, JS Fiddle (for JavaScript) or GitHub.
How to use Firebug for Designers by SixRevisions

[lauraM]

Thank you so much, the code did indeed solve one part of this issue.

The only other issue I have is the code renders everything just fine on my monitor, however when I switch over to an Iphone or ipad it does not carry the CSS define in the style.css file I have set up.

The CSS I set up was:

#nav li.phone {

padding-top: 7px;
padding-left:50px;
color: #cc9966;
font-size: 20px;}

Like I said it looks great on my monitor but take a look on an iphone and you will see it has dropped and is not in-line with the nav bar and also included a vertical line not shown on the monitor as well.

Any ideas??

[Author]

Posts