Get Parent Custom Taxonomy Term and Color Div background

Question

I am currently displaying posts from a CPT. Each has a taxonomy term from a parent. I would like to create a function that would color the background of a div of particular parent terms.

Here is my set up:

Lets call this Cars:

Domestic
--Dodge --Ford --Chrysler

Import
--Honda --Toyota --Kia

European
--BMW --Benz

The parent is Domestic, Import, European.

My posts displays as follows:

Ford
Post Title
Post Content

Toyota
Post Title
Post Content

Etc.

My goal is to color the DIV that the child term is held in. For example:

<div class="car_type">Ford</div> (background green)
Post Title<br> 
Post Content<br>

<div class="car_type">Toyota</div> (background red)
Post Title<br> 
Post Content<br>

I am trying to construct the following:

if (parent_term == 'domestic'){
.car_type{
background-color:green;
}
}

if (parent_term == 'import'){
.car_type{
background-color: red;
}
}

So far I have checked out get_terms. Any help pointing me in the right direction would be amazing.

Thank you, I hope this makes sense.

Answer 1

You'll have to adjust the markup to suit your specific needs, but the easiest solution would use a post_class filter on the post_class() template tag, to output appropriate classes.

For example, in your template, you need to call post_class(), such as:

<div <?php post_class(); ?>>
<div class="car_type">Ford</div> (background green)
Post Title<br> 
Post Content<br>
</div>

Then, filter post_class, using your term:

function wpse123081_add_post_classes( $classes, $class, $postid ) {

    // Custom Tax
    if ( 'carsCPT' == get_post_type( $postid ) ) {
        foreach ( (array) get_the_terms( $postid, 'carsTax' ) as $term ) {
            if ( empty( $term->slug ) )
                continue;
            $classes[] = 'term-' . sanitize_html_class( $term->slug, $term->term_id );
        }
    }
}
add_filter( 'post_class', 'wpse123081_add_post_classes', 10, 3 );

This will turn this:

<div <?php post_class(); ?>>

...into this:

<div class="term-carTaxTerm">

(along with other classes, of course)

And you can target your CSS accordingly.

Answer 2

Modified as shortcode:

function my_color_heading( $postid ) { // Custom Tax
    if ( 'jobs' == get_post_type( $postid ) ) {
        foreach ( (array) get_the_terms( $postid, 'department' ) as $term ) {
            if ( empty( $term->slug ) )
                continue;
            $classes[] = 'term-' . sanitize_html_class( $term->parent, $term->term_id );
     $classList = implode(" ",$classes);
     return "class= {$classList}";

        }

    }

}
add_shortcode('heading_colors','my_color_heading');

Thanks!!