Skip to content

How to add custom link to user top bar menu with jQuery

1 minute read

We will add "Link Name" to Google.com at position 3 in the user menu

2. Open /wp-content/themes/myhome/footer.php file

3. Backup this file for security reason

4. Add this code before </body>

css
<script>
    jQuery(window).on("load", function () {
        $(".mh-top-bar-user-panel__user-menu > li:nth-child(2)").append('<li><a href="http://google.com"><i aria-hidden="true" class="fa fa-link"></i> Link Name</a></li>');
    });
</script>

4. Save

More Info

You can modify "li:nth-child(2)" number to control position of the link:

1 = link position 2 2 = link position 3 3 = link position 4 4 = link position 5

Ask the people who build MyHome WPBakery

We answer by email from support@tangiblewp.com. With Premium Support, we also fix your site when something breaks.

Was this guide helpful?