How To Add Facebook Link To Top Bar Navigation Menu On Owrdpress

Hi there,

I added the link in my social menu, but instead of displaying the link title, it but displays an icon(link icon).

That is the intended behaviour. The social menu does not display menu labels, only generates an icon based on the social media services you're linking to. If you enter a URL that'southward not supported in the card, it will testify a generic link icon instead.

For displaying text labels for card items, assign the menu as your primary carte du jour instead of the social menu.

I have already tried all my custom navigation carte. Get-go make them as social carte du jour and nevertheless shows the aforementioned outcome.

Only I don't know how to modify from social menu to some other menu in the top bar.

Open the Customizer and click on Menus. Select your menu.

On the Edit Menu page, uncheck the box next to Social Carte du jour in the Card Locations section below the carte du jour items, and bank check the box next to Header.

https://d.pr/i/0LZXJT

Distressing, I meant was in the site-height-bar.php
where it says

<?php karuna_social_menu(); ?>

I take already tried all my custom navigation menu. First make them as social card and still shows the same effect.

Is at that place any other way that I can put my custom links with link title in the pinnacle bar?
Delight assistance

This respond was modified ane year, 8 months ago by sahib195.

Then you're trying to configure your menu directly in the PHP files, instead of the menu interface of the Customizer?

In that case I tin can't help you. Our squad who provide support for Automattic themes are not developers, and we don't provide back up for custom lawmaking modifications to our themes.

I'm happy to leave this thread open in case someone else from the customs can help you lot, though.

I was just trying different options.
All I want to practise is put some links in my Elevation Bar menu such equally My Account etc. which display link title and do the job , if its possible.
Thanks

Hi there,

Please add the links to the card in the tiptop bar.

Then when information technology displays the link icon, endeavour adding the CSS beneath to the Cutomizer in Advent > Customize > Additional CSS.

The CSS should hide the icons and brandish text instead.

          /* Hibernate icons in the top bar social menu */ .top-bar .jetpack-social-navigation .icon {     display: none; }  /* Display text in the superlative bar social menu. Nosotros need to utilize !of import to overide the existing !important in the themes stylesheet */ .top-bar .jetpack-social-navigation .screen-reader-text {     position: relative !of import;     left: initial; }

Here'southward how it looks when I use the CSS on the theme demo site:

Karuna Call us 555 555 YOGA

If the CSS doesn't work for y'all, please keep it in the Customizer so I tin troubleshoot it further.

NO sorry It simply become transparent , Does not show icon or text
But information technology is there when you locate with mouse.

Please temporarily disable the carte prototype plugin, and then

ane. Supercede the earlier CSS with this:

          /* Hide icons in the top bar social menu */ .peak-bar .jetpack-social-navigation .icon {     display: none; }

ii. Install this plugin https://wordpress.org/plugins/insert-headers-and-footers/

iii. In Settings > Insert Header and Footer scripts, add this script to the footer:

          <script>  jQuery(".top-bar .jetpack-social-navigation bridge").removeClass("screen-reader-text");  </script>

This reply was modified one yr, eight months ago past Gary Barrett. Reason: Used jQuery to remove the .screen-reader-text from the social menu instead of using a bunch of CSS to override it