• WordPress后台如何添加自定义 CSS 或 JS 代码
  • WordPress后台如何添加自定义 CSS 或 JS 代码-WP新手学园

    如果你想要改造后台的布局或者增加一些CSS,那么首先第一步就是需要在后台加载JS或者CSS文件,如果不想加载文件,直接输出CSS以及JS都是可以的。

    那么这里提供几段代码,大家可以依葫芦画瓢,了解每个代码使用的钩子是什么作用,了解之后你就会明白到底是什么意思了

    加载JS文件

    加载CSS文件

    直接插入CSS

    通过代码我们不难看出,加载JS文件和CSS文件都是同一个钩子,只不过加载不同类型的文件使用的函数不一样,一个是style,一个是script,正好对应的就是类型文件,这样记忆的话,我相信瞬间就明白了。

    同样的,两个函数的使用方式都是相似的,除了最后一个参数不一样,针对CSS是针对不同类型的媒体自定义加载,而JS则是选择是否在底部加载。

    具体的两种函数说明如下:

  • wp_enqueue_script() 函数介绍
  • 函数用法
  • wp_enqueue_script( string $handle, string $src = '', string[] $deps = array(), string|bool|null $ver = false, bool $in_footer = false )

    Enqueue a script.

  • 功能介绍
  • Registers the script if $src provided (does NOT overwrite), and enqueues it.

      WP_Dependencies::add()
      WP_Dependencies::add_data()
      WP_Dependencies::enqueue()
  • 参数介绍
  • $handle

    (string)
    (Required)
    Name of the script. Should be unique.

    $src

    (string)
    (Optional)
    Full URL of the script, or path of the script relative to the WordPress root directory.

    Default value: ''

    $deps

    (string[])
    (Optional)
    An array of registered script handles this script depends on.

    Default value: array()

    $ver

    (string|bool|null)
    (Optional)
    String specifying script version number, if it has one, which is added to the URL as a query string for cache busting purposes. If version is set to false, a version number is automatically added equal to current installed WordPress version. If set to null, no version is added.

    Default value: false

    $in_footer

    (bool)
    (Optional)
    Whether to enqueue the script before instead of in the . Default 'false'.

    Default value: false

  • 返回值
  • 暂无数据
  • wp_enqueue_style() 函数介绍
  • 函数用法
  • wp_enqueue_style( string $handle, string $src = '', string[] $deps = array(), string|bool|null $ver = false, string $media = 'all' )

    Enqueue a CSS stylesheet.

  • 功能介绍
  • Registers the style if source provided (does NOT overwrite) and enqueues.

      WP_Dependencies::add()
      WP_Dependencies::enqueue()
  • 参数介绍
  • $handle

    (string)
    (Required)
    Name of the stylesheet. Should be unique.

    $src

    (string)
    (Optional)
    Full URL of the stylesheet, or path of the stylesheet relative to the WordPress root directory.

    Default value: ''

    $deps

    (string[])
    (Optional)
    An array of registered stylesheet handles this stylesheet depends on.

    Default value: array()

    $ver

    (string|bool|null)
    (Optional)
    String specifying stylesheet version number, if it has one, which is added to the URL as a query string for cache busting purposes. If version is set to false, a version number is automatically added equal to current installed WordPress version. If set to null, no version is added.

    Default value: false

    $media

    (string)
    (Optional)
    The media for which this stylesheet has been defined. Accepts media types like 'all', 'print' and 'screen', or media queries like '(orientation: portrait)' and '(max-width: 640px)'.

    Default value: 'all'

  • 返回值
  • 暂无数据
  • 如果你看不明白我说了,这里直接提供一个地址,可以很好或者说非常全面的说明这两个函数之间的差别,不过是英文,大家借助翻译工具了解一下:
    https://developer.wordpress.org/themes/basics/including-css-javascript/

  • 订阅站点了解最新技巧
  • 任何有用的技巧我们均将通过邮件告知你
  • 点击订阅
    高级设置
  • 0
    大惊
    0
    大笑
    0
    发呆
    0
    恶魔
    0
    流泪
    0
    调皮
    0
    笑出泪
    0
    犯困
    0
    坏笑
    0
    疑问
  • 版权声明:整理不易,如无特殊说明,文章内容均为本站原创,转载请注明出处
  • 本文标题:WordPress后台如何添加自定义 CSS 或 JS 代码
  • 本文链接:https://www.wpxsxy.com/227.html [点击复制]
  • W*******
  • 2830776172
  • qweqw
  • qwe
  • 啥都没有,没啥好看的
    主页
    关注
    聊天
    给HTML动态添加CSS
  • 上一篇:
  • 给HTML动态添加CSS
  • 通过使用WebP提高站点加载速度
  • 下一篇:
  • 通过使用WebP提高站点加载速度
  • 相关推荐
    文章评论
    提交评论
    分类推荐