正文 

当前位置： 首页 > 问答 >

如何将自定义 css 和 js 文件添加到 wordpress 的管理区域 [关闭]

     2023-03-06     7

关键词：

【中文标题】如何将自定义 css 和 js 文件添加到 wordpress 的管理区域 [关闭]【英文标题】：How do i add custom css and js files to admin area of wordpress [closed] 【发布时间】：2013-09-04 09:43:39 【问题描述】：

这个问题被问了太多次，并且有太多不同的问题，由于某种原因，我似乎无法在没有找到任何答案的情况下使用它。非常奇怪的是，我之前已经开发了主题并且它正在工作。

我需要为我的主题设置一些选项，所以我在 wordpress 管理区域中创建了单独的菜单并且它可以工作，我在该页面添加了一些选项并且它显示出来了，保存选项也可以工作。

现在我想多做一些选项，并使用 jquery ui 选项卡将它们标记为选项卡。我知道 wordpress 现在原生支持 jquery ui，但需要另外调用才能加载。

因此，在我最后弄乱了太多代码之后，我最终从 generatewp.com 网站上提取了一个应该可以工作的代码，但它没有，为什么我无法理解。

现在的代码是：

function custom_styles() 

wp_register_style( 'jquery-ui-style', 'http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css', false, false );



// Hook into the 'admin_enqueue_scripts' action
add_action( 'admin_enqueue_scripts', 'custom_styles' );


// Register Script
function custom_scripts() 

wp_register_script( 'jquery-ui-core', '', array( 'jquery' ), false, false );

wp_register_script( 'jquery-ui-tabs', '', array( 'jquery' ), false, false );



// Hook into the 'admin_enqueue_scripts' action
add_action( 'admin_enqueue_scripts', 'custom_scripts' );

根据 wordpress 记录，这应该注册 jquery ui 选项卡和样式，但它没有。

我尝试了许多其他组合，但它根本不起作用。为什么我无法理解。

【问题讨论】：

css-tricks.com/snippets/wordpress/… ***.com/questions/3326967/… 这个问题似乎是题外话，因为它是关于定制 wordpress 的支持请求。不仅在 wordpress 的产品文档中有说明，还有专门针对 Wordpress 的问答网站。 它不起作用。也试过了，但它适用于functions.php页面上的脚本，所以如果我有少量的javascript自定义部分，我应该将它包含在admin_head中，但如果脚本在单独的js文件中，我应该首先注册，而不是像我一样排队明白了。 @AleksandarĐorđević 你说得对，我只看到注册功能我没有看到排队。尝试在脚本挂钩中添加 wp_enqueue_script( 'jquery-ui-core' ); 和 wp_enqueue_script( 'jquery-ui-tabs' ); 函数。它可以帮助您完成这些工作。 【参考方案1】：

直接来自 codex @admin_enqueue_scripts 有特定的钩子可以做你想做的事情。

function my_enqueue($hook) 
    if( 'edit.php' != $hook )
        return;
    wp_enqueue_script( 'my_custom_script', plugins_url('/myscript.js', __FILE__) );

add_action( 'admin_enqueue_scripts', 'my_enqueue' );


function load_custom_wp_admin_style() 
        wp_register_style( 'custom_wp_admin_css', get_template_directory_uri() . '/admin-style.css', false, '1.0.0' );
        wp_enqueue_style( 'custom_wp_admin_css' );

add_action( 'admin_enqueue_scripts', 'load_custom_wp_admin_style' );

【讨论】：

该钩子仅在您针对特定页面的情况下使用，您也可以在没有钩子的情况下使用它，但它会加载到所有页面上，我已经阅读了 codex，所以如果在函数 i 中，请按照 codex使用 wp_enqueue_scripts('jquery-ui') 并使用 add_action('admin_enqueue_scripts', 'my_enqueue') 激活它应该可以工作，但它没有 控制台在说什么？有什么具体的内容以及加载了哪些 JS 文件？ 它没有说任何错误，我没有收到任何 js 错误，wordpress 是全新安装的，我的主题中没有任何其他代码，除了我尝试包含的内容，它是就像functions.php文件中甚至没有动作钩子一样。 嗯，请告诉我，我很难过！ 花费这么多小时来调试一些没有人能得到解释的东西，而简单的 5 分钟重新安装可以修复它是如此令人沮丧。我的 wordpress 安装似乎出了点问题，要么没有正确完成，要么在服务器上复制 wordpress 期间某些文件丢失或未完成。我刚刚用全新安装重新安装了 wordpress，并用我到目前为止所做的复制了主题文件并且它工作了。

如何将自定义css和js添加到angular 4

】如何将自定义css和js添加到angular4【英文标题】：Howtoaddcustomcssandjstoangular4【发布时间】：2017-10-2919:05:32【问题描述】：在Angular2中，我可以像这样将它们添加到index.html中：<linkrel="stylesheet"href="css/mycss.css">但在Angular4中，它... 查看详情

将自定义 css 添加到 wordpress 中的页面模板

...为二十四主题创建了一个子主题并添加了一个页面模板。如何将自定义CSS添加到此模板。我发现添加到子主题的fun 查看详情

如何将自定义 css 工具提示添加到 extjs 列标题？

】如何将自定义css工具提示添加到extjs列标题？【英文标题】：Howaddcustomcsstooltiptoextjscolumnheader?【发布时间】：2012-02-2317:02:07【问题描述】：我是extjs的新手。我正在尝试添加工具提示，最好是基于列标题的css。如何使用css将自... 查看详情

如何将自定义 CSS 添加到清晰的表单中？

】如何将自定义CSS添加到清晰的表单中？【英文标题】：HowdoIaddcustomCSStocrispyforms?【发布时间】：2017-07-1810:00:32【问题描述】：我正在尝试借助脆皮表单为我的网站创建一个响应式表单。我没有使用引导程序，我想将自定义CSS添... 查看详情

php将自定义css文件添加到标头中(代码片段)

查看详情

在 ExtJS 中，如何将自定义 CSS 类添加到数据网格行？

】在ExtJS中，如何将自定义CSS类添加到数据网格行？【英文标题】：InExtJS,howtoaddacustomCSSclasstodatagridrows?【发布时间】：2011-11-3001:37:15【问题描述】：如何将自定义CSS类添加到数据网格中的行(Ext.grid.Panel)？我正在使用ExtJS4.0。【问... 查看详情

Django Allauth - 如何将自定义 CSS 类添加到字段？

】DjangoAllauth-如何将自定义CSS类添加到字段？【英文标题】：DjangoAllauth-Howtoaddcustomcssclasstofields?【发布时间】：2014-02-1713:27:41【问题描述】：在login.html我有：<formclass="login"method="POST"action="%url\'account_login\'%">%csrf_token%form.as_p到 查看详情

如何将自定义 CSS 添加到贝宝智能按钮

】如何将自定义CSS添加到贝宝智能按钮【英文标题】：HowtoaddcustomCSStopaypalsmartbuttons【发布时间】：2021-05-1600:30:23【问题描述】：我想要实现的实际上并不是让付款按钮背景为黑色，而是自定义颜色，例如，假设我希望它带有白... 查看详情

如何将自定义属性添加到 Symfony Doctrine YAML 映射文件

】如何将自定义属性添加到SymfonyDoctrineYAML映射文件【英文标题】：HowtoaddcustompropertytoSymfonyDoctrineYAMLmappingfile【发布时间】：2016-06-2721:09:21【问题描述】：谁能告诉我如何将自定义属性添加到学说ORMyml文件中？我的想法是添加这... 查看详情

如何将自定义要求添加到 buildozer.spec 文件

】如何将自定义要求添加到buildozer.spec文件【英文标题】：HowcanIaddcustomrequirementtobuildozer.specfile【发布时间】：2021-07-1717:12:22【问题描述】：我的buildozer.spec文件如下所示。requirements=python3,mysql-connector-python,plyer,android,futures,datetime,... 查看详情

如何将自定义挂钩添加到 Woocommerce 的自定义插件

】如何将自定义挂钩添加到Woocommerce的自定义插件【英文标题】：HowtoaddcustomhookstoacustompluginforWoocommerce【发布时间】：2018-11-3020:33:00【问题描述】：我们已经为Woocommerce支付集成开发了一个自定义插件，我们需要在我们的插件文... 查看详情

如何将自定义对象添加到 xib 文件的“对象”部分？

】如何将自定义对象添加到xib文件的“对象”部分？【英文标题】：Howtoaddacustomobjecttothe\'Objects\'sectionofaxibfile?【发布时间】：2014-08-2205:47:49【问题描述】：这是myearlierquestion的后续问题我想知道如何将Controller添加到左侧的“对... 查看详情

如何将自定义 jar 文件添加/复制到 Kafka MirrorMaker 中？

】如何将自定义jar文件添加/复制到KafkaMirrorMaker中？【英文标题】：Howtoadd/copyacustomjarfileintoKafkaMirrorMaker?【发布时间】：2022-01-0310:03:12【问题描述】：我正在开发一些自定义主题名称映射，并从中生成了一个jar文件。由于我使用... 查看详情

将自定义 css 添加到 React-Bootstrap 组件

...tstrapComponent【发布时间】：2020-06-1903:36:44【问题描述】：如何在Nav组件中添加一些自定义CSS样式来管理nav项之间的填充并使其浮动在页面右侧？constnavbar=props=>(<NavbarcollapseOnSelectexpand="lg"bg="dark 查看详情

SSIS将自定义标题添加到Excel文件

】SSIS将自定义标题添加到Excel文件【英文标题】：SSISaddCustomHeadertoExcelfile【发布时间】：2018-10-2700:08:50【问题描述】：我们正在使用SSIS将数据转储到excel文件中。需要在Excel文件中添加自定义页眉。下面的代码工作了很多年。（... 查看详情

如何使用 express.js 将自定义标头添加到 socket.io 的响应中？

】如何使用express.js将自定义标头添加到socket.io的响应中？【英文标题】：HowcanIoveraddcustomheaderstosocket.io\'sresponsewithexpress.js?【发布时间】：2020-07-2419:07:04【问题描述】：我正在尝试使用以下命令覆盖CORS政策：-app.use(\'/\\*\',function(... 查看详情

是否可以在我的 Assets 文件夹中仅使用一个样式表将自定义 CSS 添加到 Xamarin 中的 WebView？

】是否可以在我的Assets文件夹中仅使用一个样式表将自定义CSS添加到Xamarin中的WebView？【英文标题】：IsitpossibletoaddcustomCSStoaWebViewinXamarinusingONLYONEstylesheetinmyAssetsfolder?【发布时间】：2019-10-1308:47:35【问题描述】：我见过多个tutoria... 查看详情

如何将自定义按钮添加到 UINavigationBar？ [复制]

】如何将自定义按钮添加到UINavigationBar？[复制]【英文标题】：HowtoaddcustombuttonstoaUINavigationBar?[duplicate]【发布时间】：2015-01-2807:12:14【问题描述】：正如我的问题所述，我正在尝试将自定义按钮添加到UINavigationBar。AFAIK，您只能... 查看详情