在wordpress中动态更改帖子标题颜色

Question

我想像这样动态更改帖子标题颜色

<h3 class="green">Post title 1</h3>
<p>post Text</p>

<h3 class="blue">Post title 1</h3>
<p>post Text</p>

<h3 class="orange">Post title 1</h3>
<p>post Text</p>

<h3 class="red">Post title 1</h3>
<p>post Text</p>

<h3 class="yello">Post title 1</h3>
<p>post Text</p>

我限制posts_per_pge = 5，所以当新帖子广告的标题颜色更改为绿色

任何想法我怎么能这样做........想法

Answer 1

你可以这样做： 首先为每个帖子添加一个自定义字段，然后决定该帖子标题的颜色

现在只需在查询中获取此元字段并更改标题样式

<h2 style="color:<?php echo $meta_color; ?>"> <?php the_title(); ?> </h2>

这对你有帮助......

Answer 2

使用变量对其进行计数，并将其5返回零。然后使用它来回显不同的类。例如：

$post_count=0;
$class = "";
if (have_posts() ){....
$post_count .= 1;

if($post_count == 1) $class = "green";
// same with 2, 3, 4 and so on

<h3 class="<? echo $class; ?>">title</h3>      
<p>post Text</p> 

if($post_count == 4) $post_count = 0;

}// end loop

Answer 3

虽然Dk-Macadamias解决方案更灵活（允许您在每个帖子的基础上更改颜色），但更自动的替代方案是让帖子顺序决定并输出预定数组的颜色。

在模板文件中：

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<h3 class="<?php echo get_post_color_class(); ?>"><?php the_title(); ?></h3>
<?php endwhile; endif; ?>

在你的functions.php中

function get_post_color_class() { //Declare our custom function
  global $wp_query; //Import the global $wp_query object
  $colors = array('green','blue','orange','red','yellow'); //Declare our array of colors

  return $colors[$wp_query->current_post]; //Return the item in our array with the same index as the current post in the loop
}

Answer 4

如果要在两种颜色之间进行更改，可以这样做。此功能实际上将计入页面上的所有帖子，而不是查看全局帖子ID

function get_post_color_class() { //Declare our custom function
  global $wp_query; //Import the global $wp_query object
  $colors = array('#D8D32B','#D12F4E'); //Declare our array of colors
  return $colors[($wp_query->current_post % 2 != 0) ? 0 : 1];
  //Return the item in our array with the same index as the current post in the loop
}

在我的情况下，我想改变和更改wordpess中帖子的边框颜色。我在content.php中这样做了：

<article id="post-<?php the_ID(); ?>" <?php post_class( ); ?>
style="border-left-color:<?php echo get_post_color_class(); ?>" >

超过两种颜色是这样的：

function get_post_color_class() { //Declare our custom function
  global $wp_query; //Import the global $wp_query object
  $colors = array('#D8D32B','#D12F4E', '#009562'); //Declare our array of colors
  if($wp_query->current_post % 3 == 0){
     return $colors[2];
  }

  if($wp_query->current_post % 2 == 0){
     return $colors[1];
  }
  return $colors[0];
}

另外你可以用CSS解决它：

http://www.w3schools.com/cssref/sel_nth-of-type.asp

这应该更优雅，更快。