Custom shortcode in Wordpress Nav Bar Custom shortcode in Wordpress Nav Bar wordpress wordpress

Custom shortcode in Wordpress Nav Bar


If you share your shortcode generate markup or what markup you want to wrap with your shortcode that would be best to others understand clearly.

anyway try this it will work smoothly (Tested)

add_filter( 'wp_nav_menu_items', 'wpse3967385_custom_menu_link', 10, 2 );function wpse3967385_custom_menu_link( $items, $args ) {   if ($args->theme_location == 'primary_nav') {      $items .= '<li class="your-custom-item">' . do_shortcode( '[modal text="Download Now" title="Veteriner Hekimlere Ulaşmanın En Kolay Yolu" xclass="btn btn-primary btn-lg"]' ) . '</li>';   }   return $items;}

Feel free to change your Menu theme location.

Hope it make sense.


function my_function_name($item_output) {    if( YOUR LOGIC FOR WHEN YOU WANT IT )       $item_output .= do_shortcode('[modal text="Download Now" title="Veteriner Hekimlere Ulaşmanın En Kolay Yolu" xclass="btn btn-primary btn-lg"]');    return $item_output;}add_filter('wp_nav_menu', 'my_function_name', 10, 1);


I am not to sure what is result provide this shortcode. In my idea you can see a button when you click then show model window and you want to implement button on nav menu. I didn't tested these code but you can try if this helpful for you.

First create a new php file and put all shortcode content there. Ex. my-modal.php

//my-modal.php[modal text="Download Now" title="Veteriner Hekimlere Ulaşmanın En Kolay Yolu" xclass="btn btn-primary btn-lg"]<p style="text-align: center;"><img src="http://web-test.vetmapp.com/wp-content/uploads/sites/2/2016/08/vetmapp-logo-withtext.png" alt="Logo" width="200" height="300" /></p><h4 style="text-align: center;">VetMapp'i cihazınıza göre aşağıdaki platformlardan cep telefonunuza ücretsiz olarak indirebilir ve hemen kullanmaya başlayabilirsiniz.</h4><p style="text-align: center;">  <a href="https://itunes.apple.com/tr/app/vetmapp-acil-veteriner-klinikleri/id969463902?mt=8" target="_blank"><img src="http://web-test.vetmapp.com/wp-content/uploads/sites/2/2016/09/180x40xapple-store.png.pagespeed.ic.z0I7tHw8h6.png" alt="App Store'dan indir!" width="135" height="40" /></a>  <a href="https://play.google.com/store/apps/details?id=com.esmobileinc.vetmapp&hl=tr"  target="_blank"><img src="http://web-test.vetmapp.com/wp-content/uploads/sites/2/2016/09/180x40xgoogle_play.png.pagespeed.ic.31v8JAmtbI.png" alt="Google Play'den indir!" width="135" height="40" /></a>  <a href="https://www.microsoft.com/tr-tr/store/p/vetmapp/9nblggh4s3qm"  target="_blank"><img src="http://web-test.vetmapp.com/wp-content/uploads/sites/2/2016/09/180x40xwindows_phone.png.pagespeed.ic.xvoiaCiuDP.png" alt="Windows Store'dan indir!" width="135" height="40" /></a></p>[modal-footer] [button type="primary" style="border: solid 1px #18bda3; background-color: #fff; color: #18bda3;" link="#" data="dismiss,modal"]Kapat[/button] [/modal-footer] [/modal]

In your theme function.php create a new function and include this file.

function modal_shortcode_content(){  ob_start();  include "my-modal.php";  $shortcode_content = ob_get_content();  ob_clean();  return do_shortcode($shortcode_content);}

Add shortcode output in nav content. I am not sure i think shortcode gives button only and other part is hide and visible when you click on button.

function navigation_add_button_menu($item_output) { // apply any logic here...       $item_output .= modal_shortcode_content();    return $item_output;}add_filter('wp_nav_menu', 'navigation_add_button_menu', 10, 1);