在WordPress的CSS中选择页面的最有效方法是什么?

时间:2022-09-23 17:13:41

I want to add a background picture to a group of pages in wordpress.

我想在wordpress中为一组页面添加背景图片。

I want to add a different background picture to another group of pages

我想将另一张背景图片添加到另一组页面

Currently I am applying it to each individual page using PageID as in the code below. As there are over 1000 pages. Is there are a more simple way to apply to each group of pages?

目前,我正在使用PageID将其应用于每个页面,如下面的代码所示。因为有超过1000页。是否有更简单的方法应用于每组页面?

    .page-id-264 #header .logo a,
    .page-id-272 #header .logo a {
     background-image: url("http://www.richcoward.com/newcges/wp-content/uploads/2014/08/NWU-No-Frame.png") !important;
     background-size: 100% !important;
     background-repeat: no-repeat !important;
     height: 86px !important; 
     width: 416px !important;
     }

Thanks for your help

谢谢你的帮助

2 个解决方案

#1


0  

Here is a simple solution.

这是一个简单的解决方案。

Create a custom css (say mystyle.css) file in your theme folder. Add

在主题文件夹中创建自定义css(比如mystyle.css)文件。加

#header .logo a {
     background-image: url("http://www.richcoward.com/newcges/wp-content/uploads/2014/08/NWU-No-Frame.png") !important;
     background-size: 100% !important;
     background-repeat: no-repeat !important;
     height: 86px !important; 
     width: 416px !important;
     }

into your mystyle.css. Now, open up your functions.php and enqueue your stylesheet conditionally. Use is_page() or is_page_template() conditional checks. I believe that you are talking about groups of pages, so I would imagine that you use specific page templates for specific groups, so I would tend to go for is_page_template

进入你的mystyle.css。现在,打开你的functions.php并有条件地将样式表排入队列。使用is_page()或is_page_template()条件检查。我相信你在谈论的是一组页面,所以我想你会为特定的组使用特定的页面模板,所以我倾向于选择is_page_template

function enqueue_custom_style() {

  if(is_page_template('page-whatever.php')) {

    wp_enqueue_style('my-style', get_stylesheet_directory_uri() . '/mystyle.css' );

  }
}

add_action('wp_enqueue_scripts', 'enqueue_custom_style', 999);

This should give you an idea

这应该给你一个想法

#2


0  

You could use a filter in your functions.php file to add a class to all the relevant pages. You're still going to have to rattle off each Page ID, but I guess doing it in PHP will keep your CSS smaller (and therefore load faster):

您可以在functions.php文件中使用过滤器将类添加到所有相关页面。您仍然需要对每个页面ID进行调整,但我想在PHP中执行此操作会使CSS更小(因此加载速度更快):

// Add specific CSS class by filter
add_filter( 'body_class', 'my_class_names' );
function my_class_names( $classes ) {
    // array of Page IDs
    $pageids = array(264, 272);
    // if 
    if ( is_page( $pageids ) ) {
        // add 'class-name' to the $classes array
        $classes[] = 'class-name';
        // return the $classes array
        return $classes;
    }
}

Alternatively, create page templates for each background.

或者,为每个背景创建页面模板。

#1


0  

Here is a simple solution.

这是一个简单的解决方案。

Create a custom css (say mystyle.css) file in your theme folder. Add

在主题文件夹中创建自定义css(比如mystyle.css)文件。加

#header .logo a {
     background-image: url("http://www.richcoward.com/newcges/wp-content/uploads/2014/08/NWU-No-Frame.png") !important;
     background-size: 100% !important;
     background-repeat: no-repeat !important;
     height: 86px !important; 
     width: 416px !important;
     }

into your mystyle.css. Now, open up your functions.php and enqueue your stylesheet conditionally. Use is_page() or is_page_template() conditional checks. I believe that you are talking about groups of pages, so I would imagine that you use specific page templates for specific groups, so I would tend to go for is_page_template

进入你的mystyle.css。现在,打开你的functions.php并有条件地将样式表排入队列。使用is_page()或is_page_template()条件检查。我相信你在谈论的是一组页面,所以我想你会为特定的组使用特定的页面模板,所以我倾向于选择is_page_template

function enqueue_custom_style() {

  if(is_page_template('page-whatever.php')) {

    wp_enqueue_style('my-style', get_stylesheet_directory_uri() . '/mystyle.css' );

  }
}

add_action('wp_enqueue_scripts', 'enqueue_custom_style', 999);

This should give you an idea

这应该给你一个想法

#2


0  

You could use a filter in your functions.php file to add a class to all the relevant pages. You're still going to have to rattle off each Page ID, but I guess doing it in PHP will keep your CSS smaller (and therefore load faster):

您可以在functions.php文件中使用过滤器将类添加到所有相关页面。您仍然需要对每个页面ID进行调整,但我想在PHP中执行此操作会使CSS更小(因此加载速度更快):

// Add specific CSS class by filter
add_filter( 'body_class', 'my_class_names' );
function my_class_names( $classes ) {
    // array of Page IDs
    $pageids = array(264, 272);
    // if 
    if ( is_page( $pageids ) ) {
        // add 'class-name' to the $classes array
        $classes[] = 'class-name';
        // return the $classes array
        return $classes;
    }
}

Alternatively, create page templates for each background.

或者,为每个背景创建页面模板。