更改Wordpress中某个类别中帖子的CSS

时间:2017-04-11 14:39:08

标签: css wordpress

我是Wordpress和CSS的新手,我希望你们能帮助我。 我想更改特定类别下所有帖子的sitelogo .site-branding的位置。

我可以根据自己的喜好更改style.css中的site-branding,但它会影响整个网站,包括所有网页,帖子和类别。

.site-branding {
    left: 50%;
    position: absolute;
    top: 40%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);

希望你们能帮助我。

提前致谢。

5 个答案:

答案 0 :(得分:1)

WordPress使您能够通过将其名称添加到样式表(通常是“category-x”)来定位类别,然后您可以唯一地定位您的CSS中的任何和所有类别。

Here's a great step by step article for targeting this class in your css

一个例子可能是:

<body class="archive category category-agriculture category-40">

将类别 - 农业作为您想要定位的类:

body.category-agriculture .site-branding {color: red;}

答案 1 :(得分:1)

感谢您的努力,但我得到了一些帮助并解决了问题。

我将此过滤器添加到我的functions.php

window.location.href = 'http://mywebsite.com/?language='+preferredLanguage;

该过滤器会将类别名称作为类添加到单个帖子上的function pn_body_class_add_categories( $classes ) { // Only proceed if we're on a single post page if ( !is_single() ) return $classes; // Get the categories that are assigned to this post $post_categories = get_the_category(); // Loop over each category in the $categories array foreach( $post_categories as $current_category ) { // Add the current category's slug to the $body_classes array $classes[] = 'category-' . $current_category->slug; } // Finally, return the $body_classes array return $classes; } add_filter( 'body_class', 'pn_body_class_add_categories' );

例如,如果该类别名为“新闻”,则会将body作为单个帖子上的类添加到正文中。

完成后,您可以使用该正文类仅针对新闻类别中的单个帖子定位category-news,如下所示:

.site-branding

答案 2 :(得分:0)

你可能需要Javascript和Jquery。

因此,如果这是您的网址结构:www.mysite.com/home/category /,

(function($){
var $pathArray = window.location.pathname.split('/');
var $location = pathArray[2]
var $branding = $(".site-branding")
if ($location == 'cat1' || $location == 'cat2') {
    $branding.css({
        'left' : '50%',
        'position' : 'absolute',
        'top' : '40%',
        '-webkit-transform' : 'translate(-50%, -50%)',
        '-ms-transform' : 'translate(-50%, -50%)',
        'transform' : 'translate(-50%, -50%)'
    });
}
});

假设您正在wordpress实例上运行子主题(如果不是,那么你肯定应该这样做),你可以在header.php文件的底部添加这个脚本。

答案 3 :(得分:0)

为此,我认为您必须在header.php中添加一个PHP条件,检查当前帖子是否属于该特定类别,然后在您的徽标标记中添加另一个更改其位置的类。

会是这样的:

    while(running)
    {
        System.out.println("Your current balance is: " + balance);
        System.out.println("How much would you like to gamble this round?");
        gamble = scan.nextInt();

        if(gamble > balance)
        {
            System.out.println("Error : Cannot gamble more than your balance");
            System.out.println("Enter a new bet less than " + balance);
            gamble = scan.nextInt();
        }

        System.out.println("Dealing cards...");
        if(deck >= 3)
        {
        card1 = rand.nextInt(12) + 2;
        card2 = rand.nextInt(12) +  2;
        card3 = rand.nextInt(12) + 2;
        deck = deck - 3;
        }
        else
        {
            System.out.println("Not enough cards left in the deck");
            System.out.println("Ending simulation...");
        }

        System.out.println("Your first card value is : " + card1);
        System.out.println("Your second card value is : " + card2);

        if(card1 == card2)
        {
            System.out.println("Same value for both cards! You win 2 chips!");
            balance = balance + 2;
            System.out.println("Play again? Type 'Y' for yes or 'N' for no");
            playAgain = scan.next();
            if(playAgain == "Y")
            {
                break;
            }
            else
            {
                running = false;
            }
        }

答案 4 :(得分:0)

Wordpress可能会将类别添加为正文标记。 如果您的主题是这样,那么您可以为类别添加特定的CSS规则。

.category .site-branding {
    /* your css rules here */
}