How to add a Custom Link to a Menu with an URL that is relative to the blog URL

Question

Part of my work is to create Wordpress websites. I usually work on my laptop until I have something good enough to be uploaded to the test server where the client reviews it.

I create a VirtualHost for every new project so I'm always working with a Wordpress installation in a domain that looks like http://local.example.com/, but when the site is uploaded to the test server (not controlled by me), the domain may end being something like http://testserver.com/arbitrary/path/example/.

The problem is that if I add a custom link to a menu that points to, for example, /events/, it would work fine locally creating a link to http://local.example.com/events/, but in the test server the link will point to http://testserver/events/, which is obviously not right.
What I want is to give the custom link an URL that would work both on my local environment and the test server.

I already handle the problem of changing the home and siteurl Wordpress options by:

• changing those settings on the local database
• creating a dump of the database
• update the database on the server
• restoring the local options.

I don't want to use full URLs for the custom links and having to replace those with the server URL every time I need to update the server's database.

For links inside the post content there is a plugin that solve the problem adding two shortcodes: http://wordpress.org/extend/plugins/url-shortcodes/, but I haven't been able to find something similar for Custom Links.

Answer 1

check this out;

will loop through the links in your menu, fig­ure out which ones don’t begin with a “/” or “http” and prepend them with your site’s URL and a “/”

Answer 2

I have tried and got the result for it. Here i explained how i did it.

First you have to install the this plugin for url short-code -> http://wordpress.org/extend/plugins/peters-blog-url-shortcodes/

Add this code to your functions.php file with your theme.

class description_walker extends Walker_Nav_Menu{
  function start_el(&$output, $item, $depth, $args)
  {
       global $wp_query;
       $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

       $class_names = $value = '';

       $classes = empty( $item->classes ) ? array() : (array) $item->classes;

       $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
       $class_names = ' class="'. esc_attr( $class_names ) . '"';

       $output .= $indent . '<li id="menu-item-'. $item->ID . '"' . $value . $class_names .'>';

       $attributes  = ! empty( $item->attr_title ) ? ' title="'  . esc_attr( $item->attr_title ) .'"' : '';
       $attributes .= ! empty( $item->target )     ? ' target="' . esc_attr( $item->target     ) .'"' : '';
       $attributes .= ! empty( $item->xfn )        ? ' rel="'    . esc_attr( $item->xfn        ) .'"' : '';

          //echo $item->url;
          $string = explode('::', $item->url, 3);
          if($string[1]){
            $string[1] = str_replace('-',' ', $string[1] );
            $item->url = do_shortcode("[$string[1]]"); 
          }

       $attributes .= ! empty( $item->url )        ? ' href="'   . esc_attr( $item->url        ) .'"' : '';

       $prepend = '<strong>';
       $append = '</strong>';
       $description  = ! empty( $item->description ) ? '<span>'.esc_attr( $item->description ).'</span>' : '';

       if($depth != 0)
       {
                 $description = $append = $prepend = "";
       }

            $item_output = $args->before;
        $item_output .= '<a'. $attributes .'>';
        $item_output .= $args->link_before .$prepend.apply_filters( 'the_title', $item->title, $item->ID ).$append;
        $item_output .= $description.$args->link_after;
        $item_output .= '</a>';
        $item_output .= $args->after;

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
        } }

Then you have to call this function from wp_nav_menu from the templates files.

$arg = array( 'menu'  => "main-menu", 'echo' => true, 'fallback_cb' => 'wp_page_menu', 'depth' => 0, 'walker' => new description_walker() ); 

wp_nav_menu( $arg );

Thats it. Then go to the back-end with menu section.

For example i want to give the page URL to custom link.

I will add like this -----> http://::blogurl-id='1302'::

That's All.

Now you can go to the front-end and check the shortcode will work.

Thanks.