twentysixteen social links menu

Hi there,

to add the social links menu in the footer go to Appearance -> Customize -> Menus. Then click on “Add a Menu”, add the name of the menu (for example, Social Links) and click “Create Menu”. Now click “Add Items”, choose “Custom Links” and add the URL to your social network profile and the link text. When you finish adding your items, check the “Social Links Menu” box in the “Menu Locations” section. Press “Save & Publish” and your social icons will appear in the footer.

Thanks, but how can we move the social menu to a custom menu widget in the sidebar AND keep the icons? Whenever I put this menu in the sidebar it does not show the icons, it only shows the link text ??

I, too, am seeing text only not icons in my twentysixteen-child theme. Twenty fifteen seems to be handling this with no problems on other sites, so maybe it is a twenty sixteen bug?

I’ve the same issue, Social Menù works fine at the bottom but inserted in a widget only shows text ad not icons, did anyone che help..?

Thanks

If anyone knows, I would like to have external (social) links open in a new window. Anyone know how to do that on twentysixteen?

Twenty Sixteen is styled that the icons appear only when you’re in the menu in that specific location (in the footer). If you want the icons to appear on menus in other places on the page, you’ll need to find the id or class of that new menu area and copy the styles from the social-navigation menu to your new menu’s styles. Make sure you use a custom CSS plugin or child theme to protect your original theme.

To open links in a new menu, when you create your link, make sure you check the ‘open in a new window’ box. ??

@PositivelyRandly

To make the links open in a new window go in: Appearence->Menu and from the top select screen property anche check “Link destination” or Show advanced links property..

When you create a custom links to the social networks and add them to the Social Link Menu the icons will appear somewhere on the footer. First Add a menu under Appearance -> Menu -> Add Menu, then create custom links to for example facebook.com and ADD them to the Social Links Menu or Social Menu. The Icons will appear.

My second question is, i thought the links/icons are also supposed to appear automatically somewhere on the header once you have activated them?

Check the following code for the header

<?php if ( has_nav_menu( 'primary' ) || has_nav_menu( 'social' ) ) : ?>
					<button id="menu-toggle" class="menu-toggle"><?php _e( 'Menu', 'twentysixteen' ); ?></button>

					<div id="site-header-menu" class="site-header-menu">
						<?php if ( has_nav_menu( 'primary' ) ) : ?>
							<nav id="site-navigation" class="main-navigation" role="navigation" aria-label="<?php _e( 'Primary Menu', 'twentysixteen' ); ?>">
								<?php
									wp_nav_menu( array(
										'theme_location' => 'primary',
										'menu_class'     => 'primary-menu',
									 ) );
								?>
							</nav><!-- .main-navigation -->
						<?php endif; ?>

						<?php if ( has_nav_menu( 'social' ) ) : ?>
							<nav id="social-navigation" class="social-navigation" role="navigation" aria-label="<?php _e( 'Social Links Menu', 'twentysixteen' ); ?>">
								<?php
									wp_nav_menu( array(
										'theme_location' => 'social',
										'menu_class'     => 'social-links-menu',
										'depth'          => 1,
										'link_before'    => '<span class="screen-reader-text">',
										'link_after'     => '</span>',
									) );
								?>
							</nav><!-- .social-navigation -->
						<?php endif; ?>

Footer Code

<?php if ( has_nav_menu( 'primary' ) ) : ?>
				<nav class="main-navigation" role="navigation" aria-label="<?php _e( 'Footer Primary Menu', 'twentysixteen' ); ?>">
					<?php
						wp_nav_menu( array(
							'theme_location' => 'primary',
							'menu_class'     => 'primary-menu',
						 ) );
					?>
				</nav><!-- .main-navigation -->
			<?php endif; ?>

			<?php if ( has_nav_menu( 'social' ) ) : ?>

				<nav class="social-navigation" role="navigation" aria-label="<?php _e( 'Footer Social Links Menu', 'twentysixteen' ); ?>">
					<?php
						wp_nav_menu( array(
							'theme_location' => 'social',
							'menu_class'     => 'social-links-menu',
							'depth'          => 1,
							'link_before'    => '<span class="screen-reader-text">',
							'link_after'     => '</span>',
						) );
					?>
				</nav><!-- .social-navigation -->
			<?php endif; ?>

How can i add the social icons somewhere on the header, far right?

I decided to go the FontAwesome route (small workaround) to get the icon in the widget area.