Adding special characters into the rel attribute inside menu links

By default, WordPress strips out special characters inside its menu link’s relationship (rel) attribute. Here are a few ways how you solve this.

Adding special characters to every menu anchor's rel

In order to add special characters inside your WordPress menu link’s relationship attributes, you can add the following code into your theme’s functions.php file to add this to every link.

function custom_rel_for_menu_links( $items, $args ) {
     foreach ($items as $item) {
          $item->xfn = 'example:with#special@characters';
     }
     return $items;
}
add_filter( 'wp_nav_menu_objects', 'custom_rel_for_menu_links', 10, 2 );

Using jQuery to add custom rel attributes

You could also use jQuery to add custom rel attributes to your menu links which can contain special characters too.

jQuery( '.target-element' ).attr( 'rel', 'example:with#special@characters' );