WordPress: Add Alternate Text on Menu Hover

In Blog, Wordpress Tutorials by Laura0 Comments

This post will show you how to add alternate text on hover when navigating your wordpress menu.

onhover

Step 1: 

In your wordpress menu editor (/wp-admin/nav-menus.php) simply add the alternate text you would like to display in the Title Attribute section when editing your menu items.

Screen Shot 2014-03-11 at 3.16.42 PM

Step 2:

Upload JS file in your child theme directory. It can be put anywhere in that directory, just as long as you update the directory in the custom_header_scripts function (see below). I put my file in – “/home/wordpress/public_html/wp-content/themes/child-theme/includes/js/”

Step 3:

Add the following code to your child theme functions.php file

Step 4: 

You will optionally need to style these rollover items. There is a class called .hebrew to all those hover elements. In your CSS, you can style .hebrew however you like.

Leave a Comment