【问题标题】:How to customize wordpress function: the tags?如何自定义 wordpress 功能:标签?
【发布时间】:2012-12-11 14:11:45
【问题描述】:

在我的 wordpress 帖子中,我包含了使用 wordpress 功能的标签

<?php the_tags( $before, $sep, $after ); ?> 

我的实际 Css :

.postclass{
  margin:10px 0px 10px 0px;
  }

.posttag{
  font-size:10px;
  float:left;
  color:#212121;
  margin-right:15px;
  padding:5px;
  border-radius:2px;
  background:black;
}

在我的模板中:

<div class="postclass">
     <?php the_tags( '<p class="posttag">', ',', '</p>' ); ?>
</div>

这为我提供了相同黑色背景的所有标签。如何获取每个带有黑色背景的标签文本,每个标签用逗号分隔?

【问题讨论】:

  • 抱歉,您并没有真正解释您要达到的目标。也许一些屏幕截图可以提供帮助?
  • 看到这个jsfiddle.net/XxN2W/1

标签: php css wordpress post tags


【解决方案1】:

以下示例:http://codex.wordpress.org/Function_Reference/get_the_tag_list

<div class="postclass">
     <?php the_tags( '<p class="posttag">', '</p><p class="posttag">', '</p>' ); ?>
</div>

这会将所有标签单独包装在&lt;p class="posttag"&gt;[link]&lt;/p&gt;中。

更接近你的 jsfiddle 的东西:

PHP

<?php the_tags( '<ul class="postclass"><li>', ',</li><li>', '</li></ul>' ); ?>

CSS

ul.postclass li {
    float: left;
}
ul.postclass li a {
    padding: 5px;
    background-color: black;
}

使用the_tags(),您无法自定义&lt;a&gt;-tag 本身,就像在您的jsfiddle 中一样。你只能把它包起来。为了实现这一点,您必须使用get_the_terms(),它将返回一个标签对象数组,您可以对其进行后处理。

【讨论】:

  • 它不分离标签。这样所有标签都带有相同的黑色容器。
  • 我不知道您的代码中发生了什么,但这应该可以。我试图为我的答案添加一些解释,也许这会有所帮助。如果没有,请提供代码中的相关部分
  • 这个 Jsfiddle 不是实际的代码,它只是为了显示我想要实现的结果。
  • 如何从中删除锚标记。只有
  • 标签名称
【解决方案2】:

这应该可行:

  1. 在您的 WordPress post.php 中添加一个 div 类,后跟标签函数,如下所示:
<div class="postclass">
<?php echo esc_html__( '', 'posttag' ); ?>
</div>

如果您需要在每个标签前加上“#”,请添加这个。

<div class="postclass">
<?php echo esc_html__( '', 'posttag' ); ?><?php the_tags( "#", "#" ); ?>
</div>
  1. 在您的 CSS 上:
.postclass{
  font-size:10px;
}
.postclass a{
  text-decoration: none;
  padding:5px 10px;
  font-size:10px;
  color:white;
  border-radius:3px;
  background:black;
}

工作样本:https://koreanwave.org
(在桌面上:悬停在图像底部)
(在移动设备上:悬停@USER-NAME)

【讨论】:

  • 虽然此代码可能会解决问题,但 including an explanation 关于如何以及为何解决问题将真正有助于提高您的帖子质量,并可能导致更多的赞成票。请记住,您正在为将来的读者回答问题,而不仅仅是现在提问的人。请edit您的答案添加解释并说明适用的限制和假设。
猜你喜欢
相关资源
最近更新 更多
热门标签