【问题标题】:How to link multiple CSS files with WordPress如何使用 WordPress 链接多个 CSS 文件
【发布时间】:2013-08-08 05:22:20
【问题描述】:

我知道要链接您使用的 WordPress 主 style.css 文件:

<link href="<?php bloginfo('stylesheet_url');?>"rel="stylesheet" type="text/css"/>

但是我有很多 CSS 文件需要链接到主 PHP 文件,用于滑块、图片框等...

我不太确定该怎么做,因为 &lt;?php bloginfo('stylesheet_url');?&gt; 仅适用于名为 styles.css 的样式表,而我的其他样式表都有不同的名称。

有谁知道我怎样才能把它们都涂上墨水?

【问题讨论】:

  • @import 是一种低技术选项。

标签: php css wordpress hyperlink


【解决方案1】:

只需将所有样式表放在目录wp-content\themes\twentyeleven\css 中即可。然后您可以通过简单地在下面的代码链接所有这些-

<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/style1.css" />
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/style2.css" />
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/style3.css" />
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/style4.css" />

享受编码。

【讨论】:

    【解决方案2】:

    您的源代码不包含文件名... bloginfo('stylesheet_url') 仅返回指向您的样式表的链接...文件夹 URL,通常是主题文件夹。您还需要附加文件夹(如果有)和 filename.css

    记住在编码时始终牢记 WordPress 标准。链接到样式表不是最佳实践。这可以实现适当的缓存和效率,并且从长远来看更容易。

    来自我上周末阅读的免费 300 页书 - WordPress AJAX,第 53 页:

    // load styles + conditionally load an IE 7 stylesheet
    add_action('init', 'my_theme_register_styles');
    function my_theme_register_styles() { 
    //Register styles for later use 
        wp_register_style('my_theme_style1', get_stylesheet_directory_uri() . '/style1.css', array(), '1.0', 'all'); 
        wp_register_style('my_theme_style2', get_stylesheet_directory_uri() . '/style2.css', array('my_theme_style1'), '1.0', 'all'); 
        wp_register_style('my_theme_style3', get_stylesheet_directory_uri() . '/style3.css', array('my_theme_style1', 'my_theme_style2'), '1.0', 'all'); 
        global $wp_styles; 
        $wp_styles->add_data( 'my_theme_style3', 'conditional', 'lte IE 7' );
    }
    

    把它放在你的functions.php 或你的header.php 中。它正确地有条件地为 IE 加载样式表...

    【讨论】:

    • 我是否只需将'/style1.css' 替换为我自己的?
    • 是的,先生。这将注册并排入您的样式表。但请密切注意文件路径,以便它们符合您的需要。我有时会附和我的,以确保没有多余的斜杠或丢失的文件夹等。第三种样式将是您的 IE 样式表;) 甜吗?
    【解决方案3】:

    CSS 文件是否在当前主题的文件夹中?如果是这样,请尝试以下代码:

    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/what-ever.css" />
    

    它对我有用。

    【讨论】:

      【解决方案4】:

      如果您要对其进行硬编码,那么将样式添加到主题页面的最简单方法可能是: 1)将您的样式表添加到您的样式表目录。 2) 将此代码粘贴到您的脑海中(将 style2.css 替换为您的样式表名称)。

      <link href="<?php echo get_stylesheet_directory_uri().'/style2.css'; ?>" rel="stylesheet" />
      

      <link href="<?php blog_info('template_url').'/style2.css'; ?>" rel="stylesheet" />
      

      如果您的样式位于单独的文件夹中,只需确保将该文件夹附加到您的路径(即。/styles/style2.css)

      编辑:使答案更具体,以将样式链接添加到头部并修复了我的 src= 愚蠢错误,当它应该是 href=

      【讨论】:

      • 从未来发表评论,因为我比我写这个答案时多了将近 5 年的经验。虽然这在技术上可行,但更好、更合适的方法是将样式排入队列。
      【解决方案5】:

      您可以在 wordpress here 中使用 wp_enqueue_style() 函数。例子。

      wp_enqueue_style('my_style', plugin_dir_url(__FILE__) .'/path/to/your/stylesheet');
      

      您可以使用操作wp_enqueue_styles

      【讨论】:

      • 如何选择要链接的特定样式表?
      • 它们都将“链接”,出现在每个页面上。试一试并检查您的开发人员工具以查看正在加载哪些样式表。 WordPress 中的第一个样式表始终是主题文件夹中的 style.css。其他的都是额外的。
      猜你喜欢
      • 1970-01-01
      • 2014-04-11
      • 1970-01-01
      • 2021-07-11
      • 2012-11-07
      • 1970-01-01
      • 2017-11-20
      • 1970-01-01
      • 2015-06-14
      相关资源
      最近更新 更多