Community Forums › Forums › Archived Forums › General Discussion › Menu and other css???
Tagged: associate, nav menu, social icons
- This topic has 1 reply, 2 voices, and was last updated 11 years, 3 months ago by Tom.
-
AuthorPosts
-
October 6, 2013 at 3:24 am #65532complete noviceMember
Hello all,
My site is http://goo.gl/nfDuUC ? on the start of the menu the corners are rounded, yet at the end it is square and not quite right, how do I rectify this issue.
Also how can I add a line of text or a small social network list, which includes an rss feed to the top of the page similar to http://goo.gl/MHScI9
Any ideas? or other suggestions please. thank you
October 8, 2013 at 12:11 am #65799TomParticipantRe: your menus - they look just like in the plain Associate theme: rounded at the left of the first and right of the last, plain square blocks in between.
To add a string of social icons at the top of the page like your reference page, we will use a small bit of PHP to add a new menu area and a Genesis plugin from David Decker designed just for this purpose.
The PHP is adapted from a menu gists by Travis Smith, aka WPsmith. This is reasonably current but, of course, there may be other and better ways to achieve the same result.
First, code: add the following to the bottom of your functions.php file. This will add a new menu area called "Top Navigation Menu".
add_action( 'genesis_header', 'do_top_nav', 5 ); /** * Output Top Navigation */ function do_top_nav() { /** Do nothing if menu not supported */ if ( ! genesis_nav_menu_supported( 'top' ) ) return; /** If menu is assigned to theme location, output */ if ( has_nav_menu( 'top' ) ) { $args = array( 'theme_location' => 'top', 'container' => '', 'menu_class' => genesis_get_option( 'nav_superfish' ) ? 'menu genesis-nav-menu menu-top superfish' : 'menu genesis-nav-menu menu-top', 'echo' => 0, ); $nav = wp_nav_menu( $args ); /** Wrap nav menu with div and .wrap div if applied to #nav */ $nav_output = sprintf( '<div id="top-nav">%2$s%1$s%3$s</div>', $nav, genesis_structural_wrap( 'nav', 'open', 0 ), genesis_structural_wrap( 'nav', 'close', 0 ) ); echo $nav_output; }
This new Top Navigation Menu is used to maintain the links for your social networks and RSS feed.
Second, install and activate the Genesis Social Profiles Menu plugin.
The plugin delivers 13 icons for popular social networks, mail and RSS, otherwise they would be text-only menu items. The detailed plugin instructions page shows how to add and size the social network icons. For instance, "twitter-prl-s16" gives you a 16x16 pixel Twitter icon.
We also need to add a small bit of code to the bottom of your style.css file to clean up theme integration:`.menu-top {
background: none !important;
}`Your menu options now look like this:
That should do it.
(You're going to have to change your handle, as you're no longer a complete novice.)
Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ] -
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.