Question

我需要在Wordpress网站的主菜单按钮上添加特定的CSS类。我在网站的“标题”>“主菜单”>“菜单中的最后一个项目”下使用Astra主题-我选择使用按钮。我将按钮用作登录按钮，并尝试使用WPmembers插件设置动态登录/注销链接。幸运的是，WPmembers具有处理动态登录/注销链接的功能。为了使用它，菜单项必须具有正确的CSS类。

按现状，我看不到用于编辑按钮的默认CSS类的选项（它不在WP-Admin>外观>菜单下（就像这是正常的菜单项一样）。

我使用过开发人员检查器，并且按钮当前具有CSS类（只是不正确的类）。我可以通过在Wordpress上添加自定义CSS来更改此设置吗？我在Google上搜索了一下，发现了一些有关使用JQUERY的文章。addclass（“ your_custom_class_here”）我不知道JQUERY是什么，并且尝试使用自定义CSS编辑器，但是它似乎无法识别.addclass函数。

有人有任何建议吗？非常感谢，盖伊

**该按钮当前具有一类ast-custom-button *我需要它是“ wpmem_loginout”

link to my site here

编辑：

感谢安德烈（Andrey）提供此代码：

add_action('wp_head', 'login_out_button', 10);

function login_out_button() { ?>
<script>
jQuery(document).ready(function(){
jQuery("button.ast-custom-button").addClass("wpmem_loginout");
});
</script>
<?php
}

问题：

我已将代码添加到my-custom-function.php文件中它似乎有效，但不完全符合我的预期。使用检查器，我可以看到它已将类“ wpmem_loginout”添加到现有类“ button.ast-custom-button”的末尾，因此我最终得到了class =“ ast-custom-button wpmem_loginout”。

有人能建议对删除旧类的代码进行编辑吗？

谢谢，盖伊

Answer 1

jQuery是一个JavaScript库，有多种方法可以将JavaScript代码添加到WordPress。
其中之一是创建一个插件并向其中添加JavaScript代码：

<?php
/**
 * Plugin Name: Extra Code
 * Plugin URI: http://www.myplugin.com/my-first-plugin
 * Description: Important codes
 * Version: 1.0
 */
add_action('wp_head', 'login_out_button', 10);

function login_out_button() { ?>
<script>
    jQuery(document).ready(function(){
        jQuery(".ast-custom-button")
            .addClass("wpmem_loginout")
            .removeClass("ast-custom-button");
    });
</script>
<?php
}

创建扩展名为.php的文件，并添加上面的代码。然后使用刚刚创建的.zip文件创建.php存档，并以通常的方式将其上传到WordPress。

如何将自定义CSS类添加到Wordpress的Astra Theme的主菜单按钮上

1 个答案: