当前位置: 首页 > 知识库问答 >
问题:

Wordpress导航栏中的自定义短代码

慕容宏邈
2023-03-14

我只想在我的wordpress主题菜单栏中添加一个快捷键,用于处理引导模式视图功能。

我尝试了在菜单中使用“快捷码”插件,但它不起作用。我在菜单中找不到短代码的替代插件,所以我安装了“bootstrap3shortcodes”插件,它创建了我想要的按钮和模式视图内容。但我无法在菜单栏中添加快捷码。

我努力想找到关于我的问题的答案。但遗憾的是不能。

这是我的模态短代码生成的Bootstrap 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”]

我该怎么做?我可以在函数中编写函数。还是尝试其他方法?

非常感谢。


共有3个答案

巫化
2023-03-14

我不确定提供这个短代码的结果是什么。在我看来,你们可以看到一个按钮,当你们点击然后显示模型窗口,你们想实现导航菜单上的按钮。我没有测试这些代码,但如果这对您有帮助,您可以尝试。

首先创建一个新的php文件并将所有短代码内容放在那里。我的情态。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]

在你的主题函数中。php创建一个新函数并包含此文件。

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

在导航内容中添加短代码输出。我不确定我认为简码只给按钮,其他部分是隐藏的,当你点击按钮时可见。

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);
罗学真
2023-03-14
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);
蒙才
2023-03-14

如果您共享您的短代码生成标记,或者您希望用您的短代码包装什么标记,最好让其他人清楚地理解。

无论如何,试试这个,它会工作顺利(测试)

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

随意更改您的菜单主题位置。

希望有意义。

 类似资料:
  • 修改聊天页面导航栏背景色、导航栏上增加自定义按钮、修改导航栏上图标按钮颜色等 /** 聊天窗口导航栏 @param navigationBar 导航栏 */ - (void)ntalker_navigationBar:(UIView *)navigationBar { navigationBar.backgroundColor = [UIColor redColor];//修改导航栏背景色 }

  • Navbar 自定义导航栏 平台差异说明 App H5 微信小程序 支付宝小程序 百度小程序 头条小程序 QQ小程序 √ √ √ √ √ √ √ 基本使用 默认情况下,该组件只有向左的箭头,点击可以返回上一页,如果您想将自定义导航栏用在tabbar(不存在要返回的逻辑)页面,应该将is-back设置为false, 这样会隐藏左边的返回图标区域。 如果想在返回箭头的右边自定义类似"返回"字样,可以将

  • 本文向大家介绍Android自定义顶部导航栏控件实例代码,包括了Android自定义顶部导航栏控件实例代码的使用技巧和注意事项,需要的朋友参考一下 下面一段代码给大家介绍了android 自定义顶部导航栏控件功能,具体代码如下所示: 总结 以上所述是小编给大家介绍的Android自定义顶部导航栏控件实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家

  • 问题内容: 我正在尝试在导航栏的中心添加自定义视图,并且正在使用以下代码对其进行测试: 我在视图控制器的viewDidLoad方法中进行设置,但是当我运行程序时,导航栏中似乎没有任何变化。 你能帮我吗? 问题答案: 这可行。初始化时给框架

  • 我想在我的自定义PHP文件中显示wpdatatables(插件),所以我想使用“do_shortcode()”函数,但没有任何效果,它只是显示白色屏幕。 我的php文件代码:

  • 本文向大家介绍Fullpage.js固定导航栏-实现定位导航栏,包括了Fullpage.js固定导航栏-实现定位导航栏的使用技巧和注意事项,需要的朋友参考一下 FullPage.js 是一个简单而易于使用的插件,用来创建全屏滚动网站(也被称为单页网站)。除了可以创建全屏滚动效果以外,也可以给网站添加一些水平的滑块效果。能够自适应不同的屏幕尺寸,包括平板电脑和移动设备。 开始制作自己的个人简历啦,决