Wordpress Nav Barのカスタムショートコード

Question

私はちょうどbootstrap modal viewの機能を処理するために私のワードプレスのテーマメニューバーにショートコードボタンを追加したいと思います。

私は 'Shortcodes in Menus'プラグインを試しましたが、動作しません。メニューのショートコード用の代替プラグインが見つかりませんでしたので、 'Bootstrap 3 Shortcodes'プラグインをインストールしました。ボタンとモーダルビューのコンテンツを作成しました。しかし、ショートコードを私のメニューバーに追加することはできませんでした。

私は自分の問題についていくつかの回答を見つけようとしました。しかし、残念ながらできませんでした。

私のモーダルショートコードはによって生成されます。ブートストラップ3ショートコードプラグイン。

[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&amp;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] 

私はちょうどWPナビゲーションバーに[modal text="Download Now" title="Veteriner Hekimlere Ulaşmanın En Kolay Yolu" xclass="btn btn-primary btn-lg"]を使用します。

どうすればいいですか？私はこれのためにfunctions.phpに関数を書くことができますか、別のアプローチを試してみてください。

は、私はこのショートを提供結果がわからないようにしています

Answer 1

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); 

Answer 2

...ありがとう。私の考えでは、クリックしてモデルウィンドウを表示し、ナビゲーションメニューにボタンを実装したいときにボタンを見ることができます。私はこれらのコードをテストしなかったが、これがあなたに役立つ場合は試してみることができます。

最初に新しいPHPファイルを作成し、すべてのショートコードコンテンツをそこに置きます。 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&amp;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] 

あなたのテーマでは、新しい機能を作成し、このファイルを追加してください。

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

navコンテンツにショートコードの出力を追加します。ショートコードはボタンだけを与え、他の部分はボタンをクリックすると隠れて見えるとは思いません。

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); 

Answer 3

あなたのショートを共有している場合は、マークアップを生成するか、あなたは最高の他の人に明確に理解することでしょう、あなたのショートでラップしたいものをマークアップ。

とにかく、このことはスムーズに動作します（テスト済み）

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; 
} 

があなたのメニューのテーマの場所を変更すること自由に感じてみてください。

希望します。

Answer 4

あなたのコードはかなり乱雑です。あなたが理解できない別の言語になっているので、私はあなたに作業スクリプトを与えることはできません。私は何か混乱したくありません。

とにかくこれを試してください。これは、ショートコードを使用して、あなたが望むものを得るためのシンプルなロジックです。私は自分のウェブサイトを使っています。

function html_code() { 
    if(//Trigger Event Goes Here) { 
     // Use echo's to output the HTML of the window 
    } 
} 

function modal_window() { 
    html_code(); 

    return ob_get_clean(); 
} 

add_shortcode('modal_window');