【问题标题】:Giving a widget my own id or class in Wordpress在 Wordpress 中为小部件提供我自己的 id 或类
【发布时间】:2020-09-01 08:02:47
【问题描述】:

我正在编写一个带有小部件的 Wordpress 插件。在我的 jQuery 代码中,我想指向那个小部件,所以我虽然给它一个 HTML ID 会很好。 (已编辑,感谢指出。)

在互联网(和 Codex)上进行一些搜索后,我知道我可以为主题中的小部件提供 ID,但这不是我想要的。这种方法有缺陷。更改主题可能会导致错误(当然, 知道必须在 functions.php 中更改它,但这只是 meh)。另一件事是我的小部件有一个数字,可能会在我不知道的情况下发生变化。

所以为了 100% 确定它可以工作并且将来可以工作,我可以给我的小部件我自己的 ID 吗?

【问题讨论】:

    标签: wordpress widget


    【解决方案1】:

    我可能不完全理解您的问题以及 "ID" 是什么意思(小部件 ID 或实际的 HTML div ID - 实际上是一个并且相同..)但是如果您已阅读 codex,请参阅示例那里给出了一个 ID ..

    function __construct() {
            parent::__construct(
                'foo_widget', // Base ID
                __('Widget Title', 'text_domain'), // Name
                array( 'description' => __( 'A Foo Widget', 'text_domain' ), ) // Args
            );
        }
    

    做同样的事情的另一种方法(如果你在谈论HTML 元素,比如divs - 你可以分配一个class

    function My_Widget() {  
        function My_Widget() {  
            $widget_ops = array( 'classname' => 'example', 'description' => __('A widget that displays nothing ', 'example') );  
            $control_ops = array( 'width' => 300, 'height' => 350, 'id_base' => 'example-widget' );  
            $this->WP_Widget( 'example-widget', __('Example Widget', 'example'), $widget_ops, $control_ops );  
        }  
    

    请注意,分子将根据启动的实例数自动添加到您的小部件的 ID,例如:

    foo_widget
    foo_widget-2
    foo_widget-3
    

    等等……

    编辑我 - 在 cmets 之后

    无论如何,恕我直言,在小部件中硬编码固定的ID 是一个坏主意,原因很简单,从开发人员的角度来看,小部件的偏好是始终允许支持多个实例。在小部件上的任何位置给出HTML ID 将导致验证错误,并且在jQuery 的情况下 - 还有JS 错误,原因很简单,如果用户将有 2 个小部件,它也会有一个重复的 ID。

    换句话说 - 这与您在原始问题中的陈述完全相反。

    所以为了 100% 确定它有效并且将来会有效,我可以给我的吗? 小部件我自己的 ID

    为您的小部件提供一个固定的硬编码 ID 实际上将确保它不会在 100% 的时间内工作。

    首选总是使用class(或div[id^="my_widget_id"]之类的东西)来解决此类问题,并让wordpress“做这件事”(通过自动递增ID)。

    出于完全相同的原因 - 主题在 register sidebar() 函数中应该始终具有相同的结构,如下所示:

    <?php $args = array(
        'name'          => __( 'Sidebar name', 'theme_text_domain' ),
        'id'            => 'unique-sidebar-id',
        'description'   => '',
            'class'         => '',
        'before_widget' => '<li id="%1$s" class="widget %2$s">', // LOOK AT THIS LINE 
        'after_widget'  => '</li>',
        'before_title'  => '<h2 class="widgettitle">',
        'after_title'   => '</h2>' ); ?>
    

    这将允许特定的侧边栏auto increment 小部件的ID,以避免上述问题。

    来自法典:

    before_widget - HTML 放置在每个小部件之前(默认值:'')注意:使用 sprintf 作为变量 替代

    话虽如此,如果您坚持在某处提供硬编码的固定 ID(而不是上述方法),您始终可以将其放在嵌套的 divspan INSIDE 小部件中的 HTML 输出,但我认为如果你仔细阅读了这个答案 - 你现在会避免它。

    现在,- 由于您没有在问题中包含任何代码(这在 SE 上始终是一种不好的做法),因此我无能为力。如果您遇到任何针对没有 ID 的小部件的问题 - 我建议您打开一个新问题,并可能在此处指向 cmets 的链接,以便我自己(和其他人)可以帮助您..

    【讨论】:

    • 感谢您的回答,但我的意思是避免修改主题的 functions.php 文件。没有办法吗?
    • 对不起,我从您的原始问题中了解到您正在编写自己的小部件。
    • 是的,我是。但是我希望我的小部件可以与其他主题一起使用,这就是为什么我不想依赖主题的 function.php 文件。这很糟糕吗?
    • @Martin Fejes - 不,没什么不好。但这里有两种可能性,1.我不明白你的问题/问题,或者 2.你不明白小部件是如何工作的。如果你的代码正确 - 小部件的 ID 将是 HTML ID什么主题将显示它。我已经编写了数十个小部件(大多数都带有某种 jQuery)并且从来没有遇到过任何问题。也许你应该更好地说明你的问题(也许是一些代码??)。
    • 抱歉,这是我的第一个小部件。也许我误解了你。当我修改我的小部件的构造以赋予它一个 ID 时,我仍然必须在主题的 register_sidebar 中设置 before_widget。我错过了什么吗?我可以只在我的小部件上更改 before_widget 吗?
    猜你喜欢
    • 2011-07-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-08-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多