Question

我需要在我的Wordpress主题中的类别名称中添加HTML，以便我可以将名称定义为图标（通过Twitter引导程序）。

示例代码如下：

<a href="link">
<i class="icon-briefcase"></i>
</a>

这会将类别名称显示为链接图标。

有没有办法做到这一点。我无休止地搜索过，我能找到的唯一Wordpress插件只允许将HTML添加到类别描述中。

提前致谢。

Answer 1

我认为你想要做的事情可以很容易地解决这个问题：

<?php 
foreach((get_the_category()) as $category) { 
    echo '<a href="link">';
    echo '<i class="icon-briefcase">' . $category->cat_name . '</i>';
    echo '</a>'; 
} 
?>

这会使所有类别名称看起来像链接图标，就像你说的那样。如果您希望每个名称都有不同的图标，您当然可以添加条件语句，以根据类别名称或ID呈现不同的HTML。

编辑：

因为您想使用Twitter Bootstrap，您需要为链接分配css类以显示图标。有两种方法可以做到这一点。其中一个原因是您可以将您的类别命名为与图标相同。例如，名为“briefcase”的类别将呈现带有“icon-briefcase”类的链接。代码：

<?php 
    // Iterate through the available categories
    foreach((get_the_category()) as $category) { 
        echo '<a href="link">'; // Display a link
        echo '<i class="icon-' . $category->cat_name . '">' . $category->cat_name . '</i>'; // Create the <li>
        echo '</a>';
    } 
    ?>

第二种方式，我认为内容目的更好（选择猫名称的更多自由），将在代码中使用条件语句将图标分配给某些类别。例如：

<?php 
        // Iterate through the available categories
        foreach((get_the_category()) as $category) {
            // First define a default css name class to use
            $iconclass = 'icon-default';
            // Then using an if statement, assign a new css class name to the variable based on the name of the category
            if($category->cat_name == 'Travel') { $iconclass = 'icon-briefcase'; } 

            echo '<a href="link">'; // Display a link
            echo '<i class="'. $iconclass . '">' . $category->cat_name . '</i>'; // Create the <li>
            echo '</a>';
        } 
        ?>

我希望这很清楚。

Answer 2

我认为你想要的只是Category Icons插件。

Answer 3

我刚才有类似的要求，要在同一个列表中的某些类别名称（但不是其他类别）上添加一个大写字母。我发现这样做的最简单方法是使用CSS。这就是我最终做的事情

#projects-term-4 h5 a:before {
    content:'H';
    font-size:80px;
    display:block;
    margin-bottom:10px;
    color:white;
}

#projects-term-5 h5 a:before {
    content:'S';
    font-size:80px;
    display:block;
    margin-bottom:10px;
    color:white;
}

... etc

你可能会在不知道任何PHP编码或安装任何额外插件的情况下使用这种方法来实现一个非常简单的解决方法。您只需要检查生成的页面的html代码，即可获得所需的类名和ID。

在Wordpress的类别名称字段中使用HTML

3 个答案: