将小部件的标题添加为ID-用于锚定链接

时间:2015-10-15 作者:mizuki

我目前正在构建一个WordPress主题,其中我的页面由小部件组成。一个小部件是页面的一部分。我希望能够使用锚定链接,为此,我希望将小部件的标题作为小部件的ID输出。

我知道小部件已经有了和ID,但它会导致丑陋的锚链接-锚链接将是url.com/#text-2. 我希望是这样url.com/#about.

在源代码中,这是默认的HTML输出:

<div id="text-2" class="widget-container widget_text">

这是我的目标HTML输出:

<div id="text-2 about" class="widget-container widget_text">

我如何做到这一点?

提前感谢!

更新:

HTML元素似乎不能有两个ID。

是否可以改为添加<a> 控件中的元素widget-title 其中<a> 小部件的标题是什么?

因此HTML输出如下所示:<h2 class="widget-title"><a id="about">About</a></h2>

2 个回复
最合适的回答,由SO网友:Gareth Gillman 整理而成

是的,您可以在小部件的标题周围添加一个,您可以在register\\u边栏代码中这样做,您可以将其放入函数中。php

add_action( \'widgets_init\', \'theme_register_sidebars\' );
function theme_register_sidebars() {
 register_sidebar(
  array(
   \'id\' => \'mysidebar-sidebar\',
   \'name\' => __( \'My Sidebar\', \'themename\' ),
   \'description\' => __( \'Widgets for my sidebar\', \'themename\' ),
   \'before_widget\' => \'<div class="widget">\',
   \'after_widget\' => \'</div>\',
   \'before_title\' => \'<h2 class="widget-title"><a id="about">\',
   \'after_title\' => \'</a></h2>\'
  )
 );
}
创建新的“小部件区域”或侧栏,然后将其放入实际的小部件中。

jQuery版本(未测试):

jQuery(document).ready(function($){
 $( \'#id h2.widget-title\').wrapInner( "<a id="about"></a>" );
});
然后将jQuery添加到JS文件中Enqueue 或使用同名过滤器将其放入wp\\U页脚(link)

SO网友:Anselmo Coelho

我在寻找一种更简单的方法,我只添加了一个<span id="youranchornametag">First words/text of the element</span>现在你可以在你喜欢的地方叫它http://.../#youranchornametag.

相关推荐

Calculations in functions.php

我为自己创建了一个发票主题,并试图在自定义列中获取发票总额。我已经尝试调整模板页面中使用的代码,以便在函数中显示这一点。php文件,但它不工作。我的乘法操作数出现了一个操作数错误,我不知道为什么。这是我的代码(如有任何帮助,将不胜感激)。if( $column_name == \'invoice_total\' ) { $hours = 0; // This allows counting of each sub_field //* Set repeater va